<!-- 代煎反馈首页 -->
<template>
	<view class="djfkIndex">
		<!-- 头部 -->
		<view class="djfkIndex_header">
			<view class="info">
				<view class="info_img">
					<image :src="pageData.headImg" mode="center" class="headImg"></image>
				</view>
				<text class="userName">{{pageData.userName}}</text>
				<!-- <image :src="eyeIcon.nowIcon" class="eyeIcon" @click="changeState('header')"></image> -->
			</view>
			<view class="slogan">
				<image src="/static/slogan_header_img.png" class="slogan_img"></image>
			</view>
		</view>
		<!-- 标题 -->
		<view class="djfkIndex_title">
			<view class="title_left">
				<text>任务列表</text>
				<uni-badge class="uni-badge-left-margin" :text="pageData.taskNum" />
			</view>
			<view class="title_right" @click="toDetail">
				<text class="right_text">查看全部</text>
				<uni-icons type="right"></uni-icons>
			</view>
		</view>
		<!-- 任务列表 -->
		<view v-if="pageData.taskList.length!=0">
			<uni-card v-for="(item,index) in pageData.taskList" padding="0" spacing="0" class="djfkIndex_list">
				<view class="list_content">
					<view class="list_content_img">
						<image :src="pageData.statusIcon" class="statusIcon"></image>
					</view>
					<view class="list_item">质控名称</view>
					<view class="list_item_text">{{item.taskName}}</view>
				</view>
				<view class="list_content">
					<view class="list_item">质控日期</view>
					<view class="list_item_text">{{item.zkTime}}</view>
				</view>
				<view class="list_content">
					<view class="list_item">整改次数</view>
					<view class="list_item_text">{{item.zgState}}</view>
				</view>
				<view class="list_content">
					<view class="list_item">整改项数</view>
					<view class="list_item_text">{{item.zgxs}}</view>
				</view>
				<view class="list_content">
					<view class="list_item">整改截止日期</view>
					<view class="list_item_text">{{item.zgDeadline}}</view>
				</view>
				<view class="list_content">
					<view class="list_item">通知日期</view>
					<view class="list_item_text">{{item.noticeTime}}</view>
				</view>
				<view class="button">
					<view class="button_upload" @click="uploadZg(item)">上传整改</view>
				</view>
			</uni-card>
		</view>
		<view v-else class="empty_data">
			<image src="@/static/empty_data.png" mode="aspectFit"></image>
		</view>
		<!-- 整改通知 -->
		<uni-popup ref="zgDialog" type="dialog" :is-mask-click="false" safeArea class="notice_popup">
			<RectificationNotice :know="know" :data="currentPopupData"></RectificationNotice>
		</uni-popup>
	</view>
</template>

<script setup>
import http from '@/utils/request';
import {djtabbar} from '@/pages/index/tabShow.js'
import { ref,reactive, computed, nextTick } from "vue";
import {onLoad,onShow,onUnload,onPullDownRefresh} from "@dcloudio/uni-app";
import RectificationNotice from './rectificationNotice.vue';

const pageData=reactive({
	headImg:'/static/header.png',
	userName:'王军',
	// 状态icon
	statusIcon:'/static/gai_icon.png',
	// 整改任务列表
	taskList:[],
	taskNum:'',
	// 通知列表
	noticeList:[],
	currentPopupDataInex:0
})

const currentPopupData = computed(()=>{
	return pageData.noticeList[pageData.currentPopupDataInex]
})

// 整改通知对话框
const zgDialog=ref()

const eyeIcon=reactive({
	nowIcon:'',
	showIcon:'/static/whiteDisplay.png',
	hideIcon:'/static/whiteHide.png'
})

// 切换显示与隐藏
const changeState=(type)=>{
	if(type=='header'){
		if(eyeIcon.nowIcon==eyeIcon.hideIcon){
			eyeIcon.nowIcon=eyeIcon.showIcon
		}else{
			eyeIcon.nowIcon=eyeIcon.hideIcon
		}
	}else if(type=='list'){
		if(showIcon.nowIcon==showIcon.hideIcon){
			showIcon.nowIcon=showIcon.showIcon
		}else{
			showIcon.nowIcon=showIcon.hideIcon
		}
	}
}

// 查看更多
const toDetail=()=>{
	// 跳转到全部任务页面
	uni.switchTab({
		url: '/pages/ypczk/djfk/djfkTask/allTask'
	});
}

// 上传整改
const uploadZg=(e)=>{
	uni.navigateTo({
		url:'/pages/ypczk/djfk/uploadZg/rectification?id='+e.id+'&status='+e.status
	})
}

let num=0
// 弹出框 我知道了
const know=()=>{
	zgDialog.value.close()
	if(pageData.noticeList.length > num++){
		http.get("app-api/rectify/readNotice",{id:pageData.noticeList[pageData.currentPopupDataInex].id}).then(res=>{
			if(pageData.noticeList.length>=pageData.currentPopupDataInex+1){
				pageData.currentPopupDataInex++
				setTimeout(()=>{
					if (pageData.noticeList.length > num)
						zgDialog.value.open()
				},500)
			}
		})
	}
}

// 获取整改列表
const getZgList=()=>{
	// api/app-api/rectify/findZgTaskList
	http.get("app-api/rectify/findZgTaskList",{status:'0'}).then(res=>{
		pageData.taskNum=res.total
		pageData.taskList=res.data
	})
	getNotice()
	getZgNumber()
}

// 获取整改通知
const getNotice=()=>{
	uni.showLoading({
		title: '',
		mask: true
	});
	// api/app-api/rectify/findNoticeList
	http.get("app-api/rectify/findNoticeList").then(res=>{
		uni.hideLoading()
		res.forEach(item=>{
			let dateList=[]
			dateList=item.createTime.split('-')
			item.createTime=dateList[1]+'月'+dateList[2]+'日'
		})
		pageData.noticeList=res
		if(res.length!=0 && res!=[]){
			zgDialog.value.open()
		}
	})
}

// 获取用户信息
const getUserInfo=()=>{
	try{
		const value=uni.getStorageSync("userInfo")
		pageData.userName = value.nickname
	}catch(e){
		//TODO handle the exception
	}
}

// 获取待整改任务数量
const getZgNumber=()=>{
	http.get("app-api/rectify/getZgNumber").then(res=>{
		if(res==0){
			uni.removeTabBarBadge({
				index:3
			})
		}else{
			uni.setTabBarBadge({
				index:3,
				text:res.toString()
			})
		}
	})
}

onShow(()=>{
	// eyeIcon.nowIcon=eyeIcon.hideIcon
	djtabbar()
	getUserInfo()
	getZgList()
})

</script>

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