<template>
|
<div id="realTimeList" class="out-div-rt">
|
<div class="top-menu">
|
<span class="iconfont iconku" style="font-size:20px;"></span>
|
<span style="font-size:14px; margin-left: 5px;font-weight: 600;">数据栈</span>
|
</div>
|
<ul>
|
<li
|
v-for="(item,index) in DataStackPool.dirs"
|
:key="index"
|
@click="handleClick(item)"
|
:class="DataStackPool.selectedDir.id == item.id ? 'bg' : ''"
|
>
|
<!-- 文件夹图标 -->
|
<span class="iconfont iconshipinwenjianjia-new folder" v-if="item.type === 1"></span>
|
<span class="iconfont icontupianwenjianjia-copy folder" v-else-if="item.type === 2"></span>
|
<span class="iconfont iconshipinwenjianjia1 folder" v-else-if="item.type === 3"></span>
|
<span class="iconfont iconwenjian folder" v-else></span>
|
|
<span class="folder-name">{{item.name}}</span>
|
|
<!-- 算法配置不全 -->
|
<i class="iconfont iconicon-test6 folder-status" v-if="item.status === 0"></i>
|
<!-- 正在处理 -->
|
<i class="iconfont iconicon-test11 folder-status" v-else-if="item.status === 2"></i>
|
<!-- 等待处理 -->
|
<i class="iconfont iconicon-test5 folder-status" v-else-if="item.status === 1"></i>
|
<!-- 未知原因 -->
|
<i class="iconfont iconicon-test5 folder-status" v-else></i>
|
<!-- <i class="iconfont iconicon-test11 folder-status"></i> -->
|
<el-switch
|
size="mini"
|
style="float:right; margin:2px 5px;"
|
v-model="item.enable"
|
@change="switchEnable(item)"
|
></el-switch>
|
</li>
|
</ul>
|
</div>
|
</template>
|
<script>
|
import { switchDir } from "@/api/localVedio"
|
|
export default {
|
name: 'localVedioList',
|
props: {
|
isMutl: {
|
type: Boolean,
|
default: true
|
}
|
},
|
data() {
|
return {
|
list: [],
|
checkedVedio: [],
|
isShow: true,
|
dateMill: new Date(),
|
showCheckBox: false,
|
}
|
},
|
methods: {
|
handleClick(item) {
|
this.DataStackPool.selectedDir = item;
|
},
|
switchEnable(item) {
|
switchDir({ enable: item.enable, id: item.id }).then(rsp => {
|
console.log(rsp)
|
})
|
}
|
}
|
}
|
</script>
|
<style lang="scss">
|
.out-div-rt {
|
width: 100%;
|
height: 100%;
|
.top-menu {
|
text-align: left;
|
}
|
|
.folder {
|
color: #3d68e1;
|
font-size: 20px;
|
float: left;
|
line-height: 25px;
|
}
|
.folder-name {
|
font-size: 14px;
|
margin-left: 5px;
|
float: left;
|
line-height: 27px;
|
}
|
.folder-status {
|
color: #3d68e1;
|
font-size: 18px;
|
float: right;
|
line-height: 25px;
|
}
|
|
ul {
|
margin: 10px 25px;
|
}
|
li {
|
width: 100%;
|
height: 25px;
|
margin-top: 2px;
|
cursor: pointer;
|
.el-switch__core {
|
width: 27px !important;
|
height: 14px;
|
}
|
.el-switch__core:after {
|
width: 10px;
|
height: 10px;
|
}
|
.el-switch.is-checked .el-switch__core::after {
|
left: 100%;
|
margin-left: -11px;
|
}
|
}
|
}
|
|
.bg {
|
background: #e1e1e1;
|
}
|
.clickStatus {
|
background: #e1e1e1;
|
}
|
</style>
|
