| | |
| | | import {ref, onMounted} from "vue"; |
| | | import {getUserType} from '@/utils/auth.js' |
| | | import facilityApi from "@/api/facility/index"; |
| | | import { getFlowMenu } from '@/api/screen/shebei/index.js' |
| | | import setPostParams from "@/utils/searchParams.js"; |
| | | import { getFlowMenu, getFlowShebeiList } from '@/api/screen/shebei/index.js' |
| | | import { useRouter } from "vue-router"; |
| | | |
| | | const router = useRouter(); |
| | | const imgBaseUrl = import.meta.env.VITE_APP_IMG_BASEURL; //图片前缀 |
| | | |
| | | const menuList = ref([]) |
| | | const deviceList = ref([]) |
| | |
| | | |
| | | // 获取设备 |
| | | const getDataList = () => { |
| | | let postParam = setPostParams() |
| | | facilityApi().search({ ...postParam, keywords: searchVal.value }).then(res => { |
| | | deviceList.value = res.data.list |
| | | getFlowShebeiList({ facilityName: searchVal.value }).then(res => { |
| | | deviceList.value = res.data |
| | | }) |
| | | } |
| | | |
| | |
| | | :value="item.value" |
| | | /> |
| | | </el-select> |
| | | <el-input v-model="searchVal" style="width: 20rem" placeholder="请输入设备名称" /> |
| | | <el-input v-model="searchVal" style="width: 20rem" placeholder="请输入设备名称" clearable /> |
| | | <el-button @click="getDataList"><el-icon><Search /></el-icon>搜索</el-button> |
| | | <el-button style="margin-left: 0" v-if="userType === '1'" @click="router.push('/facilityList')"><el-icon><Plus /></el-icon>新增</el-button> |
| | | <el-button style="margin-left: 0" v-if="userType === '1'" @click="router.push('/monitorList')"><el-icon><Plus /></el-icon>新增</el-button> |
| | | </div> |
| | | <div class="tool-r" @click="handleFullScreen"> |
| | | <img src="@/assets/images/flow/fullscreen.png" /> |
| | |
| | | <div>{{item.facilityCode}}</div> |
| | | </div> |
| | | <div class="item-img"> |
| | | <img v-if="item.image" :src="VITE_APP_IMG_BASEURL + item.image" alt="" /> |
| | | <img v-if="item.facilityUrl" :src="imgBaseUrl + item.facilityUrl" alt="" /> |
| | | </div> |
| | | <div class="item-info"> |
| | | <div class="online">设备在线状态: <span :style="{color: item.isOnline ? '#56d12c' : '#bababa'}">{{item.isOnline ? '在线' : '掉线'}}</span></div> |
| | |
| | | <div>{{item.facilityCode}}</div> |
| | | </div> |
| | | <div class="item-img"> |
| | | <img v-if="item.image" :src="VITE_APP_IMG_BASEURL + item.image" alt="" /> |
| | | <img v-if="item.facilityUrl" :src="imgBaseUrl + item.facilityUrl" alt="" /> |
| | | </div> |
| | | <div class="item-info"> |
| | | <div class="online">设备在线状态: <span :style="{color: item.isOnline ? '#56d12c' : '#bababa'}">{{item.isOnline ? '在线' : '掉线'}}</span></div> |
| | |
| | | <div>{{item.facilityCode}}</div> |
| | | </div> |
| | | <div class="item-img"> |
| | | <img v-if="item.image" :src="VITE_APP_IMG_BASEURL + item.image" alt="" /> |
| | | <img v-if="item.facilityUrl" :src="imgBaseUrl + item.facilityUrl" alt="" /> |
| | | </div> |
| | | <div class="item-info"> |
| | | <div class="online">设备在线状态: <span :style="{color: item.isOnline ? '#56d12c' : '#bababa'}">{{item.isOnline ? '在线' : '掉线'}}</span></div> |
| | |
| | | flex-shrink: 0; |
| | | width: 80%; |
| | | height: 100%; |
| | | background: linear-gradient( 180deg, #91BDDB 0%, rgba(102, 102, 102, 0.5) 100%); |
| | | .monitor-tool{ |
| | | width: 100%; |
| | | height: 60px; |
| | |
| | | .monitor-box{ |
| | | height: calc(100% - 60px); |
| | | padding-top: 10px; |
| | | background: linear-gradient(180deg, #91BDDB 0%, rgba(102, 102, 102, 0.5) 100%); |
| | | .list{ |
| | | height: 100%; |
| | | padding: 0 30px; |