<template>
    职业信息查询

    <el-card style="width:200px">
        <div @click="changeTab('hyfl')">
            <el-button @click="jumpTo('/xjc-integratedmachine/environment/occdb_search_industry_list')">点击查询</el-button>
        </div>
        <div @click="changeTab('hldm')">
            霍兰德码查询
            <el-button @click="jumpTo('/xjc-integratedmachine/environment/occdb_interestcode')">点击查询s</el-button>
        </div>
        <div @click="changeTab('gjz')">
            关键字查询
            <el-input v-model="form.name"></el-input>
            <el-button @click="byKeyWord">关键字查询</el-button>

            <el-table :data="data_list">
                <el-table-column label="名称" align="center" key="name" prop="name"/>
                <el-table-column label="详情">
                    <template #default="scope">
                        <el-tooltip content="详情>>" placement="top">
                            <el-button link type="primary" icon="Edit" @click="toDetail(scope.row)"></el-button>
                        </el-tooltip>
                    </template>
                </el-table-column>
            </el-table>
        </div>
    </el-card>

    <div v-show="tab == 'hyfl'">
        行业分类是把.............................
    </div>
    <div v-show="tab == 'hldm'">

    </div>
    <div v-show="tab == 'gjz'">

    </div>

</template>

<script setup>
    import {getOccupationByKeyword} from '@/api/xjc-integratedmachine/environment/occupation.js'

    const router = useRouter()
    const route = useRoute()
    const total = ref(0)
    const param = route.query


    const tab = ref("hyfl")

    function changeTab(path) {
        tab.value = path
    }

    function jumpTo(path) {
        router.push({
            path: path
        })
    }

    const form = ref({
        name: ''
    })

    const data_list = ref([])
    function byKeyWord() {
        getOccupationByKeyword(form.value).then(resp =>{
            console.log("sss",resp)
            data_list.value = resp.list
        })
    }

    function toDetail(item){
        router.push({
            path : '/xjc-integratedmachine/environment/occ_details_video',
            query :{
                id :  item.id
            }
        })
    }

</script>

<style scoped>

</style>
