| | |
| | | <template> |
| | | <basic-container> |
| | | <el-form ref="queryParamsRef" :model="searchParams" class="ztzf-page-history-search"> |
| | | <el-form ref="queryParamsRef" :model="searchParams" class="command-page-history-search"> |
| | | <el-form-item label="设备名称" prop="deviceId"> |
| | | <el-select |
| | | class="ztzf-data-cockpit-select" |
| | | popper-class="ztzf-data-cockpit-select-popper" |
| | | class="command-data-cockpit-select" |
| | | popper-class="command-data-cockpit-select-popper" |
| | | v-model="searchParams.deviceId" |
| | | placeholder="请选择" |
| | | clearable |
| | |
| | | </el-select> |
| | | </el-form-item> |
| | | |
| | | <el-form-item label="设备类型" prop="deviceType"> |
| | | <el-form-item label="设备状态" prop="status"> |
| | | <el-select |
| | | class="ztzf-data-cockpit-select" |
| | | popper-class="ztzf-data-cockpit-select-popper" |
| | | v-model="searchParams.deviceType" |
| | | class="command-data-cockpit-select" |
| | | popper-class="command-data-cockpit-select-popper" |
| | | v-model="searchParams.status" |
| | | placeholder="请选择" |
| | | clearable |
| | | @clear="handleSearch" |
| | | @change="handleSearch" |
| | | > |
| | | <el-option |
| | | v-for="item in dictObj.deviceType" |
| | | v-for="item in dictObj.deviceStatus" |
| | | :key="item.dictKey" |
| | | :label="item.dictValue" |
| | | :value="item.dictKey" |
| | |
| | | </el-select> |
| | | </el-form-item> |
| | | |
| | | <el-form-item label="设备编号" prop="deviceSn"> |
| | | <el-form-item label="设备编码" prop="deviceSn"> |
| | | <el-input |
| | | class="ztzf-data-cockpit-search-input" |
| | | class="command-data-cockpit-search-input" |
| | | v-model="searchParams.deviceSn" |
| | | placeholder="请输入" |
| | | clearable |
| | |
| | | </el-form-item> |
| | | </el-form> |
| | | |
| | | <div class="ztzf-table-toolbar"> |
| | | <div class="command-table-toolbar"> |
| | | <el-button :icon="Plus" color="#284FE3" type="primary" @click="openForm('add')">新增</el-button> |
| | | <el-button :icon="Delete" color="#1A2652" :disabled="!selectedIds.length" @click="handleDelete()">删除</el-button> |
| | | </div> |
| | | |
| | | <div class="ztzf-table-container" v-loading="loading" element-loading-background="rgba(5, 5, 15, 0.6)"> |
| | | <div class="ztzf-table-content ztzf-table-content-bg"> |
| | | <el-table class="ztzf-data-cockpit-table" :data="list" @selection-change="handleSelectionChange"> |
| | | <div class="command-table-container" v-loading="loading" element-loading-background="rgba(5, 5, 15, 0.6)"> |
| | | <div class="command-table-content command-table-content-bg"> |
| | | <el-table class="command-data-cockpit-table" :data="list" @selection-change="handleSelectionChange"> |
| | | <el-table-column type="selection" width="46" /> |
| | | <el-table-column type="index" show-overflow-tooltip width="64" label="序号" /> |
| | | <el-table-column prop="deviceName" show-overflow-tooltip width="140" label="设备名称" /> |
| | | <el-table-column prop="deviceSn" show-overflow-tooltip width="140" label="设备编码" /> |
| | | <!-- <el-table-column prop="deviceStatus" show-overflow-tooltip width="100" label="设备状态"> |
| | | <template v-slot="{ row }"> |
| | | {{ getDictLabel(row.deviceStatus, dictObj.deviceStatus) }} |
| | | </template> |
| | | </el-table-column>--> |
| | | <el-table-column prop="status" show-overflow-tooltip width="100" label="设备状态"> |
| | | <template v-slot="{ row }"> |
| | | {{ formatDeployLocation(row) }} |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="areaName" show-overflow-tooltip width="120" label="区域" /> |
| | | <el-table-column prop="defenseZoneName" show-overflow-tooltip width="120" label="场景" /> |
| | | <el-table-column show-overflow-tooltip label="调度位置"> |
| | |
| | | </el-table> |
| | | </div> |
| | | |
| | | <div class="ztzf-table-pagination"> |
| | | <div class="command-table-pagination"> |
| | | <el-pagination |
| | | popper-class="ztzf-data-cockpit-select-popper" |
| | | popper-class="command-data-cockpit-select-popper" |
| | | v-model:current-page="searchParams.current" |
| | | v-model:page-size="searchParams.size" |
| | | layout="total, prev, pager, next, sizes" |
| | |
| | | // 初始化查询参数 |
| | | const initSearchParams = () => ({ |
| | | deviceId: '', // 设备名称 |
| | | deviceType: '', // 设备类型 |
| | | status: '', // 设备状态 |
| | | deviceSn: '', // 设备编号 |
| | | current: 1, // 当前页 |
| | | size: 10, // 每页大小 |
| | |
| | | } |
| | | return row.dispatchStartTime || row.dispatchEndTime || '' |
| | | } |
| | | |
| | | function formatDeployLocation(row) { |
| | | if (!row.longitude || !row.latitude) return '' |
| | | return `${row.longitude}, ${row.latitude}` |
| | | } |
| | | // 获取列表 |
| | | async function getList() { |
| | | loading.value = true |