|
|
@@ -1,91 +1,101 @@
|
|
|
<template>
|
|
|
<div>
|
|
|
- <el-form :inline="true" :model="queryParams">
|
|
|
- <el-form-item label="遥测站编码" style="width: 210px;">
|
|
|
- <el-input v-model="queryParams.stationCode" placeholder="站点编码" clearable/>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="遥测站名称">
|
|
|
- <el-input v-model="queryParams.stationName" placeholder="遥测站点" clearable/>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="设备SN" style="width: 210px;">
|
|
|
- <el-input v-model="queryParams.deviceSn" placeholder="设备SN" clearable/>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="使用单位">
|
|
|
- <el-select v-model="queryParams.unitCode" placeholder="使用单位" filterable clearable>
|
|
|
- <el-option v-for="item in state.unitData" :key="item.unitCode" :label="item.unitName"
|
|
|
- :value="item.unitCode"></el-option>
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="关联单位">
|
|
|
- <el-select v-model="queryParams.visUnitCodes" placeholder="关联单位" filterable clearable>
|
|
|
- <el-option v-for="item in state.unitData2" :key="item.unitCode" :label="item.unitName"
|
|
|
- :value="item.unitCode" />
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
-
|
|
|
- <el-form-item>
|
|
|
- <el-button type="primary" class="button" :disabled="state.search_disabled" @click="queryList(true)">
|
|
|
- 查询信息
|
|
|
- </el-button>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item>
|
|
|
- <el-button type="primary" class="button" @click="handleAdd" :disabled="!adminFlag">新增遥测站</el-button>
|
|
|
- </el-form-item>
|
|
|
- </el-form>
|
|
|
-
|
|
|
- <el-table v-loading="loading" :data="state.tableData" border stripe style="width: 100%," :height="tableHeight"
|
|
|
- highlight-current-row @current-change="handleCurrentRowChange" size="large"
|
|
|
- :header-cell-style="{ background: '#606266', color: '#FFFFFF' }">
|
|
|
- <el-table-column fixed prop="stationCode" label="遥测站编码" header-align="center" width="100" />
|
|
|
- <el-table-column fit prop="stationName" label="遥测站名称" header-align="center" min-width="150" />
|
|
|
- <!-- <el-table-column fit prop="groupName" label="站点组" header-align="center" min-width="90" /> -->
|
|
|
- <el-table-column fit prop="unitName" label="使用单位" header-align="center" min-width="90"
|
|
|
- show-overflow-tooltip="unitName" />
|
|
|
- <el-table-column label="当前读数" header-align="center" width="90" />
|
|
|
- <el-table-column prop="stationContacts" label="联系人" header-align="center" width="90" />
|
|
|
- <!-- <el-table-column prop="stationLon" label="遥测站点经度" header-align="center" width="120" /> -->
|
|
|
- <el-table-column prop="stationLat" label="遥测站点" header-align="center" width="120">
|
|
|
- <template #default="scope">
|
|
|
- <el-space direction="vertical" alignment="start">
|
|
|
- <el-tag size="small">Lon:{{ scope.row.stationLon }}</el-tag>
|
|
|
- <el-tag size="small">Lat:{{ scope.row.stationLat }}</el-tag>
|
|
|
- </el-space>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="状态" header-align="center" align="center" width="80">
|
|
|
- <template #default="scope">
|
|
|
- <el-tag :type="UseStateColorMap[scope.row.useFlag]" size="small">{{ UseStateMap[scope.row.useFlag]
|
|
|
- }}</el-tag>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="站点安装信息" header-align="center" width="150">
|
|
|
- <template #default="scope">
|
|
|
- <el-space direction="vertical" alignment="start">
|
|
|
- <el-tag :type="SetupColorMap[scope.row.deviceSetupFlag]" size="small">{{
|
|
|
- SetupMap[scope.row.deviceSetupFlag]
|
|
|
+ <el-card>
|
|
|
+ <template #header>
|
|
|
+ <div class="card-header">
|
|
|
+ <el-form :inline="true" :model="queryParams">
|
|
|
+ <el-form-item label="遥测站编码" style="width: 210px;">
|
|
|
+ <el-input v-model="queryParams.stationCode" placeholder="站点编码" clearable/>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="遥测站名称">
|
|
|
+ <el-input v-model="queryParams.stationName" placeholder="遥测站点" clearable/>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="设备编号" style="width: 210px;">
|
|
|
+ <el-input v-model="queryParams.deviceSn" placeholder="设备编号" clearable/>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="使用单位">
|
|
|
+ <el-select v-model="queryParams.unitCode" placeholder="使用单位" filterable clearable>
|
|
|
+ <el-option v-for="item in state.unitData" :key="item.unitCode" :label="item.unitName"
|
|
|
+ :value="item.unitCode"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="关联单位">
|
|
|
+ <el-select v-model="queryParams.visUnitCodes" placeholder="关联单位" filterable clearable>
|
|
|
+ <el-option v-for="item in state.unitData2" :key="item.unitCode" :label="item.unitName"
|
|
|
+ :value="item.unitCode" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <el-form-item>
|
|
|
+ <el-button type="primary" class="button" :disabled="state.search_disabled" @click="queryList(true)">
|
|
|
+ 查询信息
|
|
|
+ </el-button>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-button type="primary" class="button" @click="handleAdd" :disabled="!adminFlag">新增遥测站</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <el-table v-loading="loading" :data="state.tableData" border stripe style="width: 100%," :height="tableHeight"
|
|
|
+ highlight-current-row @current-change="handleCurrentRowChange" size="large"
|
|
|
+ :header-cell-style="{ background: '#FF000000', color: '#000000' }">
|
|
|
+ <el-table-column fixed prop="stationCode" label="遥测站编码" header-align="center" width="100" />
|
|
|
+ <el-table-column fit prop="stationName" label="遥测站名称" header-align="center" width="250" />
|
|
|
+ <!-- <el-table-column fit prop="groupName" label="站点组" header-align="center" min-width="90" /> -->
|
|
|
+ <el-table-column prop="deviceSn" label="设备编号" header-align="center" align="center" width="120" />
|
|
|
+ <el-table-column fit prop="unitName" label="使用单位" header-align="center" min-width="90" width="250"
|
|
|
+ show-overflow-tooltip="unitName" />
|
|
|
+ <el-table-column label="当前读数" header-align="center" width="100" />
|
|
|
+ <el-table-column prop="stationContacts" label="站点联系信息" header-align="center" width="150" />
|
|
|
+ <!-- <el-table-column prop="stationLon" label="遥测站点经度" header-align="center" width="120" /> -->
|
|
|
+ <el-table-column prop="stationLat" label="站点经纬度" header-align="center" width="120">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-space direction="horation" alignment="start">
|
|
|
+ <!-- <el-tag size="small">Lon:{{ scope.row.stationLon }}</el-tag>
|
|
|
+ <el-tag size="small">Lat:{{ scope.row.stationLat }}</el-tag> -->
|
|
|
+ <span >{{
|
|
|
+ scope.row.stationLat==null ? " ":scope.row.stationLat + ","+ scope.row.stationLat
|
|
|
+ }}</span>
|
|
|
+ </el-space>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="状态" header-align="center" align="center" width="80">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-tag :type="UseStateColorMap[scope.row.useFlag]" size="small">{{ UseStateMap[scope.row.useFlag]
|
|
|
}}</el-tag>
|
|
|
- <el-tag size="small">人员：{{ scope.row.deviceSetupMan }}</el-tag>
|
|
|
- <el-tag size="small"> 日期：{{ tool.dateFormat(scope.row.deviceSetupDate) }}</el-tag>
|
|
|
- </el-space>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="deviceSn" label="设备SN" header-align="center" align="center" width="120" />
|
|
|
- <el-table-column prop="memo" label="备注" header-align="center" align="left" min-width="150" />
|
|
|
- <el-table-column fixed="right" label="" align="left" width="190">
|
|
|
- <template #default="scope">
|
|
|
- <el-button type="text">设备参数</el-button>
|
|
|
- <el-button type="text" @click="handleEdit(scope.row)" :disabled="!adminFlag">编辑</el-button>
|
|
|
- <el-button type="text" @click="handleDelete(scope.row)" :disabled="!adminFlag">删除</el-button>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- <el-config-provider :locale="locale">
|
|
|
- <el-pagination v-model:currentPage="queryParams.page" v-model:page-size="queryParams.rows"
|
|
|
- :page-sizes="[10, 15, 20, 25, 100]" :small="state.small" :disabled="state.disabled"
|
|
|
- :background="state.background" layout="total, sizes, prev, pager, next, jumper" :total="state.total"
|
|
|
- style="text-align: center;margin-top: 10px;height: 30px;" @size-change="handleSizeChange"
|
|
|
- @current-change="handleCurrentChange" />
|
|
|
- </el-config-provider>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="站点安装信息" header-align="center" width="200">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-space direction="horation" alignment="start">
|
|
|
+ <el-tag :type="SetupColorMap[scope.row.deviceSetupFlag]" size="small">{{
|
|
|
+ SetupMap[scope.row.deviceSetupFlag]
|
|
|
+ }}</el-tag>
|
|
|
+ <!-- <el-tag size="small">人员：{{ scope.row.deviceSetupMan }}</el-tag> -->
|
|
|
+ <el-tag size="small"> 日期：{{ tool.dateFormat(scope.row.deviceSetupDate) }}</el-tag>
|
|
|
+ </el-space>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+
|
|
|
+ <el-table-column prop="memo" label="备注" header-align="center" align="left" min-width="150" />
|
|
|
+ <el-table-column fixed="right" label="" align="left" width="190">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-button type="text">设备参数</el-button>
|
|
|
+ <el-button type="text" @click="handleEdit(scope.row)" :disabled="!adminFlag">编辑</el-button>
|
|
|
+ <el-button type="text" @click="handleDelete(scope.row)" :disabled="!adminFlag">删除</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <el-config-provider :locale="locale">
|
|
|
+ <el-pagination v-model:currentPage="queryParams.page" v-model:page-size="queryParams.rows"
|
|
|
+ :page-sizes="[10, 15, 20, 25, 100]" :small="state.small" :disabled="state.disabled"
|
|
|
+ :background="state.background" layout="total, sizes, prev, pager, next, jumper" :total="state.total"
|
|
|
+ style="text-align: center;margin-top: 10px;height: 30px;" @size-change="handleSizeChange"
|
|
|
+ @current-change="handleCurrentChange" />
|
|
|
+ </el-config-provider>
|
|
|
+ </el-card>
|
|
|
|
|
|
<el-dialog :title="formdialog.title" v-model="formdialog.visible" width="810px" draggable center>
|
|
|
<el-form ref="formRef" :model="formData" :rules="state.rules" label-width="100px">
|
|
|
@@ -285,7 +295,7 @@ const {
|
|
|
//groupData,
|
|
|
} = toRefs(state);
|
|
|
|
|
|
-const tableHeight = ref(document.documentElement.clientHeight - 250);
|
|
|
+const tableHeight = ref(document.documentElement.clientHeight - 200);
|
|
|
|
|
|
const currentRow = ref()
|
|
|
|
|
|
@@ -495,7 +505,7 @@ const queryList = (firstPage: boolean) => {
|
|
|
|
|
|
onMounted(() => {
|
|
|
window.onresize = function () {
|
|
|
- tableHeight.value = document.documentElement.clientHeight - 250;
|
|
|
+ tableHeight.value = document.documentElement.clientHeight - 200;
|
|
|
}
|
|
|
queryList(false);
|
|
|
queryUnit();
|
|
|
@@ -533,6 +543,29 @@ const queryUnit = () => {
|
|
|
margin: 10px 0;
|
|
|
}
|
|
|
|
|
|
+.card-header {
|
|
|
+ display: flexbox;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ vertical-align: center;
|
|
|
+ justify-content: center;
|
|
|
+ background-color: #E8EDF0;
|
|
|
+ height: 55px;
|
|
|
+ margin: -10px;
|
|
|
+ padding: 5px 10px;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+.el-card ::v-deep .el-card__header {
|
|
|
+ padding: 10px 10px;
|
|
|
+ background-color: white;
|
|
|
+}
|
|
|
+
|
|
|
+.el-card ::v-deep .el-card__body {
|
|
|
+ padding: 1px;
|
|
|
+ background-color: #E8EDF0;
|
|
|
+}
|
|
|
+
|
|
|
.el-table .warning-row {
|
|
|
--el-table-tr-bg-color: var(--el-color-warning-light-9);
|
|
|
}
|
