<!--
 * 严肃声明：
 * 开源版本请务必保留此注释头信息，若删除我方将保留所有法律责任追究！
 * 本系统已申请软件著作权，受国家版权局知识产权以及国家计算机软件著作权保护！
 * 可正常分享和学习源码，不得用于违法犯罪活动，违者必究！
 * Copyright (c) 2020 陈尼克 all rights reserved.
 * 版权所有，侵权必究！
 *
-->

<template>
    <div>
        <LHeader v-bind:text="text"></LHeader>
        <div class="card">
            <div>检查名称：{{nums.name}}</div>
            <div>检查类型：{{nums.type}}</div>
            <div>检查开始时间：{{nums.planStartTime}}</div>
            <div>检查结束时间：{{nums.planEndTime}}</div>
            <div>检查地点：{{nums.address}}</div>
        </div>
        <div class="button-more">
            <van-button type="primary" round size="large" @click="problem" :disabled="finish=='true'?true:false">检查问题上报{{'('+nums.addTroubleNumber+')'}}</van-button>
            <van-button type="primary" round size="large" @click="formwork">检查清单模板{{'('+nums.listNumber+')'}}</van-button>
            <van-button type="primary" round size="large" @click="note" :disabled="nums.troubleNumber<1?true:false">检查问题记录{{'('+nums.troubleNumber+')'}}</van-button>
            <van-button type="primary" round size="large" @click="end" :disabled="finish=='true'?true:false">结束上报</van-button>
        </div>
        <tab-bar :index="1"></tab-bar>
    </div>
</template>

<script>
import tabBar from "@/components/TabBar";
import LHeader from '@/components/header.vue'
import { getFun,postFun } from '@/service/table'
export default {
    name: 'problem',
    components: {
        "LHeader":LHeader,
        "tabBar":tabBar
    },
    data() {
        return {
            id:'',//问题上报清单列表列表id
            nums:{},//问题上报清单列表
            text:'问题上报',//顶部文本
            finish:'',//提交状态
        }
    },
    mounted() {
        //请求新数据
        if(this.$route.params.id){
            this.id=sessionStorage.getItem('id')
            this.finish=sessionStorage.getItem('finish')
            this.init()
        }
        //缓存数据获取---不更新检查执行id时，获取缓存执行id
        else if(sessionStorage.getItem('id')){
            this.id=sessionStorage.getItem('id')
            this.finish=sessionStorage.getItem('finish')
            if(this.$route.query.pageName){
                this.init()
            }else{
                //当清单模板，问题列表，问题记录不进行提交操作返回该页面调用缓存数据
                this.nums=JSON.parse(sessionStorage.getItem('nums'))
            }
        }
    },
    methods: {
        /* 请求清单列表和模板数值接口 */
        init(){
            this.$toast.loading({
                message:'加载中...',
                forbidClick: true,
                loadingType: 'spinner',
                duration: 0
            })
            this.nums=[];
            getFun('check/carry/count',{planId:this.id}).then((Response)=>{
                this.$toast.clear()
                this.nums=Response.data
                sessionStorage.setItem('nums',JSON.stringify(this.nums))
            }).catch(()=>{
                this.$toast.clear()
                this.$toast.fail('加载失败,请稍后再试')
            })
        },
        /*  结束上报接口请求 */
        end(){
            this.$dialog.confirm({
                title: '提示',
                message: '确定结束检查上报？',
            }).then(()=>{
                postFun('check/carry/trouble/finish',{planId:this.id}).then((Response)=>{
                    this.$toast.clear()
                    this.$router.push('/checked')
                }).catch(()=>{
                    this.$toast.clear()
                    this.$toast.fail('加载失败,请稍后再试')
                })
            })
        },
        problem(){
            this.$router.push({name:'list',query:{id:this.id}})
        },
        note(){
            this.$router.push({
                name:'note',
                query:{
                    id:this.nums.id,
                    finish:this.finish
                }
            })
        },
        formwork(){
            this.$router.push({name:'formwork',query:{id:this.id,finish:this.finish}})
        }
    }
}
</script>
<style lang="less" scoped>
    .card{
        width:90%;
        box-shadow: 0px 0px 10px 2px #F3F3F3;
        padding: 0.25rem;
        margin:0.4rem auto;
        background: white;
    }
    .card div{
        font-size: 0.4rem;
    }
    .button-more{
        text-align: center;
    }
    .van-button{
        width: 80%;
        margin-top: 0.4rem;
    }
</style>
