<template>
    <div>
        <!-- 搜索栏 -->
        <search-bar :conditionForm="conditionForm" @submitSearch="receiveSearch"></search-bar>
        <!-- 操作栏 -->
        <operate-bar v-if="false" :pageOptList="pageOptList" @submitPageOpt="receviceOpt"></operate-bar>
        <!-- 表格 -->
        <new-table
            ref="table"
            :tableHeader="dataSetTable"
            :tableUrl="dataSetlTableUrl"
            :condition="condition"
            :tableOptList="tableOptList"
            @submitTableOpt="receviceOpt"
        >
        </new-table>
    </div>
</template>

<script>
import { dataSetlTableUrl, delDataSet, getDataSetDetail } from "@/api/data-auth.js"
import { dataSetlImportUrl } from "@/api/import"
import searchBar from "@/components/search-bar"
import operateBar from "@/components/operate-bar"
import newTable from "@/components/new-table"
import { searchOpt, importOpt, detailOpt } from "@/mixins/page-opt"
import { dataSetTable, tableOptList, pageOptList } from "./DataConfig.js"
const area = ["1200px", "600px"]
const labelWidth = "180px"

export default {
    components: { searchBar, operateBar, newTable },
    mixins: [searchOpt, importOpt, detailOpt],
    data() {
        return {
            dataSetlTableUrl,
            dataSetTable,
            tableOptList: ["详情", "删除"],
            pageOptList: ["导入"],
            conditionForm: [
                {
                    label: "数据资源名称",
                    name: "resourceName",
                    op: "like",
                    value: "",
                    component: "ElInput"
                }
            ],
            details: {}
        }
    },
    computed: {},
    methods: {
        async receviceOpt(opt, row) {
            const otherParams = {
                config: dataSetTable,
                labelWidth,
                area
            }
            if (opt == "详情") {
                this.details = row
                this.handleViewDetail(row.id, otherParams)
            } else if (opt == "删除") {
                this.handleDelete(row)
            } else if (opt == "导入") {
                this.handleImport(dataSetlImportUrl, "appData", "数据集导入")
            }
        },
        /**
         * 删除
         */
        handleDelete(row) {
            this.$dgConfirm(`是否确定删除这条数据！`, "提示", {}).then(() => {
                delDataSet(row.id).then(res => {
                    this.$message.success("删除成功!")
                    this.handleSearch()
                })
            })
        },
        /**
         * 获取详情
         */
        // getDetail(id) {
        //   return new Promise((resolve) => {
        //     getDataSetDetail(id).then((res) => {
        //       resolve(res.data.content);
        //     });
        //   });
        // },
        getDetail() {
            return new Promise(resolve => {
                resolve(this.details)
            })
        }
    },
    created() {},
    mounted() {}
}
</script>

<style lang="scss" scoped>
@import url("./index.scss");
</style>
