<!-- 资源的历史版本查询弹窗 -->
<template>
    <BasicModal :maskClosable="false" :width="1430" @register="registerModal" v-bind="$attrs" :title="title" centered
        wrapClassName="history-res-modal" :footer="null">
        <BasicTable @register="registerTable"></BasicTable>
    </BasicModal>
</template>
<script>
import { defineComponent, reactive, ref, onMounted, watch, computed } from 'vue';
import { BasicModal, useModalInner, useModal } from '/@/components/Modal';
// 导入表格组件，表格事件
import { BasicTable, useTable } from '/@/components/Table';
import { message } from 'ant-design-vue';
import { getHistoryByResId } from '/@/api/sys/version';

export default defineComponent({
    components: { BasicModal, BasicTable },
    setup(_, { emit }) {
        const title = ref('');
        const typeObj = {
            MR: "地图资源",
            DR: "场景资源",
            ER: "文件资源",
            SR: "组件服务",
            interface: "接口服务"
        }
        const currentId = ref('');
        const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
            console.log(data)
            title.value = `【${data.type}：${data.serviceName}】历史版本`
            currentId.value = data.serviceId
            reload();
        });

        const getResData = () => {
            return new Promise((resolve, reject) => {
                let params = {
                    serviceid: currentId.value
                }
                getHistoryByResId(params).then(res => {
                    if (res.resp_code === 0 && res.datas) {
                        let resData = res.datas.pageData;
                        resData.forEach(item => {
                            item.type = typeObj[item.RESOURCE_TYPE]
                        })
                        resolve(resData)
                    }
                    else {
                        resolve([])
                        message.error(res.resp_msg)
                    }
                })
            })
        }
        //表格列
        const columns = [
            {
                title: '资源类型',
                align: 'center',
                dataIndex: 'type',
                key: 'type'
            },
            {
                title: '资源名称',
                align: 'center',
                dataIndex: 'SERVICENAME',
                key: 'SERVICENAME'
            },
            {
                title: '版本',
                align: 'center',
                dataIndex: 'VERSION_NAME',
                key: 'VERSION_NAME'
            },
            {
                title: '版本号',
                align: 'center',
                dataIndex: 'VERSION',
                key: 'VERSION'
            },
            {
                title: '操作时间',
                align: 'center',
                dataIndex: 'MODIFY_DATE',
                key: 'MODIFY_DATE'
            },
            {
                title: '操作人',
                align: 'center',
                dataIndex: 'USER_NAME',
                key: 'USER_NAME'
            }
        ];
        const [registerTable, { reload }] = useTable({
            title: '资源列表', //'菜单列表'
            api: getResData, //加载数据
            columns: columns,
            useSearchForm: false,     //开启搜索区域
            bordered: false,
            showTableSetting: true,  // 显示表格设置
            tableSetting: {
                redo: true,
                size: true,
                setting: false,
                fullScreen: false
            },
            showIndexColumn: true,
            pagination: {
                hideOnSinglePage: false
            },
            rowKey: (record) => record.SERVICEID
        });
        return {
            title,
            currentId,
            registerModal,
            registerTable
        };
    },
});
</script>