<template>
	<view class="page">
		<view
			style="position: absolute; top: 0;text-align: center;width: 100%;padding-top: 5px;color: #000;z-index: 99;font-weight: bold;">
			德阳高新区企业服务中心</view>
		<view style="position: absolute; top: 0; width: 100%;z-index: 0;">
			<image src="../../static/bg.png" style="width: 100%; height: 450rpx;"></image>
		</view>
		<view class="main">
			<view class="logo">
				<image src="../../static/logo_new.png" mode="widthFix"></image>
			</view>
			<view class="main-top">
				<view style="width: 68%;">
					<!-- 搜索 -->
					<view class="search-head">
						<view class="search">
							<image src="../../static/fdj.png"></image>
							<text></text>
							<input type="text" v-model="selectName" placeholder="搜索关键词1" @input="getMoHuList()" />
						</view>
						<view class="btn">
							<text>搜索</text>
						</view>
					</view>
					<mo-hu-search :show="selectShow" :list="comList" @select="select" label-name="name" value-name="id"
						categoryId-name="categoryId"></mo-hu-search>
				</view>
				<view style="width: 30%;">
					<view class="main-top-right">
						<view>
							<image src="../../static/cloudy.png"></image>
						</view>
						<view>
							<view class="main-top-right-text">{{lowerTemp}}～{{higherTemp}}°C</view>
							<view>{{currentTime}}</view>
						</view>
					</view>
				</view>
			</view>

			<!-- 菜单导航 -->
			<view class="menu-nav">
				<scroll-view scroll-x @scroll="ScrollMenu" class="nav-list">
					<view class="nav">
						<view class="list" @click="construct">
							<image src="../../static/nav/nav_ico1.png"></image>
							<text>党的建设</text>
						</view>
						<view class="list" @click="datain">
							<image src="../../static/nav/nav_ico2.png"></image>
							<text>数据填报</text>
						</view>
						<view class="list" @click="Feedback">
							<image src="../../static/nav/nav_ico3.png"></image>
							<text>意见反馈</text>
						</view>
						<view class="list" @click="official">
							<image src="../../static/nav/nav_ico4.png"></image>
							<text>公文办理</text>
						</view>
						<view class="list" @click="notice">
							<image src="../../static/nav/nav_ico5.png"></image>
							<text>公示公告</text>
						</view>
					</view>
					<view class="nav">
						<view class="list" @click="neighbor">
							<image src="../../static/nav/nav_ico6.png"></image>
							<text>邻居计划</text>
						</view>
						<view class="list" @click="map">
							<image src="../../static/nav/nav_ico7.png"></image>
							<text>企业地图</text>
						</view>
						<view class="list" @click="talent">
							<image src="../../static/nav/nav_ico8.png"></image>
							<text>人才服务</text>
						</view>
						<view class="list" @click="policy">
							<image src="../../static/nav/nav_ico9.png"></image>
							<text>政策法规</text>
						</view>
						<view class="list" @click="news">
							<image src="../../static/nav/nav_ico10.png"></image>
							<text>新闻信息</text>
						</view>
					</view>
				</scroll-view>
			</view>

			<view class="banner-tu">
				<!-- <image src="../../static/img/img1.png" mode="widthFix"></image> -->
				<!-- <uni-swiper-dot :info="info" :current="current" field="content" :mode="mode">
					<swiper class="swiper-box" @change="change">
							<swiper-item v-for="(item ,index) in info" :key="index">
								<view class="swiper-item">
									<image :src="item.content" mode="widthFix"></image>
								</view>
							</swiper-item>
						</swiper>
				</uni-swiper-dot> -->
				<liu-slide-img style="height: 100%;" :list="info" :autoplay="autoplay" :interval="interval"
					@click="click">></liu-slide-img>
			</view>
			<view class="new-content">
				<view class="new-title">
					<view>
						<image src="../../static/nav/nav_ico5.png"></image>
					</view>
					<view class="new-title-right">
						<view class="new-title-big">公示公告</view>
						<view class="news-title-more" @click="notice()">更多...</view>
					</view>
				</view>
				<view class="news-text" v-for="(it,index) in noticeHighThree" :key="index" @click="onNotice(it.id)">·
					{{it.title}}
				</view>
				<!-- <view class="news-text">·做好“第八届中国( 成都智慧产业国际博览会”组织工作的通知</view>
				<view class="news-text">·德阳高新区 2022年政府信息公开工作年度报告</view> -->
			</view>
			<view class="new-content">
				<view class="new-title">
					<view>
						<image src="../../static/nav/nav_ico10.png"></image>
					</view>
					<view class="new-title-right blue">
						<view class="new-title-big">园区快讯</view>
						<view class="news-title-more" @click="news">更多...</view>
					</view>
				</view>
				<!-- <view class="news-img">
					<image src="../../static/img/img01.png"></image>
				</view> -->
				<view class="news-text" v-for="(it,index) in newsHighThree" :key="index" @click="onArticle(it.id)">·
					{{it.title}}
				</view>
				<!-- <view class="news-text news-text-left">·高新区组织召开全体干部职工大会</view>
				<view class="news-text news-text-left">·市人大工业经济发展代表专业小组在高新区开展</view> -->
			</view>
			<view class="new-content">
				<view class="new-title">
					<view>
						<image src="../../static/nav/nav_ico9.png"></image>
					</view>
					<view class="new-title-right black">
						<view class="new-title-big">政策法规</view>
						<view class="news-title-more" @click="policy">更多...</view>
					</view>
				</view>
				<view class="news-text" v-for="(it,index) in policyHighThree" :key="index" @click="onPolicyDE(it.id)">·
					{{it.title}}
				</view>
				<!-- <view class="news-text">·国家发展改革委办公厅关于规范招标投标领域信用评价应用应用应用应用</view>
				<view class="news-text">·四川省人民政府办公厅印发《关于进一步激发市场活力推动发市场活力推动</view> -->
			</view>
		</view>
		<!-- tabbar -->
		<TabBar :tabBarShow="0"></TabBar>
	</view>
</template>

<script>
	import request from '@/utils/request.js'
	import TabBar from '../../components/TabBar/TabBar.vue';
	import utils from '../../service/utils';
	import moHuSearch from '../../components/qj-fuzzy-search/index.vue'
	export default {
		components: {
			TabBar,
			moHuSearch
		},
		data() {
			return {
				slideNum: 0,
				newsList: [],
				noticeList: [],
				policyList: [],
				newsHighThree: [],
				noticeHighThree: [],
				policyHighThree: [],
				city: '',
				cityCode: '',
				cityName: '',
				// 最低温度
				lowerTemp: '',
				// 最高温度
				higherTemp: '',
				// 时间
				currentTime: '',
				selectShow: false,
				comList: [],
				selectName: '',
				selectId: '',
				categoryId: '',
				baseUrl: "https://www.dygxq-es.cn",
				info: [],
				// current:0,
				mode: 'round',
				autoplay: true,
				interval: 3000
			}
		},
		onShow() {
			// this.getLocation()
			this.getNewsList()
			this.getNoticeList()
			this.getPolicyList()
			this.getTianQi()
			this.getLunboList()
		},
		onReady() {
			uni.hideTabBar();
		},
		methods: {
			// change(e) {
			// 	this.current = e.detail.current;
			// },
			// 获取新闻列表
			getNewsList() {
				let that = this
				that.API.getNewsList({
					categoryId: '530363088214426885'
				}).then(res => {
					console.log("新闻", res)
					that.newsList = res.data.list
					// that.newsHighThree = that.newsList.sort(function(a, b) {
					// 	return a.ViewCount - b.ViewCount
					// }).slice(-3)
					that.newsHighThree = that.newsList.slice(0, 3);
					that.newsList = JSON.parse(JSON.stringify(that.newsList.map(it => {
						return {
							...it,
							// createTime:utils.formatTime(it.createTime)
							createTime: utils.formatTime(it.createTime)
						}
					})))
					console.log(that.newsHighThree)
				})
			},
			getLunboList() {
				request({
					url: '/api/system/DataInterface/570845601671939333/Actions/Response',
					method: 'get',
					data: {}
				}).then(res => {
					console.log('轮播图', res.data)
					if (res.code == 200) {
						let list = res.data.map(it => {
							return {
								...it,
								F_ImageUrl: JSON.parse(it.F_ImageUrl)
							}
						})

						let arr = list.map(it => {
							return {
								src: this.baseUrl + it.F_ImageUrl[0].url
							}
						})
						arr.forEach(it => {
							this.info.push(it)
						})
						console.log('轮播图', arr)
						console.log('轮播图', this.info)
					}
				})
			},
			// 首页模糊查询
			getMoHuList() {
				this.selectShow = true
				if (this.selectName === '') {
					this.selectShow = false
				} else {
					request({
						url: '/api/SubDev/zyoaarticle',
						method: 'get',
						data: {
							keyword: this.selectName
						}
					}).then(res => {
						console.log('模糊查询', res.data)
						if (res.code === 200) {
							let arr = res.data.list
							this.comList = arr.map(it => {
								return {
									...it,
									name: it.title
								}
							})
							this.comList = JSON.parse(JSON.stringify(this.comList))
							console.log('mohu', this.comList)
						}
					})
				}

			},
			select(item) {

				this.selectName = item.name;
				this.selectId = item.id
				this.categoryId = item.categoryId
				console.log("栏目ID", this.categoryId)
				if (this.categoryId == '360233879019193605' || this.categoryId == '360233879019193605') {
					this.onArticle(this.selectId)
				} else {
					this.onNotice(this.selectId)
				}
				// if()
				this.selectShow = false;
			},
			// 获取公示公告列表
			getNoticeList() {
				let that = this
				that.API.getNoticeList({
					categoryId: '360234116366468357'
				}).then(res => {
					console.log("公示公告", res)
					that.noticeList = res.data.list
					// that.noticeHighThree = that.noticeList.sort(function(a, b) {
					// 	return a.ViewCount - b.ViewCount
					// }).slice(-3)
					// 直接获取前三条公告
					that.noticeHighThree = that.noticeList.slice(0, 3);
					that.noticeList = JSON.parse(JSON.stringify(that.noticeList.map(it => {
						return {
							...it,
							createTime: utils.formatTime(it.createTime)
						}
					})))
					console.log(that.noticeHighThree)
				})
			},
			// 获取政策法规列表
			getPolicyList() {
				let that = this
				that.API.getPolicyList().then(res => {
					console.log("政策", res)
					that.policyList = res.data.list
					// that.policyHighThree = that.policyList.sort(function(a, b) {
					// 	return a.ViewCount - b.ViewCount
					// }).slice(-3)
					that.policyHighThree = that.policyList.slice(0, 3);
					that.policyList = JSON.parse(JSON.stringify(that.policyList.map(it => {
						return {
							...it,
							createTime: utils.formatTime(it.createTime)
						}
					})))
					console.log(that.policyHighThree)
				})
			},
			policy() {
				uni.navigateTo({
					url: '/pages/policy/policy'
				})
			},
			news() {
				uni.navigateTo({
					url: '/pages/news/news'
				})
			},
			construct() {
				uni.navigateTo({
					url: '/pages/construct/construct'
				})
			},
			notice() {
				uni.navigateTo({
					url: '/pages/notice/notice'
				})
			},
			datain() {
				uni.navigateTo({
					url: '/pages/datain/datain'
				})
			},
			Feedback() {
				uni.navigateTo({
					url: '/pages/Feedback/Feedback'
				})
			},
			map() {
				uni.navigateTo({
					url: '/pages/map/map'
				})
			},
			official() {
				uni.navigateTo({
					url: '/pages/official/official'
				})
			},
			neighbor() {
				uni.navigateTo({
					url: '/pages/equip/equip'
				})
			},
			talent() {
				uni.navigateTo({
					url: '/pages/talent/talent'
				})
			},
			onArticle(item) {
				uni.navigateTo({
					url: `/pages/newsDetail/newsDetail?data=${JSON.stringify(item)}`
				})
			},
			onPolicyDE(item) {
				uni.navigateTo({
					url: `/pages/policyDetail/policyDetail?data=${JSON.stringify(item)}`
				})
			},
			onNotice(item) {
				uni.navigateTo({
					url: `/pages/newsDetail/newsDetail?data=${JSON.stringify(item)}`
				})
			},

			// 获取天气预报
			getTianQi() {
				uni.getLocation({
					type: 'wgs84',
					success: (res) => {
						const latitude = res.latitude;
						const longitude = res.longitude;
						console.log('经度' + longitude, '纬度' + latitude)
						// const latitude = 22.8092997; const longitude = 113.547439;
						// 将经纬度转换为城市名称
						uni.request({
							url: 'https://restapi.amap.com/v3/geocode/regeo',
							data: {
								key: '1ed58e357871f9bd1fbf19c480b7afea', //自己的高德密钥key
								location: `${longitude},${latitude}`
							},
							success: (res) => {
								const city = res.data.regeocode.addressComponent.city;
								this.cityName = city
								// 获取天气预报
								uni.request({
									url: 'https://restapi.amap.com/v3/weather/weatherInfo',
									data: {
										city: city,
										key: '1ed58e357871f9bd1fbf19c480b7afea', //自己的高德密钥key
										extensions: 'all'
									},
									success: (res) => {
										const weatherData = res.data.forecasts[0];
										console.log(res)
										console.log("总的", weatherData)
										console.log('当前城市：', city);
										console.log('天气信息：', weatherData[0]);
										var regEx = /-/g;
										var str = weatherData.reporttime.split(' ')[0]
										this.currentTime = str.replace(regEx, '/')
										console.log('currentTime', this.currentTime)
										this.lowerTemp = weatherData.casts[0].nighttemp
										this.higherTemp = weatherData.casts[0].daytemp
									},
									fail: (error) => {
										console.error('获取天气信息失败:', error);
									}
								});
							},
							fail: (error) => {
								console.error('获取城市名称失败:', error);
							}
						});
					},
					fail: (error) => {
						console.error('获取地理位置失败:', error);
					}
				});
			}
		}
	};
</script>

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