| | |
| | | <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="deviceName"> |
| | | <el-input |
| | | class="ztzf-data-cockpit-search-input" |
| | | class="command-input" |
| | | v-model="searchParams.deviceName" |
| | | placeholder="请输入" |
| | | clearable |
| | |
| | | |
| | | <el-form-item label="设备类型" prop="deviceType"> |
| | | <el-select |
| | | class="ztzf-data-cockpit-select" |
| | | popper-class="ztzf-data-cockpit-select-popper" |
| | | class="command-select" |
| | | popper-class="command-select-popper" |
| | | v-model="searchParams.deviceType" |
| | | placeholder="请选择" |
| | | clearable |
| | |
| | | </el-select> |
| | | </el-form-item> |
| | | |
| | | <el-form-item label="设备状态" prop="deviceStatus"> |
| | | <el-form-item label="设备状态" prop="status"> |
| | | <el-select |
| | | class="ztzf-data-cockpit-select" |
| | | popper-class="ztzf-data-cockpit-select-popper" |
| | | v-model="searchParams.deviceStatus" |
| | | class="command-select" |
| | | popper-class="command-select-popper" |
| | | v-model="searchParams.status" |
| | | placeholder="请选择" |
| | | clearable |
| | | @change="handleSearch" |
| | |
| | | </el-form-item> |
| | | </el-form> |
| | | |
| | | <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"> |
| | | <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-table" :data="list"> |
| | | <el-table-column type="index" width="64" show-overflow-tooltip label="序号" /> |
| | | <el-table-column prop="deviceType" show-overflow-tooltip label="设备类型"> |
| | | <template v-slot="{ row }"> |
| | |
| | | <el-table-column prop="deviceModel" show-overflow-tooltip label="设备型号" /> |
| | | <el-table-column prop="deviceName" show-overflow-tooltip label="设备名称" /> |
| | | <el-table-column prop="deviceSn" show-overflow-tooltip label="设备编码" /> |
| | | <el-table-column prop="deviceStatus" show-overflow-tooltip label="设备状态"> |
| | | <el-table-column prop="deviceStatus" show-overflow-tooltip width="96" label="设备状态"> |
| | | <template v-slot="{ row }"> |
| | | {{ getDictLabel(row.status, dictObj.deviceStatus) }} |
| | | </template> |
| | |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="manufacturer" show-overflow-tooltip label="厂商" /> |
| | | <el-table-column prop="contactPhone" show-overflow-tooltip label="联系方式" /> |
| | | <el-table-column prop="contactPhone" show-overflow-tooltip width="112" label="联系方式" /> |
| | | <el-table-column prop="sceneName" show-overflow-tooltip label="所属场景" /> |
| | | <el-table-column label="设置配置" class-name="operation-btns"> |
| | | <el-table-column label="操作" class-name="operation-btns"> |
| | | <template v-slot="{ row }"> |
| | | <el-link @click="openForm('edit', row)" type="warning">配置接口</el-link> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="操作" class-name="operation-btns"> |
| | | <!-- <el-table-column label="操作" class-name="operation-btns"> |
| | | <template v-slot="{ row }"> |
| | | <el-link @click="handleEdit(row)">编辑</el-link> |
| | | <el-link @click="handleDelete(row)" type="danger">删除</el-link> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table-column>--> |
| | | </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-select-popper" |
| | | v-model:current-page="searchParams.current" |
| | | v-model:page-size="searchParams.size" |
| | | layout="total, prev, pager, next, sizes" |
| | |
| | | const initSearchParams = () => ({ |
| | | deviceName: '', // 设备名称 |
| | | deviceType: '', // 设备类型 |
| | | deviceStatus: '', // 设备状态 |
| | | status: '', // 设备状态 |
| | | current: 1, // 当前页 |
| | | size: 10, // 每页大小 |
| | | }) |
| | |
| | | async function getList() { |
| | | loading.value = true |
| | | try { |
| | | const res = await fwDevicePageApi(searchParams.value) |
| | | const res = await fwDevicePageApi({ |
| | | ...searchParams.value, |
| | | deviceStatusList: '0,1,2' |
| | | }) |
| | | list.value = res?.data?.data?.records ?? [] |
| | | total.value = res?.data?.data?.total ?? 0 |
| | | } finally { |
| | |
| | | function getDictList() { |
| | | getDictionaryByCode('deviceType,deviceStatus,deviceAtt').then(res => { |
| | | dictObj.value = res.data.data |
| | | dictObj.value.deviceStatus = dictObj.value.deviceStatus.filter(item => item.dictKey != 3) |
| | | }) |
| | | } |
| | | |
| | |
| | | async function handleDelete(row) { |
| | | await ElMessageBox.confirm('确认删除该设备吗?', '提示', { |
| | | type: 'warning', |
| | | customClass: 'ztzf-page-view-message-box', |
| | | confirmButtonClass: 'ztzf-message-box-confirm', |
| | | cancelButtonClass: 'ztzf-message-box-cancel', |
| | | customClass: 'command-page-view-message-box', |
| | | confirmButtonClass: 'command-message-box-confirm', |
| | | cancelButtonClass: 'command-message-box-cancel', |
| | | }) |
| | | await fwDeviceRemoveApi({ ids: row.id }) |
| | | ElMessage.success('删除成功') |
| | |
| | | } |
| | | |
| | | function formatDeployLocation(row) { |
| | | if (!row) return '' |
| | | const longitude = row.deployLongitude ?? row.longitude |
| | | const latitude = row.deployLatitude ?? row.latitude |
| | | if (longitude == null || latitude == null) return '' |
| | | return `${longitude}, ${latitude}` |
| | | if (!row.longitude || !row.latitude) return '' |
| | | return `${row.longitude}, ${row.latitude}` |
| | | } |
| | | |
| | | onMounted(() => { |