<template>
	<view class="page">
		<view class="main">
			<view class="top">
				<view><image src="../../static/nav/supply.png" mode="widthFix" @click="toSupply"></image></view>
				<view><image src="../../static/nav/demand.png" mode="widthFix" @click="toDemand"></image></view>
			</view>
			<!-- 明星企业 -->
			<view class="star_box">
				<view class="title_box">
					<view class="right">
						<view class="redDian" style=""></view>
						<span>明星企业</span>
					</view>
					<p @click="toAllCompany">查看更多 <image src="../../static/right.png"></image></p>
				</view>
				<!-- 下方轮播 -->
				<!-- <view class="swiper" style="margin-left: 20rpx;">
					<orange-longswiper :list="listData" :config="configData"  @tapMore="tapMore" @tapList="tapList"></orange-longswiper>
				</view> -->
				<piaoyiSwiper :imgList="imgList" :itemMargin="60" :autoplay="false" :interval="3000" :duration="1000"/>
			</view>
	
			<!-- 全部企业 -->
			<view class="all_box">
				<view class="title_box">
					<view class="right">
						<view class="redDian" style=""></view>
						<span>全部企业</span>
					</view>
					<p @click="toAllCompany()">查看更多 <image src="../../static/right.png"></image></p>
				</view>
				<view class="item_box" v-for="(item,index) in twentyList" @click="onCompany(item.id)">
					<image :src="baseUrl + item.logo" mode="" v-if="item.logo"></image>
					<image src="../../static/image/default_logo.jpg" v-else mode=""></image>
					<view class="right">
						<p>{{item.fullName}}</p>
						<p class="detail_limit">
							{{item.product}}&nbsp;&nbsp;{{item.yingyeshouru}}
						</p>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import piaoyiSwiper from '../../components/piaoyi-swiper/piaoyi-swiper.vue'
	import request from '@/utils/request.js'
	export default {
		components:{
			piaoyiSwiper
		},
		data() {
			return {
				imgList:[],
				type:'',
				// 此类所有公司
				allList:[],
				// 前五的明星企业
				fiveList:[],
				twentyList:[],
				baseUrl:'https://app.cehuimi.com'
				}
		},
		onLoad(options) {
			console.log(options)
			this.type = options.data
			console.log(this.type)
			this.getCompanyList()
		},
		methods: {
			// 获取对应分类的公司机构
			getCompanyList(){
				request({
					url:'/api/permission/organize',
					methos:'get',
					data:{stage:this.type}
				}).then(res=>{
					if(res.code === 200){
						console.log(this.type,res)
						this.allList = res.data.list
						this.fiveList = this.allList.sort(function(a,b){return a.ViewCount - b.ViewCount}).slice(-5)
						this.imgList = this.fiveList.map(it=>{
							return {
								...it,
								id:it.id,
								img:'../../static/image/default_logo.jpg',
								subject:it.fullName,
								detail:it.product
							}
						})
						this.twentyList = this.allList.slice(-20)
					}
				})
			},
			GoodsDetails() {
				uni.navigateTo({
					url: '/pages/GoodsDetails/GoodsDetails'
				})
			},
			// 跳转到需求中心
			toDemand(){
				uni.navigateTo({
					url: '/pages/demand/demand'
				})
			},
			// 跳转到供应中心
			toSupply(){
				uni.navigateTo({
					url: '/pages/supply/supply'
				})
			},
			// 跳转到所有企业
			toAllCompany(){
				uni.navigateTo({
					url:'/pages/allCompany/allCompany'
				})
			},
			onCompany(item){
				uni.navigateTo({
					url: `/pages/companyDetail/companyDetail?data=${JSON.stringify(item)}`
				})
			}
		}
	};
</script>

<style scoped lang="scss">
	@import 'equip.scss';
</style>
