<template>
    <el-dialog title="详情" :close-on-click-modal="false" append-to-body :visible.sync="visible"
        class="JNPF-dialog JNPF-dialog_center" lock-scroll width="600px">
        <el-row :gutter="15" class="">
            <el-form ref="formRef" :model="dataForm" size="small" label-width="100px"
                label-position="right">
                <template v-if="!loading">
                    <el-col :span="24">
                        <jnpf-form-tip-item label="标题" prop="enable">
                            <span style="color: #1890ff;cursor: pointer;"
                                @click="pcDownloadFile(dataForm.url,dataForm.title)">
                                {{dataForm.title}}（点击下载）</span>

                        </jnpf-form-tip-item>
                    </el-col>
                    <el-col :span="24">
                        <jnpf-form-tip-item label="存储路径" prop="enable">
                            {{dataForm.url}}
                        </jnpf-form-tip-item>
                    </el-col>
                    <el-col :span="24">
                        <jnpf-form-tip-item label="创建人" prop="enable">
                            {{dataForm.createUser}}
                        </jnpf-form-tip-item>
                    </el-col>
                    <el-col :span="24">
                        <jnpf-form-tip-item label="是否启用" prop="enable">
                            <el-tag v-if="dataForm.enable == '是'">是</el-tag>
                            <el-tag v-else type="danger">否</el-tag>
                        </jnpf-form-tip-item>
                    </el-col>
                    <el-col :span="24">
                        <jnpf-form-tip-item label="是否发布" prop="publish">
                            <el-tag v-if="dataForm.publish == '是'">是</el-tag>
                            <el-tag v-else type="danger">否</el-tag>
                        </jnpf-form-tip-item>
                    </el-col>
                    <el-col :span="24">
                        <jnpf-form-tip-item label="是否是新版本" prop="newVersion">
                            <el-tag v-if="dataForm.newVersion == '是'">是</el-tag>
                            <el-tag v-else type="danger">否</el-tag>
                        </jnpf-form-tip-item>
                    </el-col>
                </template>
            </el-form>
        </el-row>
        <span slot="footer" class="dialog-footer">
            <el-button @click="visible = false"> 取 消</el-button>
        </span>
        <Detail v-if="detailVisible" ref="Detail" @close="detailVisible = false" />
    </el-dialog>
</template>
<script>
import request from '@/utils/request'

import { getConfigData } from '@/api/onlineDev/visualDev'
import jnpf from '@/utils/jnpf'
import Detail from '@/views/basic/dynamicModel/list/detail'
import { thousandsFormat } from "@/components/Generator/utils/index"
import { minioPath } from '@/utils/apiUrl'

export default {
    components: { Detail },
    props: [],
    data() {
        return {
            minioPath: minioPath,
            visible: false,
            detailVisible: false,
            loading: false,

            //掩码配置
            maskConfig: {
                title: { "prefixType": 1, "useUnrealMask": false, "maskType": 1, "unrealMaskLength": 1, "prefixLimit": 0, "suffixLimit": 0, "filler": "*", "prefixSpecifyChar": "", "suffixType": 1, "ignoreChar": "", "suffixSpecifyChar": "" },
                url: { "prefixType": 1, "useUnrealMask": false, "maskType": 1, "unrealMaskLength": 1, "prefixLimit": 0, "suffixLimit": 0, "filler": "*", "prefixSpecifyChar": "", "suffixType": 1, "ignoreChar": "", "suffixSpecifyChar": "" },
                version: { "prefixType": 1, "useUnrealMask": false, "maskType": 1, "unrealMaskLength": 1, "prefixLimit": 0, "suffixLimit": 0, "filler": "*", "prefixSpecifyChar": "", "suffixType": 1, "ignoreChar": "", "suffixSpecifyChar": "" },
            },
            //定位属性
            locationScope: {
            },

            dataForm: {

            },

        }
    },
    computed: {},
    watch: {},
    created() {

    },
    mounted() { },
    methods: {
        pcDownloadFile(url, name) {
            console.log(url)
            url = minioPath + url
            //保存到本地
            try {
                const x = new window.XMLHttpRequest();
                x.open('GET', url, true);
                x.responseType = 'blob';
                x.onload = () => {
                    const url = window.URL.createObjectURL(x.response);
                    const a = document.createElement('a');
                    a.href = url;
                    a.download = name;
                    a.click();
                };
                x.send();


                this.$message({
                    message: '下载成功',
                    type: 'success',
                    duration: 1000,
                })
            } catch (error) {
                this.$message({
                    message: '下载失败',
                    type: 'warning',
                    duration: 1000,
                })
            }
        },
        toDetail(defaultValue, modelId) {
            if (!defaultValue) return
            getConfigData(modelId).then(res => {
                if (!res.data || !res.data.formData) return
                let formData = JSON.parse(res.data.formData)
                formData.popupType = 'general'
                this.detailVisible = true
                this.$nextTick(() => {
                    this.$refs.Detail.init(formData, modelId, defaultValue)
                })
            })
        },
        dataInfo(dataAll) {
            let _dataAll = dataAll
            this.dataForm = _dataAll
        },

        init(id) {
            this.dataForm.id = id || 0;
            this.visible = true;
            this.$nextTick(() => {
                if (this.dataForm.id) {
                    this.loading = true
                    request({
                        url: '/api/ProductServerDocumentation/ProductServerDocumentation/detail/' + this.dataForm.id,
                        method: 'get'
                    }).then(res => {
                        this.dataInfo(res.data)
                        this.loading = false
                    })
                }

            })
        },
    },
}

</script>
