<template>
    <div class="submit-result">
        <div class="pt-5 text-center">
            <doc-icon type="doc-check-circle"
                style="color: #faad14;font-size: .46rem;"/>
        </div>
        <div class="text-center mt-4">筛查提交成功</div>
        <p class="tip" v-if="screenInfo.screenResult == 2">
            <!-- v-if="screenInfo.screenResult === 2" -->
            通过筛查，您的慢病高危评估结果为：<span class="text-red">高危风险人群</span><br />
            存在慢性病患病风险，可前往医院进一步检查。
        </p>
        <p class="tip" v-else>
            通过筛查，您的慢病高危评估结果为：<span class="bold">一般人群</span>。目前不存在慢性病患病风险，若有疑问，可前往医院进一步检查。
        </p>

        <div class="result text-12" v-if="screenInfo.screenResult === 2">
            <div>风险主要体现在以下3个方面：</div>
            <div class="mt-2"></div>
            <div v-for="(item, index) in resultInfo" :key="index">
                <span>{{index + 1}}、</span>
                <span>{{item}}；</span>
            </div>
        </div>

        <van-button round block class="button"
            @click="toRecord">查看慢病筛查记录</van-button>
    </div>
</template>

<script>
import { useStore } from '@/resident/store/index.js'

export default {
    inject: ['checkInfo', 'recordForm'],
    setup() {
        const store = useStore()
        return { store }
    },
    computed: {
        screenInfo() {
            return this.recordForm.screen || {}
        },
        resultInfo() {
            // return this.store.getDict('CP00113').map(e => e.name)
            const highItem = this.screenInfo.highItem
            return highItem && highItem.length ?
                this.store.getDict('CP00113').filter(e => highItem.includes(e.value)).map(e => e.name) : []
        }
    },
    methods:{ 
        toRecord() {
            this.$router.replace({
                path: '/resident/screening/first/detail',
                query: {
                    idCard: this.checkInfo.idCard
                }
            })
        }
    }
}
</script>

<style lang="less" scoped>
.submit-result {
    padding: 0 30px;
}
.tip {
    color: #595959;
    line-height: 1.5;
    font-size: 12px;
    .bold {
        color: #262626;
        font-weight: 600;
    }
}
.result {
    background-color: #F8FAFC;
    padding: 12px;
    line-height: 1.5;
}
.button {
    color: #8C8C8C;
    border-color: #BFBFBF;
    margin-top: 30px;
}
</style>
