离线数据补招文件夹层级展示

src/views/govern/device/control/index.vue

@@ -349,7 +349,8 @@ const handleaddDevice = () => {
     push({
         path: '/supplementaryRecruitment',
         query: {
-            id: '1111'
+            id: lineId.value,
+            ndid:deviceData.value.ndid
         }
     })
 }
@@ -521,17 +522,11 @@ const handleClick = async (tab?: any) => {
 //模版下载
 const handleDownLoadTemplate = () => {}
 //解析列表
-// const isAnalysisList = ref(false)
 const analysisListRef = ref()
 //打开解析列表
 const handleAnalysisList = () => {
-    // isAnalysisList.value = true
     analysisListRef.value && analysisListRef.value.open()
 }
-//返回
-// const handleBackAnalysisList=()=>{
-//     isAnalysisList.value = false
-// }
 //离线数据导入
 const offLineDataImportRef = ref()
 const handleImport = () => {
@@ -586,18 +581,6 @@ const openGroup = () => {
         })
     })
 }
-watch(
-    () => dataSet.value,
-    (val: any, oldVal: any) => {
-        if (val) {
-            // handleClick()
-        }
-    }
-)
-watch(
-    () => tableData.value,
-    (val: any, oldVal: any) => {}
-)
 onMounted(() => {})
 </script>
 

src/views/govern/device/control/supplementaryRecruitment.vue

@@ -2,7 +2,8 @@
     <div class="default-main">
         <el-tabs v-model="activeName" type="border-card">
             <el-tab-pane label="当前设备补招" name="0">
-                <current v-if="activeName == '0'" />
+                <!-- <current v-if="activeName == '0'" /> -->
+                <currentDevice v-if="activeName == '0'" ref="currentDeviceRef"/>
             </el-tab-pane>
             <el-tab-pane label="历史设备补招" name="1">
                 <history v-if="activeName == '1'" />
@@ -10,14 +11,33 @@
         </el-tabs>
     </div>
 </template>
-<script lang='ts' setup>
-import {ref,onMounted} from 'vue';
-import current from './supplementaryRecruitment/current.vue'
+<script lang="ts" setup>
+import { ref, onMounted,watch ,nextTick} from 'vue'
+// import current from './supplementaryRecruitment/current.vue'
+import currentDevice from './supplementaryRecruitment/currentDevice.vue'
 import history from './supplementaryRecruitment/history.vue'
-const activeName=ref('0')
-onMounted(()=>{
-console.log()
+import { useRoute } from 'vue-router'
+const route = useRoute()
+const activeName = ref('0')
+const currentDeviceRef=ref()
+watch(
+    ()=>activeName.value,
+    (val,oldVal)=>{
+        if(val=='0'){
+            nextTick(()=>{
+                currentDeviceRef.value&&currentDeviceRef.value.getMakeUpDataList(route.query)
+            })
+           
+        }
+    },
+    {
+        immediate:true,
+        deep:true
+    }
+)
+onMounted(() => {
+    console.log()
+    currentDeviceRef.value&&currentDeviceRef.value.getMakeUpDataList(route.query)
 })
 </script>
-<style lang='scss' scoped>
-</style>
+<style lang="scss" scoped></style>

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

@@ -0,0 +1,97 @@
+<template>
+    <div class="default-main current_device" v-loading="loading">
+        <!-- <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>
+</template>
+<script lang="ts" setup>
+import { ref, onMounted, defineProps, defineExpose } from 'vue'
+import { getMakeUpData, getAskDirOrFile } from '@/api/cs-harmonic-boot/recruitment.ts'
+// const props = defineProps(['lineId'])
+const loading = ref(false)
+const dirList = ref([])
+const route: any = ref({})
+const getMakeUpDataList = (row: any) => {
+    route.value = row
+    loading.value = true
+    getMakeUpData(row.id).then(res => {
+        console.log(res, '????????????')
+        dirList.value = res.data
+        loading.value = false
+    })
+}
+// 进入文件夹
+const dirCheckedList: any = ref([])
+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 => {
+        console.log(res, '查询3333333333333333')
+        dirList.value = res.data
+    })
+}
+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;
+    }
+}
+</style>