admin-govern/src/views/govern/device/control/supplementaryRecruitment/currentDevice.vue

<template>
    <div class="default-main current_device" v-loading="loading" v-if="false">
        <!-- <div class="file_path" v-if="dirCheckedList.value && dirCheckedList.value.length != 0">
            <el-breadcrumb separator="/">
                <el-breadcrumb-item v-for="(item, index) in dirCheckedList" :key="index">
                    {{ item.prjName }}
                </el-breadcrumb-item>
            </el-breadcrumb>
        </div> -->
        <div class="device_dir" v-for="(item, index) in dirList" :key="index">
            <img v-if="item.type == 'dir'" src="@/assets/img/wenjianjia.svg" @click="handleIntoDir(item)" />
            <img
                class="device_dir_file"
                v-if="item.type == 'file'"
                src="@/assets/img/wenjian.svg"
                @click="handleIntoDir(item)"
            />
            <p>{{ item.prjName }}>{{ item.prjDataPath }}</p>
        </div>
    </div>
    <!-- 设备补招 -->
    <div class="default-main current_device">
        <div class="current_header">
            <el-form-item label="日期">
                <DatePicker ref="datePickerRef"></DatePicker>
            </el-form-item>
            <el-form-item>
                <el-checkbox-group style="width: 150px" v-model="checkList">
                    <el-checkbox label="稳态" value="B" />
                    <el-checkbox label="暂态" value="A" />
                </el-checkbox-group>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" :icon="Search" @click="handleSearch">查询</el-button>
                <el-button type="primary" :icon="Plus" @click="handleUpDevice">补招</el-button>
                <el-button :icon="Back" @click="go(-1)">返回</el-button>
            </el-form-item>
        </div>
        <div class="current_body" ref="tbodyRef">
            <vxe-table
                border
                ref="tableRef"
                :data="dirList"
                :height="tableHeight"
                @checkbox-all="selectAllChangeEvent"
                @checkbox-change="selectChangeEvent"
                style="margin-right: 30px"
            >
                <vxe-column align="center" type="checkbox" width="60"></vxe-column>
                <vxe-column align="center" field="name" title="名称"></vxe-column>
                <vxe-column align="center" field="startTime" title="起始时间"></vxe-column>
                <vxe-column align="center" field="endTime" title="结束时间"></vxe-column>
            </vxe-table>
        </div>
    </div>
</template>
<script lang="ts" setup>
import { ref, onMounted, defineProps, defineExpose } from 'vue'
import { getMakeUpData, getAskDirOrFile } from '@/api/cs-harmonic-boot/recruitment.ts'
import DatePicker from '@/components/form/datePicker/index.vue'
import { useRouter } from 'vue-router'
import {
    Plus,
    Back,
    Search,
    Refresh,
    RefreshRight,
    RefreshLeft,
    ScaleToOriginal,
    ZoomIn,
    Cpu,
    View,
    Download,
    ZoomOut,
    FolderOpened
} from '@element-plus/icons-vue'
// const props = defineProps(['lineId'])
const { push, currentRoute, go } = useRouter() // 路由
const loading = ref(false)
const dirList = ref([])
const route: any = ref({})
const datePickerRef = ref()
const getMakeUpDataList = (row: any) => {
    route.value = row
    loading.value = true
    getMakeUpData(row.id).then(res => {
        console.log(res, '????????????')
        res.data.map((item: any) => {
            item.name = item.prjDataPath.replace('/bd0/cmn/', item.prjName + '-')
            item.startTime = item.startTime ? item.startTime : '/'
            item.endTime = item.endTime ? item.endTime : '/'
        })
        dirList.value = res.data
        console.log(dirList.value, '查询3333333333333333')
        loading.value = false
    })
}
// 进入文件夹
const dirCheckedList: any = ref([])
const tbodyRef = ref()
const tableHeight = ref(0)
const handleIntoDir = (row: any) => {
    if (dirCheckedList.value.indexOf(row) == -1) {
        dirCheckedList.value.push(row)
    }
    console.log(row, 'hhhhh', dirCheckedList.value)
    const obj = {
        fileType: row.type,
        nDid: route.value.ndid,
        path: row.prjDataPath,
        prjName: row.prjName
    }
    getAskDirOrFile(obj).then(res => {
        dirList.value = res.data
        console.log(dirList.value, '查询3333333333333333')
    })
}
onMounted(() => {
    console.log()
    // getMakeUpDataList()
})
defineExpose({ getMakeUpDataList })
</script>
<style lang="scss" scoped>
// .current_device {
//     width: 100%;
//     height: calc(100vh - 200px);
//     display: flex;
//     flex-wrap: wrap;
//     align-items: flex-start;
//     // justify-content: space-between;
//     overflow-y: auto;
//     .device_dir {
//         width: 24.1%;
//         height: 120px;
//         border: 1px solid #eee;
//         margin: 0 0.3%;
//         display: flex;
//         align-items: center;
//         flex-direction: column;
//         justify-content: center;
//         .device_dir_file {
//             width: 60px;
//             height: 60px;
//         }
//         img {
//             width: 50px;
//             height: 50px;
//         }
//         img:hover {
//             cursor: pointer;
//         }
//         p {
//             margin-top: 10px;
//         }
//         // margin:10px;
//     }
// }
.current_device {
    width: 100%;
    height: calc(100vh - 200px);
    display: flex;
    flex-direction: column;
    .current_header {
        width: 100%;
        height: 60px;
        display: flex;
        align-items: center;
        .el-form-item{
            display: flex;
            align-items: center;
            margin-bottom: 0;
        }
    }
    .current_body {
        margin-top: 10px;
        flex: 1;
    }
}
</style>