<template>
    <div id="submit-report-layout-target" class="hc-page-box write-report">
        <hc-new-card>
            <template #header>
                <div class="hc-conclusion-header-box">
                    <div class="hc-conclusion-icon-box">
                        <HcIcon name="file-ppt-2" fill />
                    </div>
                    <div class="ml-2 conclusion-name-box">
                        <span class="text-xl text-cut conclusion-alias">编写结论、提交报告</span>
                        <div class="text-xs text-cut conclusion-name">{{ projectInfo.name }}</div>
                    </div>
                </div>
            </template>
            <template #extra>
                <el-button v-if="state === 2" type="success" round @click="onSubmitReportClick">查看验收意见</el-button>
                <el-button v-if="state === 2" type="danger" round>撤回提交</el-button>
                <el-button v-if="isShowSubmit && state !== 2" type="danger" round @click="submissionClick">确认提交</el-button>
                <el-button color="#7729F5" round :loading="saveDraftLaod" @click="officeDraft">暂存草稿</el-button>
                <el-button round plain type="danger" @click="previousStep">上一步</el-button>
                <el-button type="danger" round plain @click="toBackClick">返回主页</el-button>
            </template>
            <!-- <HcOnlineOffice
                ref="officeRef" :key1="dataKey" :src="docxUrl" title="测试的文档.docx"
                :url="saveUrl" :project-id="projectId" :token="token" :user-info="userInfo"
                @download="officeDownload"
            /> -->
            <reportDetail :consolusion-data="consolusionData" :state="state" @change="changConsoluData" />
        </hc-new-card>

        <!-- 短信认证 -->
        <HcSmsAuth :loading="SMSAuthLoading" :show="SMSAuthShow" @cancel="SMSAuthCancel" @confirm="SMSAuthConfirm" />

        <!-- 历史报告 -->
    
        <!-- 历史报告 -->
        <HcDrawer
            :show="isSubmitReportDrawer" to-id="submit-report-layout-target" uis="hc-submit-report-target"
            @close="onSubmitReportDrawerClose"
        >
            <template #header>
                <div class="hc-select-view w-52">
                    <el-select v-model="pdfDate" placeholder="选择日期" @change="changePdfDate">
                        <el-option v-for="item in timeData " :label="item" :value="item" />
                    </el-select>
                </div>
                <div class="hc-title-view">{{ tableTitle }}</div>
            </template>
            <template #extra>
                <el-button type="danger" round plain @click="onSubmitReportDrawerClose">返回主页</el-button>
            </template>
            <HcPdf
                :src="curPdf"
            />
        </HcDrawer>
    </div>
</template>

<script setup>
import { onMounted, ref } from 'vue'
import { useAppStore } from '~src/store'
import { useRouter } from 'vue-router'
import initialgApi from '~api/initial/initial'
import writeApi from '~api/transfer/write-conclusion'
import { getToken } from '~src/api/util/auth'
import reportDetail from './report-detail.vue'
import { arrToKey, getArrValue, getObjValue } from 'js-fast-way'

//变量
const router = useRouter()
const useAppState = useAppStore()
const projectId = ref(useAppState.getProjectId)
const contractId = ref(useAppState.getContractId)
const projectInfo = ref(useAppState.getProjectInfo)
const userInfo = ref(useAppState.getUserInfo)
const token = ref( getToken())

//渲染完成
onMounted(() => {
    // setTimeout(() => {
    //     geDocxUrl()
    // }, 1000)
    getIsSubmit()
    getConclusion()
})

const state = ref(1)
const docxUrl = ref('')

const dataKey = ref('')
const datafile = ref({})
//const docxUrl = ref('https://bladex-test-info.oss-cn-chengdu.aliyuncs.com//upload/20230317/e2bdc6581e397b810b46ac7cd71b111b.docx')

//暂存草稿

const saveDraftLaod = ref(false)
const officeDraft = async () => {
    saveDraftLaod.value = true
    const { error, code, msg } = await writeApi.saveTable({
      ...consolusionData.value,
    })
    saveDraftLaod.value = false
    if (!error && code === 200) {
      window.$message.success(msg)
      getConclusion()

    } 
}


//确认提交
const submissionClick = () => {
    SMSAuthShow.value = true
}
const isShowSubmit = ref(false)
const getIsSubmit = async ()=>{
    const { error, code, data } = await writeApi.checkSubmit({
        projectId: projectId.value,
    })
    if (!error && code === 200) {
        isShowSubmit.value = data
     
    } else {
        isShowSubmit.value = false
    }
}
//短信验证
const SMSAuthLoading = ref(false)
const SMSAuthShow = ref(false)
const SMSAuthConfirm = async () => {
    SMSAuthShow.value = false

    //确认提交调接口
    const { error, code, msg } = await writeApi.submitTable({
      ...consolusionData.value,
    })
    if (!error && code === 200) {
      window.$message.success(msg)
    //   state.value = 2
    getConclusion()

    } 
}
const SMSAuthCancel = () => {
    SMSAuthShow.value = false
}

//上一步
const previousStep = () => {
    router.back()
}

//返回主页
const toBackClick = () => {
    router.push({
        name: 'transfer-initial-expert',
    })
}

//历史报告
const isSubmitReportDrawer = ref(false)
const reportData = ref([])
const timeData = ref([])
const onSubmitReportClick = async () => {
    const { error, code, data } = await initialgApi.getHistoryTable({
        projectId: projectId.value,
    })
    if (!error && code === 200) {
        reportData.value = getArrValue(data)
        const dataString = arrToKey( reportData.value, 'approveDate', ',')
        timeData.value = dataString.split(',')
      if (timeData.value.length > 0) {
        pdfDate.value = timeData.value[0]
        curPdf.value = reportData.value[0].tableUrl
        tableTitle.value = reportData.value[0].tableTitle
        isSubmitReportDrawer.value = true
      }
       
    } else {
        reportData.value = []
     
    }
   
}
const pdfDate = ref(null)
const curPdf = ref('')
const tableTitle = ref('')
//历史报告
const onSubmitReportDrawerClose = () => {
    isSubmitReportDrawer.value = false
    curPdf.value = ''
}
const changePdfDate = (val)=>{
    reportData.value.forEach((ele)=>{
        if (ele.approveDate === val) {
            curPdf.value = ele.tableUrl
            tableTitle.value = ele.tableTitle
        }
    })
}

const consolusionData = ref({
    foreword:'',
    generalSituation:'',
    questionSuggest:'',
    adminCondition	:'',
})
const changConsoluData = (val)=>{
    consolusionData.value = val
}
//获取结论
const getConclusion = async ()=>{
    const { error, code, data } = await initialgApi.getTable({
        projectId: projectId.value,
    })
    if (!error && code === 200) {
        console.log(data, 'data')
        consolusionData.value = getObjValue(data)
        state.value = data['status']
    } else {
        consolusionData.value = {
            foreword:'',
            generalSituation:'',
            questionSuggest:'',
            adminCondition	:'',
        }
     
    }
}
</script>

<style lang="scss" scoped>
@import '~style/transfer/scoped/submit-report.scss';
.hc-conclusion-header-box {
    position: relative;
    display: flex;
    align-items: flex-start;
    .hc-conclusion-icon-box {
        font-size: 28px;
        color: var(--el-color-primary);
    }
    .conclusion-name-box {
        flex: auto;
        position: relative;
        overflow: hidden;
        .conclusion-alias {
            color: var(--el-color-primary);
        }
        .conclusion-name {
            margin-top: 4px;
            color: #838791;
        }
    }
}
</style>

<style lang="scss">
@import '~style/transfer/submit-report.scss';
</style>
