|
|
|
@ -13,8 +13,15 @@ |
|
|
|
@clear="handleSearch" |
|
|
|
@clear="handleSearch" |
|
|
|
> |
|
|
|
> |
|
|
|
<template #prefix> |
|
|
|
<template #prefix> |
|
|
|
<svg class="search-icon" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg"> |
|
|
|
<svg |
|
|
|
<path d="M909.6 854.5L649.9 594.8c41.3-54.3 65.9-121.4 65.9-194.1C715.8 262.2 560.6 107 370.4 107S25 262.2 25 452.4s155.2 345.4 345.4 345.4c72.7 0 139.8-24.6 194.1-65.9l259.7 259.7c11.1 11.1 29.1 11.1 40.2 0l45.2-45.2c11.1-11.1 11.1-29.1 0-40.2zM370.4 705c-139.1 0-252.6-113.5-252.6-252.6s113.5-252.6 252.6-252.6 252.6 113.5 252.6 252.6-113.5 252.6-252.6 252.6z" fill="currentColor"/> |
|
|
|
class="search-icon" |
|
|
|
|
|
|
|
viewBox="0 0 1024 1024" |
|
|
|
|
|
|
|
xmlns="http://www.w3.org/2000/svg" |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
<path |
|
|
|
|
|
|
|
d="M909.6 854.5L649.9 594.8c41.3-54.3 65.9-121.4 65.9-194.1C715.8 262.2 560.6 107 370.4 107S25 262.2 25 452.4s155.2 345.4 345.4 345.4c72.7 0 139.8-24.6 194.1-65.9l259.7 259.7c11.1 11.1 29.1 11.1 40.2 0l45.2-45.2c11.1-11.1 11.1-29.1 0-40.2zM370.4 705c-139.1 0-252.6-113.5-252.6-252.6s113.5-252.6 252.6-252.6 252.6 113.5 252.6 252.6-113.5 252.6-252.6 252.6z" |
|
|
|
|
|
|
|
fill="currentColor" |
|
|
|
|
|
|
|
/> |
|
|
|
</svg> |
|
|
|
</svg> |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
</el-input> |
|
|
|
</el-input> |
|
|
|
@ -55,14 +62,27 @@ |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="action-group"> |
|
|
|
<div class="action-group"> |
|
|
|
<el-button type="primary" @click="handleSearch" class="custom-btn">查询</el-button> |
|
|
|
<div class="primary-btn"> |
|
|
|
|
|
|
|
<el-button type="primary" @click="handleSearch" class="custom-btn" |
|
|
|
|
|
|
|
>查询</el-button |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
</div> |
|
|
|
<el-button @click="handleReset" class="custom-btn">重置</el-button> |
|
|
|
<el-button @click="handleReset" class="custom-btn">重置</el-button> |
|
|
|
<el-button type="success" @click="handleExport" class="custom-btn"> |
|
|
|
<div class="success-btn"> |
|
|
|
<svg class="btn-icon" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg"> |
|
|
|
<el-button type="success" @click="handleExport" class="custom-btn"> |
|
|
|
<path d="M384 704h256v-192h192l-320-320-320 320h192v192zM128 768h768v64H128v-64z" fill="currentColor"/> |
|
|
|
<svg |
|
|
|
</svg> |
|
|
|
class="btn-icon" |
|
|
|
导出列表 |
|
|
|
viewBox="0 0 1024 1024" |
|
|
|
</el-button> |
|
|
|
xmlns="http://www.w3.org/2000/svg" |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
<path |
|
|
|
|
|
|
|
d="M384 704h256v-192h192l-320-320-320 320h192v192zM128 768h768v64H128v-64z" |
|
|
|
|
|
|
|
fill="currentColor" |
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
</svg> |
|
|
|
|
|
|
|
导出列表 |
|
|
|
|
|
|
|
</el-button> |
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
@ -71,8 +91,14 @@ |
|
|
|
<div class="stat-card total"> |
|
|
|
<div class="stat-card total"> |
|
|
|
<div class="stat-icon"> |
|
|
|
<div class="stat-icon"> |
|
|
|
<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg"> |
|
|
|
<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg"> |
|
|
|
<path d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z" fill="currentColor"/> |
|
|
|
<path |
|
|
|
<path d="M688 464H336c-8.8 0-16 7.2-16 16v64c0 8.8 7.2 16 16 16h352c8.8 0 16-7.2 16-16v-64c0-8.8-7.2-16-16-16z" fill="currentColor"/> |
|
|
|
d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z" |
|
|
|
|
|
|
|
fill="currentColor" |
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
<path |
|
|
|
|
|
|
|
d="M688 464H336c-8.8 0-16 7.2-16 16v64c0 8.8 7.2 16 16 16h352c8.8 0 16-7.2 16-16v-64c0-8.8-7.2-16-16-16z" |
|
|
|
|
|
|
|
fill="currentColor" |
|
|
|
|
|
|
|
/> |
|
|
|
</svg> |
|
|
|
</svg> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="stat-info"> |
|
|
|
<div class="stat-info"> |
|
|
|
@ -83,9 +109,18 @@ |
|
|
|
<div class="stat-card running"> |
|
|
|
<div class="stat-card running"> |
|
|
|
<div class="stat-icon"> |
|
|
|
<div class="stat-icon"> |
|
|
|
<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg"> |
|
|
|
<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg"> |
|
|
|
<path d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z" fill="currentColor"/> |
|
|
|
<path |
|
|
|
<path d="M672 464H352c-8.8 0-16 7.2-16 16v64c0 8.8 7.2 16 16 16h320c8.8 0 16-7.2 16-16v-64c0-8.8-7.2-16-16-16z" fill="currentColor"/> |
|
|
|
d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z" |
|
|
|
<path d="M512 592c-4.4 0-8 3.6-8 8v256c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V600c0-4.4-3.6-8-8-8h-48z" fill="currentColor"/> |
|
|
|
fill="currentColor" |
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
<path |
|
|
|
|
|
|
|
d="M672 464H352c-8.8 0-16 7.2-16 16v64c0 8.8 7.2 16 16 16h320c8.8 0 16-7.2 16-16v-64c0-8.8-7.2-16-16-16z" |
|
|
|
|
|
|
|
fill="currentColor" |
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
<path |
|
|
|
|
|
|
|
d="M512 592c-4.4 0-8 3.6-8 8v256c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V600c0-4.4-3.6-8-8-8h-48z" |
|
|
|
|
|
|
|
fill="currentColor" |
|
|
|
|
|
|
|
/> |
|
|
|
</svg> |
|
|
|
</svg> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="stat-info"> |
|
|
|
<div class="stat-info"> |
|
|
|
@ -96,8 +131,14 @@ |
|
|
|
<div class="stat-card offline"> |
|
|
|
<div class="stat-card offline"> |
|
|
|
<div class="stat-icon"> |
|
|
|
<div class="stat-icon"> |
|
|
|
<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg"> |
|
|
|
<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg"> |
|
|
|
<path d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z" fill="currentColor"/> |
|
|
|
<path |
|
|
|
<path d="M512 352c-8.8 0-16 7.2-16 16v224c0 8.8 7.2 16 16 16h48c8.8 0 16-7.2 16-16V368c0-8.8-7.2-16-16-16h-48z" fill="currentColor"/> |
|
|
|
d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z" |
|
|
|
|
|
|
|
fill="currentColor" |
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
<path |
|
|
|
|
|
|
|
d="M512 352c-8.8 0-16 7.2-16 16v224c0 8.8 7.2 16 16 16h48c8.8 0 16-7.2 16-16V368c0-8.8-7.2-16-16-16h-48z" |
|
|
|
|
|
|
|
fill="currentColor" |
|
|
|
|
|
|
|
/> |
|
|
|
</svg> |
|
|
|
</svg> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="stat-info"> |
|
|
|
<div class="stat-info"> |
|
|
|
@ -108,8 +149,14 @@ |
|
|
|
<div class="stat-card fault"> |
|
|
|
<div class="stat-card fault"> |
|
|
|
<div class="stat-icon"> |
|
|
|
<div class="stat-icon"> |
|
|
|
<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg"> |
|
|
|
<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg"> |
|
|
|
<path d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z" fill="currentColor"/> |
|
|
|
<path |
|
|
|
<path d="M464 336a48 48 0 1096 0 48 48 0 10-96 0zm72 112h-48c-4.4 0-8 3.6-8 8v272c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V456c0-4.4-3.6-8-8-8z" fill="currentColor"/> |
|
|
|
d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z" |
|
|
|
|
|
|
|
fill="currentColor" |
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
<path |
|
|
|
|
|
|
|
d="M464 336a48 48 0 1096 0 48 48 0 10-96 0zm72 112h-48c-4.4 0-8 3.6-8 8v272c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V456c0-4.4-3.6-8-8-8z" |
|
|
|
|
|
|
|
fill="currentColor" |
|
|
|
|
|
|
|
/> |
|
|
|
</svg> |
|
|
|
</svg> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="stat-info"> |
|
|
|
<div class="stat-info"> |
|
|
|
@ -120,8 +167,14 @@ |
|
|
|
<div class="stat-card standby"> |
|
|
|
<div class="stat-card standby"> |
|
|
|
<div class="stat-icon"> |
|
|
|
<div class="stat-icon"> |
|
|
|
<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg"> |
|
|
|
<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg"> |
|
|
|
<path d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z" fill="currentColor"/> |
|
|
|
<path |
|
|
|
<path d="M688 464H336c-8.8 0-16 7.2-16 16v64c0 8.8 7.2 16 16 16h352c8.8 0 16-7.2 16-16v-64c0-8.8-7.2-16-16-16z" fill="currentColor"/> |
|
|
|
d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z" |
|
|
|
|
|
|
|
fill="currentColor" |
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
<path |
|
|
|
|
|
|
|
d="M688 464H336c-8.8 0-16 7.2-16 16v64c0 8.8 7.2 16 16 16h352c8.8 0 16-7.2 16-16v-64c0-8.8-7.2-16-16-16z" |
|
|
|
|
|
|
|
fill="currentColor" |
|
|
|
|
|
|
|
/> |
|
|
|
</svg> |
|
|
|
</svg> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="stat-info"> |
|
|
|
<div class="stat-info"> |
|
|
|
@ -140,7 +193,7 @@ |
|
|
|
@click="handleCategoryChange(index)" |
|
|
|
@click="handleCategoryChange(index)" |
|
|
|
> |
|
|
|
> |
|
|
|
<span class="tab-icon">{{ getCategoryIcon(category.value) }}</span> |
|
|
|
<span class="tab-icon">{{ getCategoryIcon(category.value) }}</span> |
|
|
|
<span class="tab-label">{{ category.label }}</span> |
|
|
|
<!-- <span class="tab-label">{{ category.label }}</span> --> |
|
|
|
<span class="tab-count">({{ category.count }})</span> |
|
|
|
<span class="tab-count">({{ category.count }})</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
@ -149,9 +202,7 @@ |
|
|
|
<div class="device-list-container"> |
|
|
|
<div class="device-list-container"> |
|
|
|
<div class="list-header"> |
|
|
|
<div class="list-header"> |
|
|
|
<div class="list-title">设备列表</div> |
|
|
|
<div class="list-title">设备列表</div> |
|
|
|
<div class="list-info"> |
|
|
|
<div class="list-info">共 {{ filteredDevices.length }} 台设备</div> |
|
|
|
共 {{ filteredDevices.length }} 台设备 |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="device-grid"> |
|
|
|
<div class="device-grid"> |
|
|
|
<div |
|
|
|
<div |
|
|
|
@ -161,7 +212,7 @@ |
|
|
|
@click="viewDeviceDetail(device)" |
|
|
|
@click="viewDeviceDetail(device)" |
|
|
|
> |
|
|
|
> |
|
|
|
<div class="card-header"> |
|
|
|
<div class="card-header"> |
|
|
|
<div class="device-icon" :style="{ background: device.iconBg }"> |
|
|
|
<div class="device-icon"> |
|
|
|
<span>{{ getDeviceIcon(device.type) }}</span> |
|
|
|
<span>{{ getDeviceIcon(device.type) }}</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="device-header-info"> |
|
|
|
<div class="device-header-info"> |
|
|
|
@ -251,7 +302,10 @@ |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="info-item"> |
|
|
|
<div class="info-item"> |
|
|
|
<span class="item-label">设备状态:</span> |
|
|
|
<span class="item-label">设备状态:</span> |
|
|
|
<span class="item-value status-badge" :class="selectedDevice.status"> |
|
|
|
<span |
|
|
|
|
|
|
|
class="item-value status-badge" |
|
|
|
|
|
|
|
:class="selectedDevice.status" |
|
|
|
|
|
|
|
> |
|
|
|
{{ getStatusText(selectedDevice.status) }} |
|
|
|
{{ getStatusText(selectedDevice.status) }} |
|
|
|
</span> |
|
|
|
</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
@ -262,7 +316,12 @@ |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
<div class="detail-section" v-if="selectedDevice.parameters && selectedDevice.parameters.length > 0"> |
|
|
|
<div |
|
|
|
|
|
|
|
class="detail-section" |
|
|
|
|
|
|
|
v-if=" |
|
|
|
|
|
|
|
selectedDevice.parameters && selectedDevice.parameters.length > 0 |
|
|
|
|
|
|
|
" |
|
|
|
|
|
|
|
> |
|
|
|
<div class="section-title">运行参数</div> |
|
|
|
<div class="section-title">运行参数</div> |
|
|
|
<div class="params-grid"> |
|
|
|
<div class="params-grid"> |
|
|
|
<div |
|
|
|
<div |
|
|
|
@ -292,13 +351,17 @@ |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="status-item" v-if="selectedDevice.status === 'fault'"> |
|
|
|
<div class="status-item" v-if="selectedDevice.status === 'fault'"> |
|
|
|
<span class="status-label">故障信息:</span> |
|
|
|
<span class="status-label">故障信息:</span> |
|
|
|
<span class="status-text fault">{{ selectedDevice.faultInfo || '未知故障' }}</span> |
|
|
|
<span class="status-text fault">{{ |
|
|
|
|
|
|
|
selectedDevice.faultInfo || "未知故障" |
|
|
|
|
|
|
|
}}</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<template #footer> |
|
|
|
<template #footer> |
|
|
|
<el-button @click="closeDetailDialog" class="custom-btn">关闭</el-button> |
|
|
|
<el-button @click="closeDetailDialog" class="custom-btn" |
|
|
|
|
|
|
|
>关闭</el-button |
|
|
|
|
|
|
|
> |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
</el-dialog> |
|
|
|
</el-dialog> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
@ -312,7 +375,7 @@ export default { |
|
|
|
searchForm: { |
|
|
|
searchForm: { |
|
|
|
deviceName: "", |
|
|
|
deviceName: "", |
|
|
|
deviceStatus: "", |
|
|
|
deviceStatus: "", |
|
|
|
deviceType: "" |
|
|
|
deviceType: "", |
|
|
|
}, |
|
|
|
}, |
|
|
|
deviceTypes: [ |
|
|
|
deviceTypes: [ |
|
|
|
{ label: "主机", value: "host" }, |
|
|
|
{ label: "主机", value: "host" }, |
|
|
|
@ -321,7 +384,7 @@ export default { |
|
|
|
{ label: "冷却塔", value: "coolingTower" }, |
|
|
|
{ label: "冷却塔", value: "coolingTower" }, |
|
|
|
{ label: "温度传感器", value: "tempSensor" }, |
|
|
|
{ label: "温度传感器", value: "tempSensor" }, |
|
|
|
{ label: "压力传感器", value: "pressureSensor" }, |
|
|
|
{ label: "压力传感器", value: "pressureSensor" }, |
|
|
|
{ label: "电表", value: "meter" } |
|
|
|
{ label: "电表", value: "meter" }, |
|
|
|
], |
|
|
|
], |
|
|
|
deviceCategories: [ |
|
|
|
deviceCategories: [ |
|
|
|
{ label: "全部设备", value: "all", count: 48 }, |
|
|
|
{ label: "全部设备", value: "all", count: 48 }, |
|
|
|
@ -330,7 +393,7 @@ export default { |
|
|
|
{ label: "冷却泵", value: "coolingPump", count: 4 }, |
|
|
|
{ label: "冷却泵", value: "coolingPump", count: 4 }, |
|
|
|
{ label: "冷却塔", value: "coolingTower", count: 3 }, |
|
|
|
{ label: "冷却塔", value: "coolingTower", count: 3 }, |
|
|
|
{ label: "传感器", value: "sensor", count: 28 }, |
|
|
|
{ label: "传感器", value: "sensor", count: 28 }, |
|
|
|
{ label: "电表", value: "meter", count: 5 } |
|
|
|
{ label: "电表", value: "meter", count: 5 }, |
|
|
|
], |
|
|
|
], |
|
|
|
activeCategory: 0, |
|
|
|
activeCategory: 0, |
|
|
|
currentPage: 1, |
|
|
|
currentPage: 1, |
|
|
|
@ -341,10 +404,10 @@ export default { |
|
|
|
running: 38, |
|
|
|
running: 38, |
|
|
|
offline: 5, |
|
|
|
offline: 5, |
|
|
|
fault: 2, |
|
|
|
fault: 2, |
|
|
|
standby: 3 |
|
|
|
standby: 3, |
|
|
|
}, |
|
|
|
}, |
|
|
|
detailDialogVisible: false, |
|
|
|
detailDialogVisible: false, |
|
|
|
selectedDevice: null |
|
|
|
selectedDevice: null, |
|
|
|
}; |
|
|
|
}; |
|
|
|
}, |
|
|
|
}, |
|
|
|
computed: { |
|
|
|
computed: { |
|
|
|
@ -353,20 +416,28 @@ export default { |
|
|
|
const category = this.deviceCategories[this.activeCategory]; |
|
|
|
const category = this.deviceCategories[this.activeCategory]; |
|
|
|
if (category.value !== "all") { |
|
|
|
if (category.value !== "all") { |
|
|
|
if (category.value === "sensor") { |
|
|
|
if (category.value === "sensor") { |
|
|
|
devices = devices.filter(d => d.type === "tempSensor" || d.type === "pressureSensor"); |
|
|
|
devices = devices.filter( |
|
|
|
|
|
|
|
(d) => d.type === "tempSensor" || d.type === "pressureSensor" |
|
|
|
|
|
|
|
); |
|
|
|
} else { |
|
|
|
} else { |
|
|
|
devices = devices.filter(d => d.type === category.value); |
|
|
|
devices = devices.filter((d) => d.type === category.value); |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
if (this.searchForm.deviceName) { |
|
|
|
if (this.searchForm.deviceName) { |
|
|
|
const keyword = this.searchForm.deviceName.toLowerCase(); |
|
|
|
const keyword = this.searchForm.deviceName.toLowerCase(); |
|
|
|
devices = devices.filter(d => d.name.toLowerCase().includes(keyword) || d.code.toLowerCase().includes(keyword)); |
|
|
|
devices = devices.filter( |
|
|
|
|
|
|
|
(d) => |
|
|
|
|
|
|
|
d.name.toLowerCase().includes(keyword) || |
|
|
|
|
|
|
|
d.code.toLowerCase().includes(keyword) |
|
|
|
|
|
|
|
); |
|
|
|
} |
|
|
|
} |
|
|
|
if (this.searchForm.deviceStatus) { |
|
|
|
if (this.searchForm.deviceStatus) { |
|
|
|
devices = devices.filter(d => d.status === this.searchForm.deviceStatus); |
|
|
|
devices = devices.filter( |
|
|
|
|
|
|
|
(d) => d.status === this.searchForm.deviceStatus |
|
|
|
|
|
|
|
); |
|
|
|
} |
|
|
|
} |
|
|
|
if (this.searchForm.deviceType) { |
|
|
|
if (this.searchForm.deviceType) { |
|
|
|
devices = devices.filter(d => d.type === this.searchForm.deviceType); |
|
|
|
devices = devices.filter((d) => d.type === this.searchForm.deviceType); |
|
|
|
} |
|
|
|
} |
|
|
|
return devices; |
|
|
|
return devices; |
|
|
|
}, |
|
|
|
}, |
|
|
|
@ -374,7 +445,7 @@ export default { |
|
|
|
const start = (this.currentPage - 1) * this.pageSize; |
|
|
|
const start = (this.currentPage - 1) * this.pageSize; |
|
|
|
const end = start + this.pageSize; |
|
|
|
const end = start + this.pageSize; |
|
|
|
return this.filteredDevices.slice(start, end); |
|
|
|
return this.filteredDevices.slice(start, end); |
|
|
|
} |
|
|
|
}, |
|
|
|
}, |
|
|
|
}, |
|
|
|
mounted() { |
|
|
|
mounted() { |
|
|
|
this.initDeviceList(); |
|
|
|
this.initDeviceList(); |
|
|
|
@ -388,28 +459,256 @@ export default { |
|
|
|
const meterIcons = ["#a8edea", "#fed6e3"]; |
|
|
|
const meterIcons = ["#a8edea", "#fed6e3"]; |
|
|
|
|
|
|
|
|
|
|
|
this.deviceList = [ |
|
|
|
this.deviceList = [ |
|
|
|
{ code: "CH-001", name: "1号主机", type: "host", model: "YKK3CF2HE5", spec: "制冷量: 1200RT, 额定功率: 750kW, 额定电流: 1350A", installDate: "2020-06-15", status: "running", runtime: "1256小时", iconBg: `linear-gradient(135deg, #${hostIcons[0]} 0%, #${hostIcons[1]} 100%)`, parameters: [{ label: "进水温度", value: "12.5", unit: "℃" }, { label: "出水温度", value: "7.2", unit: "℃" }, { label: "电流", value: "850", unit: "A" }, { label: "功率", value: "520", unit: "kW" }, { label: "COP", value: "5.2", unit: "" }] }, |
|
|
|
{ |
|
|
|
{ code: "CH-002", name: "2号主机", type: "host", model: "YKK3CF2HE5", spec: "制冷量: 1200RT, 额定功率: 750kW, 额定电流: 1350A", installDate: "2020-06-15", status: "running", runtime: "1180小时", iconBg: `linear-gradient(135deg, #${hostIcons[0]} 0%, #${hostIcons[1]} 100%)`, parameters: [{ label: "进水温度", value: "12.3", unit: "℃" }, { label: "出水温度", value: "7.1", unit: "℃" }, { label: "电流", value: "830", unit: "A" }, { label: "功率", value: "508", unit: "kW" }, { label: "COP", value: "5.1", unit: "" }] }, |
|
|
|
code: "CH-001", |
|
|
|
{ code: "CH-003", name: "3号主机", type: "host", model: "YKK3CF2HE5", spec: "制冷量: 1200RT, 额定功率: 750kW, 额定电流: 1350A", installDate: "2020-06-15", status: "standby", iconBg: `linear-gradient(135deg, #${hostIcons[0]} 0%, #${hostIcons[1]} 100%)` }, |
|
|
|
name: "1号主机", |
|
|
|
{ code: "CH-004", name: "4号主机", type: "host", model: "YKK3CF2HE5", spec: "制冷量: 1200RT, 额定功率: 750kW, 额定电流: 1350A", installDate: "2020-06-15", status: "standby", iconBg: `linear-gradient(135deg, #${hostIcons[0]} 0%, #${hostIcons[1]} 100%)` }, |
|
|
|
type: "host", |
|
|
|
{ code: "CP-001", name: "1号冷冻泵", type: "chillerPump", model: "XLE100-400", spec: "流量: 1200m3/h, 扬程: 32m, 功率: 132kW", installDate: "2020-06-15", status: "running", runtime: "1256小时", iconBg: `linear-gradient(135deg, #${pumpIcons[0]} 0%, #${pumpIcons[1]} 100%)`, parameters: [{ label: "流量", value: "1150", unit: "m3/h" }, { label: "扬程", value: "30.5", unit: "m" }, { label: "电流", value: "185", unit: "A" }, { label: "功率", value: "98", unit: "kW" }] }, |
|
|
|
model: "YKK3CF2HE5", |
|
|
|
{ code: "CP-002", name: "2号冷冻泵", type: "chillerPump", model: "XLE100-400", spec: "流量: 1200m3/h, 扬程: 32m, 功率: 132kW", installDate: "2020-06-15", status: "running", runtime: "1180小时", iconBg: `linear-gradient(135deg, #${pumpIcons[0]} 0%, #${pumpIcons[1]} 100%)`, parameters: [{ label: "流量", value: "1120", unit: "m3/h" }, { label: "扬程", value: "29.8", unit: "m" }, { label: "电流", value: "178", unit: "A" }, { label: "功率", value: "95", unit: "kW" }] }, |
|
|
|
spec: "制冷量: 1200RT, 额定功率: 750kW, 额定电流: 1350A", |
|
|
|
{ code: "CP-003", name: "3号冷冻泵", type: "chillerPump", model: "XLE100-400", spec: "流量: 1200m3/h, 扬程: 32m, 功率: 132kW", installDate: "2020-06-15", status: "standby", iconBg: `linear-gradient(135deg, #${pumpIcons[0]} 0%, #${pumpIcons[1]} 100%)` }, |
|
|
|
installDate: "2020-06-15", |
|
|
|
{ code: "CP-004", name: "4号冷冻泵", type: "chillerPump", model: "XLE100-400", spec: "流量: 1200m3/h, 扬程: 32m, 功率: 132kW", installDate: "2020-06-15", status: "fault", faultInfo: "电机过载保护", iconBg: `linear-gradient(135deg, #${pumpIcons[0]} 0%, #${pumpIcons[1]} 100%)` }, |
|
|
|
status: "running", |
|
|
|
{ code: "CWP-001", name: "1号冷却泵", type: "coolingPump", model: "XLE100-400", spec: "流量: 1200m3/h, 扬程: 28m, 功率: 110kW", installDate: "2020-06-15", status: "running", runtime: "1256小时", iconBg: `linear-gradient(135deg, #43e97b 0%, #38f9d7 100%)`, parameters: [{ label: "流量", value: "1180", unit: "m3/h" }, { label: "扬程", value: "27.2", unit: "m" }, { label: "电流", value: "158", unit: "A" }, { label: "功率", value: "85", unit: "kW" }] }, |
|
|
|
runtime: "1256小时", |
|
|
|
{ code: "CWP-002", name: "2号冷却泵", type: "coolingPump", model: "XLE100-400", spec: "流量: 1200m3/h, 扬程: 28m, 功率: 110kW", installDate: "2020-06-15", status: "running", runtime: "1180小时", iconBg: `linear-gradient(135deg, #43e97b 0%, #38f9d7 100%)`, parameters: [{ label: "流量", value: "1160", unit: "m3/h" }, { label: "扬程", value: "26.8", unit: "m" }, { label: "电流", value: "152", unit: "A" }, { label: "功率", value: "82", unit: "kW" }] }, |
|
|
|
iconBg: `linear-gradient(135deg, #${hostIcons[0]} 0%, #${hostIcons[1]} 100%)`, |
|
|
|
{ code: "CWP-003", name: "3号冷却泵", type: "coolingPump", model: "XLE100-400", spec: "流量: 1200m3/h, 扬程: 28m, 功率: 110kW", installDate: "2020-06-15", status: "running", runtime: "1256小时", iconBg: `linear-gradient(135deg, #43e97b 0%, #38f9d7 100%)` }, |
|
|
|
parameters: [ |
|
|
|
{ code: "CWP-004", name: "4号冷却泵", type: "coolingPump", model: "XLE100-400", spec: "流量: 1200m3/h, 扬程: 28m, 功率: 110kW", installDate: "2020-06-15", status: "running", runtime: "1180小时", iconBg: `linear-gradient(135deg, #43e97b 0%, #38f9d7 100%)` }, |
|
|
|
{ label: "进水温度", value: "12.5", unit: "℃" }, |
|
|
|
{ code: "CT-001", name: "1号冷却塔", type: "coolingTower", model: "CT-800", spec: "冷却水量: 800m3/h, 风机功率: 22kW", installDate: "2020-06-15", status: "running", runtime: "1256小时", iconBg: `linear-gradient(135deg, #${towerIcons[0]} 0%, #${towerIcons[1]} 100%)`, parameters: [{ label: "进水温度", value: "37.2", unit: "℃" }, { label: "出水温度", value: "32.5", unit: "℃" }, { label: "风机频率", value: "45", unit: "Hz" }, { label: "风机功率", value: "12.5", unit: "kW" }] }, |
|
|
|
{ label: "出水温度", value: "7.2", unit: "℃" }, |
|
|
|
{ code: "CT-002", name: "2号冷却塔", type: "coolingTower", model: "CT-800", spec: "冷却水量: 800m3/h, 风机功率: 22kW", installDate: "2020-06-15", status: "running", runtime: "1180小时", iconBg: `linear-gradient(135deg, #${towerIcons[0]} 0%, #${towerIcons[1]} 100%)`, parameters: [{ label: "进水温度", value: "37.0", unit: "℃" }, { label: "出水温度", value: "32.3", unit: "℃" }, { label: "风机频率", value: "43", unit: "Hz" }, { label: "风机功率", value: "11.8", unit: "kW" }] }, |
|
|
|
{ label: "电流", value: "850", unit: "A" }, |
|
|
|
{ code: "CT-003", name: "3号冷却塔", type: "coolingTower", model: "CT-800", spec: "冷却水量: 800m3/h, 风机功率: 22kW", installDate: "2020-06-15", status: "standby", iconBg: `linear-gradient(135deg, #${towerIcons[0]} 0%, #${towerIcons[1]} 100%)` }, |
|
|
|
{ label: "功率", value: "520", unit: "kW" }, |
|
|
|
{ code: "EM-001", name: "总电表", type: "meter", model: "DTS666", spec: "三相四线, 3(6)A, 0.5S级", installDate: "2020-06-15", status: "running", iconBg: `linear-gradient(135deg, #${meterIcons[0]} 0%, #${meterIcons[1]} 100%)`, parameters: [{ label: "总有功电能", value: "1256800", unit: "kWh" }, { label: "总功率", value: "1256", unit: "kW" }, { label: "A相电流", value: "850", unit: "A" }, { label: "B相电流", value: "820", unit: "A" }, { label: "C相电流", value: "830", unit: "A" }] }, |
|
|
|
{ label: "COP", value: "5.2", unit: "" }, |
|
|
|
{ code: "EM-002", name: "1号主机电表", type: "meter", model: "DTS666", spec: "三相四线, 3(6)A, 0.5S级", installDate: "2020-06-15", status: "running", iconBg: `linear-gradient(135deg, #${meterIcons[0]} 0%, #${meterIcons[1]} 100%)`, parameters: [{ label: "有功电能", value: "285600", unit: "kWh" }, { label: "功率", value: "520", unit: "kW" }, { label: "A相电流", value: "285", unit: "A" }, { label: "B相电流", value: "280", unit: "A" }, { label: "C相电流", value: "285", unit: "A" }] } |
|
|
|
], |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
code: "CH-002", |
|
|
|
|
|
|
|
name: "2号主机", |
|
|
|
|
|
|
|
type: "host", |
|
|
|
|
|
|
|
model: "YKK3CF2HE5", |
|
|
|
|
|
|
|
spec: "制冷量: 1200RT, 额定功率: 750kW, 额定电流: 1350A", |
|
|
|
|
|
|
|
installDate: "2020-06-15", |
|
|
|
|
|
|
|
status: "running", |
|
|
|
|
|
|
|
runtime: "1180小时", |
|
|
|
|
|
|
|
iconBg: `linear-gradient(135deg, #${hostIcons[0]} 0%, #${hostIcons[1]} 100%)`, |
|
|
|
|
|
|
|
parameters: [ |
|
|
|
|
|
|
|
{ label: "进水温度", value: "12.3", unit: "℃" }, |
|
|
|
|
|
|
|
{ label: "出水温度", value: "7.1", unit: "℃" }, |
|
|
|
|
|
|
|
{ label: "电流", value: "830", unit: "A" }, |
|
|
|
|
|
|
|
{ label: "功率", value: "508", unit: "kW" }, |
|
|
|
|
|
|
|
{ label: "COP", value: "5.1", unit: "" }, |
|
|
|
|
|
|
|
], |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
code: "CH-003", |
|
|
|
|
|
|
|
name: "3号主机", |
|
|
|
|
|
|
|
type: "host", |
|
|
|
|
|
|
|
model: "YKK3CF2HE5", |
|
|
|
|
|
|
|
spec: "制冷量: 1200RT, 额定功率: 750kW, 额定电流: 1350A", |
|
|
|
|
|
|
|
installDate: "2020-06-15", |
|
|
|
|
|
|
|
status: "standby", |
|
|
|
|
|
|
|
iconBg: `linear-gradient(135deg, #${hostIcons[0]} 0%, #${hostIcons[1]} 100%)`, |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
code: "CH-004", |
|
|
|
|
|
|
|
name: "4号主机", |
|
|
|
|
|
|
|
type: "host", |
|
|
|
|
|
|
|
model: "YKK3CF2HE5", |
|
|
|
|
|
|
|
spec: "制冷量: 1200RT, 额定功率: 750kW, 额定电流: 1350A", |
|
|
|
|
|
|
|
installDate: "2020-06-15", |
|
|
|
|
|
|
|
status: "standby", |
|
|
|
|
|
|
|
iconBg: `linear-gradient(135deg, #${hostIcons[0]} 0%, #${hostIcons[1]} 100%)`, |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
code: "CP-001", |
|
|
|
|
|
|
|
name: "1号冷冻泵", |
|
|
|
|
|
|
|
type: "chillerPump", |
|
|
|
|
|
|
|
model: "XLE100-400", |
|
|
|
|
|
|
|
spec: "流量: 1200m3/h, 扬程: 32m, 功率: 132kW", |
|
|
|
|
|
|
|
installDate: "2020-06-15", |
|
|
|
|
|
|
|
status: "running", |
|
|
|
|
|
|
|
runtime: "1256小时", |
|
|
|
|
|
|
|
iconBg: `linear-gradient(135deg, #${pumpIcons[0]} 0%, #${pumpIcons[1]} 100%)`, |
|
|
|
|
|
|
|
parameters: [ |
|
|
|
|
|
|
|
{ label: "流量", value: "1150", unit: "m3/h" }, |
|
|
|
|
|
|
|
{ label: "扬程", value: "30.5", unit: "m" }, |
|
|
|
|
|
|
|
{ label: "电流", value: "185", unit: "A" }, |
|
|
|
|
|
|
|
{ label: "功率", value: "98", unit: "kW" }, |
|
|
|
|
|
|
|
], |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
code: "CP-002", |
|
|
|
|
|
|
|
name: "2号冷冻泵", |
|
|
|
|
|
|
|
type: "chillerPump", |
|
|
|
|
|
|
|
model: "XLE100-400", |
|
|
|
|
|
|
|
spec: "流量: 1200m3/h, 扬程: 32m, 功率: 132kW", |
|
|
|
|
|
|
|
installDate: "2020-06-15", |
|
|
|
|
|
|
|
status: "running", |
|
|
|
|
|
|
|
runtime: "1180小时", |
|
|
|
|
|
|
|
iconBg: `linear-gradient(135deg, #${pumpIcons[0]} 0%, #${pumpIcons[1]} 100%)`, |
|
|
|
|
|
|
|
parameters: [ |
|
|
|
|
|
|
|
{ label: "流量", value: "1120", unit: "m3/h" }, |
|
|
|
|
|
|
|
{ label: "扬程", value: "29.8", unit: "m" }, |
|
|
|
|
|
|
|
{ label: "电流", value: "178", unit: "A" }, |
|
|
|
|
|
|
|
{ label: "功率", value: "95", unit: "kW" }, |
|
|
|
|
|
|
|
], |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
code: "CP-003", |
|
|
|
|
|
|
|
name: "3号冷冻泵", |
|
|
|
|
|
|
|
type: "chillerPump", |
|
|
|
|
|
|
|
model: "XLE100-400", |
|
|
|
|
|
|
|
spec: "流量: 1200m3/h, 扬程: 32m, 功率: 132kW", |
|
|
|
|
|
|
|
installDate: "2020-06-15", |
|
|
|
|
|
|
|
status: "standby", |
|
|
|
|
|
|
|
iconBg: `linear-gradient(135deg, #${pumpIcons[0]} 0%, #${pumpIcons[1]} 100%)`, |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
code: "CP-004", |
|
|
|
|
|
|
|
name: "4号冷冻泵", |
|
|
|
|
|
|
|
type: "chillerPump", |
|
|
|
|
|
|
|
model: "XLE100-400", |
|
|
|
|
|
|
|
spec: "流量: 1200m3/h, 扬程: 32m, 功率: 132kW", |
|
|
|
|
|
|
|
installDate: "2020-06-15", |
|
|
|
|
|
|
|
status: "fault", |
|
|
|
|
|
|
|
faultInfo: "电机过载保护", |
|
|
|
|
|
|
|
iconBg: `linear-gradient(135deg, #${pumpIcons[0]} 0%, #${pumpIcons[1]} 100%)`, |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
code: "CWP-001", |
|
|
|
|
|
|
|
name: "1号冷却泵", |
|
|
|
|
|
|
|
type: "coolingPump", |
|
|
|
|
|
|
|
model: "XLE100-400", |
|
|
|
|
|
|
|
spec: "流量: 1200m3/h, 扬程: 28m, 功率: 110kW", |
|
|
|
|
|
|
|
installDate: "2020-06-15", |
|
|
|
|
|
|
|
status: "running", |
|
|
|
|
|
|
|
runtime: "1256小时", |
|
|
|
|
|
|
|
iconBg: `linear-gradient(135deg, #43e97b 0%, #38f9d7 100%)`, |
|
|
|
|
|
|
|
parameters: [ |
|
|
|
|
|
|
|
{ label: "流量", value: "1180", unit: "m3/h" }, |
|
|
|
|
|
|
|
{ label: "扬程", value: "27.2", unit: "m" }, |
|
|
|
|
|
|
|
{ label: "电流", value: "158", unit: "A" }, |
|
|
|
|
|
|
|
{ label: "功率", value: "85", unit: "kW" }, |
|
|
|
|
|
|
|
], |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
code: "CWP-002", |
|
|
|
|
|
|
|
name: "2号冷却泵", |
|
|
|
|
|
|
|
type: "coolingPump", |
|
|
|
|
|
|
|
model: "XLE100-400", |
|
|
|
|
|
|
|
spec: "流量: 1200m3/h, 扬程: 28m, 功率: 110kW", |
|
|
|
|
|
|
|
installDate: "2020-06-15", |
|
|
|
|
|
|
|
status: "running", |
|
|
|
|
|
|
|
runtime: "1180小时", |
|
|
|
|
|
|
|
iconBg: `linear-gradient(135deg, #43e97b 0%, #38f9d7 100%)`, |
|
|
|
|
|
|
|
parameters: [ |
|
|
|
|
|
|
|
{ label: "流量", value: "1160", unit: "m3/h" }, |
|
|
|
|
|
|
|
{ label: "扬程", value: "26.8", unit: "m" }, |
|
|
|
|
|
|
|
{ label: "电流", value: "152", unit: "A" }, |
|
|
|
|
|
|
|
{ label: "功率", value: "82", unit: "kW" }, |
|
|
|
|
|
|
|
], |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
code: "CWP-003", |
|
|
|
|
|
|
|
name: "3号冷却泵", |
|
|
|
|
|
|
|
type: "coolingPump", |
|
|
|
|
|
|
|
model: "XLE100-400", |
|
|
|
|
|
|
|
spec: "流量: 1200m3/h, 扬程: 28m, 功率: 110kW", |
|
|
|
|
|
|
|
installDate: "2020-06-15", |
|
|
|
|
|
|
|
status: "running", |
|
|
|
|
|
|
|
runtime: "1256小时", |
|
|
|
|
|
|
|
iconBg: `linear-gradient(135deg, #43e97b 0%, #38f9d7 100%)`, |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
code: "CWP-004", |
|
|
|
|
|
|
|
name: "4号冷却泵", |
|
|
|
|
|
|
|
type: "coolingPump", |
|
|
|
|
|
|
|
model: "XLE100-400", |
|
|
|
|
|
|
|
spec: "流量: 1200m3/h, 扬程: 28m, 功率: 110kW", |
|
|
|
|
|
|
|
installDate: "2020-06-15", |
|
|
|
|
|
|
|
status: "running", |
|
|
|
|
|
|
|
runtime: "1180小时", |
|
|
|
|
|
|
|
iconBg: `linear-gradient(135deg, #43e97b 0%, #38f9d7 100%)`, |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
code: "CT-001", |
|
|
|
|
|
|
|
name: "1号冷却塔", |
|
|
|
|
|
|
|
type: "coolingTower", |
|
|
|
|
|
|
|
model: "CT-800", |
|
|
|
|
|
|
|
spec: "冷却水量: 800m3/h, 风机功率: 22kW", |
|
|
|
|
|
|
|
installDate: "2020-06-15", |
|
|
|
|
|
|
|
status: "running", |
|
|
|
|
|
|
|
runtime: "1256小时", |
|
|
|
|
|
|
|
iconBg: `linear-gradient(135deg, #${towerIcons[0]} 0%, #${towerIcons[1]} 100%)`, |
|
|
|
|
|
|
|
parameters: [ |
|
|
|
|
|
|
|
{ label: "进水温度", value: "37.2", unit: "℃" }, |
|
|
|
|
|
|
|
{ label: "出水温度", value: "32.5", unit: "℃" }, |
|
|
|
|
|
|
|
{ label: "风机频率", value: "45", unit: "Hz" }, |
|
|
|
|
|
|
|
{ label: "风机功率", value: "12.5", unit: "kW" }, |
|
|
|
|
|
|
|
], |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
code: "CT-002", |
|
|
|
|
|
|
|
name: "2号冷却塔", |
|
|
|
|
|
|
|
type: "coolingTower", |
|
|
|
|
|
|
|
model: "CT-800", |
|
|
|
|
|
|
|
spec: "冷却水量: 800m3/h, 风机功率: 22kW", |
|
|
|
|
|
|
|
installDate: "2020-06-15", |
|
|
|
|
|
|
|
status: "running", |
|
|
|
|
|
|
|
runtime: "1180小时", |
|
|
|
|
|
|
|
iconBg: `linear-gradient(135deg, #${towerIcons[0]} 0%, #${towerIcons[1]} 100%)`, |
|
|
|
|
|
|
|
parameters: [ |
|
|
|
|
|
|
|
{ label: "进水温度", value: "37.0", unit: "℃" }, |
|
|
|
|
|
|
|
{ label: "出水温度", value: "32.3", unit: "℃" }, |
|
|
|
|
|
|
|
{ label: "风机频率", value: "43", unit: "Hz" }, |
|
|
|
|
|
|
|
{ label: "风机功率", value: "11.8", unit: "kW" }, |
|
|
|
|
|
|
|
], |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
code: "CT-003", |
|
|
|
|
|
|
|
name: "3号冷却塔", |
|
|
|
|
|
|
|
type: "coolingTower", |
|
|
|
|
|
|
|
model: "CT-800", |
|
|
|
|
|
|
|
spec: "冷却水量: 800m3/h, 风机功率: 22kW", |
|
|
|
|
|
|
|
installDate: "2020-06-15", |
|
|
|
|
|
|
|
status: "standby", |
|
|
|
|
|
|
|
iconBg: `linear-gradient(135deg, #${towerIcons[0]} 0%, #${towerIcons[1]} 100%)`, |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
code: "EM-001", |
|
|
|
|
|
|
|
name: "总电表", |
|
|
|
|
|
|
|
type: "meter", |
|
|
|
|
|
|
|
model: "DTS666", |
|
|
|
|
|
|
|
spec: "三相四线, 3(6)A, 0.5S级", |
|
|
|
|
|
|
|
installDate: "2020-06-15", |
|
|
|
|
|
|
|
status: "running", |
|
|
|
|
|
|
|
iconBg: `linear-gradient(135deg, #${meterIcons[0]} 0%, #${meterIcons[1]} 100%)`, |
|
|
|
|
|
|
|
parameters: [ |
|
|
|
|
|
|
|
{ label: "总有功电能", value: "1256800", unit: "kWh" }, |
|
|
|
|
|
|
|
{ label: "总功率", value: "1256", unit: "kW" }, |
|
|
|
|
|
|
|
{ label: "A相电流", value: "850", unit: "A" }, |
|
|
|
|
|
|
|
{ label: "B相电流", value: "820", unit: "A" }, |
|
|
|
|
|
|
|
{ label: "C相电流", value: "830", unit: "A" }, |
|
|
|
|
|
|
|
], |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
code: "EM-002", |
|
|
|
|
|
|
|
name: "1号主机电表", |
|
|
|
|
|
|
|
type: "meter", |
|
|
|
|
|
|
|
model: "DTS666", |
|
|
|
|
|
|
|
spec: "三相四线, 3(6)A, 0.5S级", |
|
|
|
|
|
|
|
installDate: "2020-06-15", |
|
|
|
|
|
|
|
status: "running", |
|
|
|
|
|
|
|
iconBg: `linear-gradient(135deg, #${meterIcons[0]} 0%, #${meterIcons[1]} 100%)`, |
|
|
|
|
|
|
|
parameters: [ |
|
|
|
|
|
|
|
{ label: "有功电能", value: "285600", unit: "kWh" }, |
|
|
|
|
|
|
|
{ label: "功率", value: "520", unit: "kW" }, |
|
|
|
|
|
|
|
{ label: "A相电流", value: "285", unit: "A" }, |
|
|
|
|
|
|
|
{ label: "B相电流", value: "280", unit: "A" }, |
|
|
|
|
|
|
|
{ label: "C相电流", value: "285", unit: "A" }, |
|
|
|
|
|
|
|
], |
|
|
|
|
|
|
|
}, |
|
|
|
]; |
|
|
|
]; |
|
|
|
|
|
|
|
|
|
|
|
for (let i = 1; i <= 18; i++) { |
|
|
|
for (let i = 1; i <= 18; i++) { |
|
|
|
this.deviceList.push({ |
|
|
|
this.deviceList.push({ |
|
|
|
code: `TS-${String(i).padStart(3, '0')}`, |
|
|
|
code: `TS-${String(i).padStart(3, "0")}`, |
|
|
|
name: `${i}号温度传感器`, |
|
|
|
name: `${i}号温度传感器`, |
|
|
|
type: "tempSensor", |
|
|
|
type: "tempSensor", |
|
|
|
model: "PT100", |
|
|
|
model: "PT100", |
|
|
|
@ -417,13 +716,20 @@ export default { |
|
|
|
installDate: "2020-06-15", |
|
|
|
installDate: "2020-06-15", |
|
|
|
status: i <= 15 ? "running" : "offline", |
|
|
|
status: i <= 15 ? "running" : "offline", |
|
|
|
iconBg: `linear-gradient(135deg, #${sensorIcons[0]} 0%, #${sensorIcons[1]} 100%)`, |
|
|
|
iconBg: `linear-gradient(135deg, #${sensorIcons[0]} 0%, #${sensorIcons[1]} 100%)`, |
|
|
|
parameters: [{ label: "当前温度", value: (12 + Math.random() * 8).toFixed(1), unit: "℃" }, { label: "信号强度", value: "-45", unit: "dBm" }] |
|
|
|
parameters: [ |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
label: "当前温度", |
|
|
|
|
|
|
|
value: (12 + Math.random() * 8).toFixed(1), |
|
|
|
|
|
|
|
unit: "℃", |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
{ label: "信号强度", value: "-45", unit: "dBm" }, |
|
|
|
|
|
|
|
], |
|
|
|
}); |
|
|
|
}); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
for (let i = 1; i <= 10; i++) { |
|
|
|
for (let i = 1; i <= 10; i++) { |
|
|
|
this.deviceList.push({ |
|
|
|
this.deviceList.push({ |
|
|
|
code: `PS-${String(i).padStart(3, '0')}`, |
|
|
|
code: `PS-${String(i).padStart(3, "0")}`, |
|
|
|
name: `${i}号压力传感器`, |
|
|
|
name: `${i}号压力传感器`, |
|
|
|
type: "pressureSensor", |
|
|
|
type: "pressureSensor", |
|
|
|
model: "HB2000", |
|
|
|
model: "HB2000", |
|
|
|
@ -432,7 +738,14 @@ export default { |
|
|
|
status: i <= 8 ? "running" : i === 9 ? "fault" : "offline", |
|
|
|
status: i <= 8 ? "running" : i === 9 ? "fault" : "offline", |
|
|
|
faultInfo: i === 9 ? "传感器漂移" : undefined, |
|
|
|
faultInfo: i === 9 ? "传感器漂移" : undefined, |
|
|
|
iconBg: `linear-gradient(135deg, #30cfd0 0%, #330867 100%)`, |
|
|
|
iconBg: `linear-gradient(135deg, #30cfd0 0%, #330867 100%)`, |
|
|
|
parameters: [{ label: "当前压力", value: (0.5 + Math.random() * 0.3).toFixed(2), unit: "MPa" }, { label: "信号强度", value: "-52", unit: "dBm" }] |
|
|
|
parameters: [ |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
label: "当前压力", |
|
|
|
|
|
|
|
value: (0.5 + Math.random() * 0.3).toFixed(2), |
|
|
|
|
|
|
|
unit: "MPa", |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
{ label: "信号强度", value: "-52", unit: "dBm" }, |
|
|
|
|
|
|
|
], |
|
|
|
}); |
|
|
|
}); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
@ -446,7 +759,18 @@ export default { |
|
|
|
installDate: "2020-06-15", |
|
|
|
installDate: "2020-06-15", |
|
|
|
status: "running", |
|
|
|
status: "running", |
|
|
|
iconBg: `linear-gradient(135deg, #${meterIcons[0]} 0%, #${meterIcons[1]} 100%)`, |
|
|
|
iconBg: `linear-gradient(135deg, #${meterIcons[0]} 0%, #${meterIcons[1]} 100%)`, |
|
|
|
parameters: [{ label: "有功电能", value: Math.floor(250000 + Math.random() * 50000), unit: "kWh" }, { label: "功率", value: Math.floor(480 + Math.random() * 80), unit: "kW" }] |
|
|
|
parameters: [ |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
label: "有功电能", |
|
|
|
|
|
|
|
value: Math.floor(250000 + Math.random() * 50000), |
|
|
|
|
|
|
|
unit: "kWh", |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
label: "功率", |
|
|
|
|
|
|
|
value: Math.floor(480 + Math.random() * 80), |
|
|
|
|
|
|
|
unit: "kW", |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
], |
|
|
|
}); |
|
|
|
}); |
|
|
|
} |
|
|
|
} |
|
|
|
}, |
|
|
|
}, |
|
|
|
@ -455,7 +779,7 @@ export default { |
|
|
|
running: "运行中", |
|
|
|
running: "运行中", |
|
|
|
offline: "离线", |
|
|
|
offline: "离线", |
|
|
|
fault: "故障", |
|
|
|
fault: "故障", |
|
|
|
standby: "待机" |
|
|
|
standby: "待机", |
|
|
|
}; |
|
|
|
}; |
|
|
|
return statusMap[status] || status; |
|
|
|
return statusMap[status] || status; |
|
|
|
}, |
|
|
|
}, |
|
|
|
@ -467,7 +791,7 @@ export default { |
|
|
|
coolingTower: "冷却塔", |
|
|
|
coolingTower: "冷却塔", |
|
|
|
tempSensor: "温度", |
|
|
|
tempSensor: "温度", |
|
|
|
pressureSensor: "压力", |
|
|
|
pressureSensor: "压力", |
|
|
|
meter: "电表" |
|
|
|
meter: "电表", |
|
|
|
}; |
|
|
|
}; |
|
|
|
return iconMap[type] || "设备"; |
|
|
|
return iconMap[type] || "设备"; |
|
|
|
}, |
|
|
|
}, |
|
|
|
@ -479,7 +803,7 @@ export default { |
|
|
|
coolingPump: "冷却泵", |
|
|
|
coolingPump: "冷却泵", |
|
|
|
coolingTower: "冷却塔", |
|
|
|
coolingTower: "冷却塔", |
|
|
|
sensor: "传感器", |
|
|
|
sensor: "传感器", |
|
|
|
meter: "电表" |
|
|
|
meter: "电表", |
|
|
|
}; |
|
|
|
}; |
|
|
|
return iconMap[value] || "设备"; |
|
|
|
return iconMap[value] || "设备"; |
|
|
|
}, |
|
|
|
}, |
|
|
|
@ -512,8 +836,8 @@ export default { |
|
|
|
closeDetailDialog() { |
|
|
|
closeDetailDialog() { |
|
|
|
this.detailDialogVisible = false; |
|
|
|
this.detailDialogVisible = false; |
|
|
|
this.selectedDevice = null; |
|
|
|
this.selectedDevice = null; |
|
|
|
} |
|
|
|
}, |
|
|
|
} |
|
|
|
}, |
|
|
|
}; |
|
|
|
}; |
|
|
|
</script> |
|
|
|
</script> |
|
|
|
|
|
|
|
|
|
|
|
@ -597,7 +921,7 @@ export default { |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
&.el-button--success { |
|
|
|
&.el-button--success { |
|
|
|
background: linear-gradient(135deg, #91CC75 0%, #66BB6A 100%); |
|
|
|
background: linear-gradient(135deg, #91cc75 0%, #66bb6a 100%); |
|
|
|
border: none; |
|
|
|
border: none; |
|
|
|
|
|
|
|
|
|
|
|
.btn-icon { |
|
|
|
.btn-icon { |
|
|
|
@ -608,7 +932,7 @@ export default { |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
&:hover { |
|
|
|
&:hover { |
|
|
|
background: linear-gradient(135deg, #7CB342 0%, #558B2F 100%); |
|
|
|
background: linear-gradient(135deg, #7cb342 0%, #558b2f 100%); |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
@ -629,27 +953,47 @@ export default { |
|
|
|
border-radius: 0.08rem; |
|
|
|
border-radius: 0.08rem; |
|
|
|
|
|
|
|
|
|
|
|
&.total { |
|
|
|
&.total { |
|
|
|
background: linear-gradient(135deg, rgba(84, 112, 198, 0.2) 0%, rgba(115, 192, 222, 0.2) 100%); |
|
|
|
background: linear-gradient( |
|
|
|
|
|
|
|
135deg, |
|
|
|
|
|
|
|
rgba(84, 112, 198, 0.2) 0%, |
|
|
|
|
|
|
|
rgba(115, 192, 222, 0.2) 100% |
|
|
|
|
|
|
|
); |
|
|
|
border: 1px solid rgba(84, 112, 198, 0.3); |
|
|
|
border: 1px solid rgba(84, 112, 198, 0.3); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
&.running { |
|
|
|
&.running { |
|
|
|
background: linear-gradient(135deg, rgba(145, 204, 117, 0.2) 0%, rgba(102, 187, 106, 0.2) 100%); |
|
|
|
background: linear-gradient( |
|
|
|
|
|
|
|
135deg, |
|
|
|
|
|
|
|
rgba(145, 204, 117, 0.2) 0%, |
|
|
|
|
|
|
|
rgba(102, 187, 106, 0.2) 100% |
|
|
|
|
|
|
|
); |
|
|
|
border: 1px solid rgba(145, 204, 117, 0.3); |
|
|
|
border: 1px solid rgba(145, 204, 117, 0.3); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
&.offline { |
|
|
|
&.offline { |
|
|
|
background: linear-gradient(135deg, rgba(238, 102, 102, 0.2) 0%, rgba(229, 57, 53, 0.2) 100%); |
|
|
|
background: linear-gradient( |
|
|
|
|
|
|
|
135deg, |
|
|
|
|
|
|
|
rgba(238, 102, 102, 0.2) 0%, |
|
|
|
|
|
|
|
rgba(229, 57, 53, 0.2) 100% |
|
|
|
|
|
|
|
); |
|
|
|
border: 1px solid rgba(238, 102, 102, 0.3); |
|
|
|
border: 1px solid rgba(238, 102, 102, 0.3); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
&.fault { |
|
|
|
&.fault { |
|
|
|
background: linear-gradient(135deg, rgba(250, 200, 88, 0.2) 0%, rgba(255, 179, 0, 0.2) 100%); |
|
|
|
background: linear-gradient( |
|
|
|
|
|
|
|
135deg, |
|
|
|
|
|
|
|
rgba(250, 200, 88, 0.2) 0%, |
|
|
|
|
|
|
|
rgba(255, 179, 0, 0.2) 100% |
|
|
|
|
|
|
|
); |
|
|
|
border: 1px solid rgba(250, 200, 88, 0.3); |
|
|
|
border: 1px solid rgba(250, 200, 88, 0.3); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
&.standby { |
|
|
|
&.standby { |
|
|
|
background: linear-gradient(135deg, rgba(250, 112, 154, 0.2) 0%, rgba(254, 225, 64, 0.2) 100%); |
|
|
|
background: linear-gradient( |
|
|
|
|
|
|
|
135deg, |
|
|
|
|
|
|
|
rgba(250, 112, 154, 0.2) 0%, |
|
|
|
|
|
|
|
rgba(254, 225, 64, 0.2) 100% |
|
|
|
|
|
|
|
); |
|
|
|
border: 1px solid rgba(250, 112, 154, 0.3); |
|
|
|
border: 1px solid rgba(250, 112, 154, 0.3); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
@ -782,19 +1126,19 @@ export default { |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
&.running { |
|
|
|
&.running { |
|
|
|
border-left: 3px solid #91CC75; |
|
|
|
border-left: 3px solid #91cc75; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
&.offline { |
|
|
|
&.offline { |
|
|
|
border-left: 3px solid #EE6666; |
|
|
|
border-left: 3px solid #ee6666; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
&.fault { |
|
|
|
&.fault { |
|
|
|
border-left: 3px solid #FAC858; |
|
|
|
border-left: 3px solid #fac858; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
&.standby { |
|
|
|
&.standby { |
|
|
|
border-left: 3px solid #5470C6; |
|
|
|
border-left: 3px solid #5470c6; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.card-header { |
|
|
|
.card-header { |
|
|
|
@ -803,8 +1147,8 @@ export default { |
|
|
|
margin-bottom: 0.15rem; |
|
|
|
margin-bottom: 0.15rem; |
|
|
|
|
|
|
|
|
|
|
|
.device-icon { |
|
|
|
.device-icon { |
|
|
|
width: 0.5rem; |
|
|
|
width: 0.8rem; |
|
|
|
height: 0.5rem; |
|
|
|
height: 0.8rem; |
|
|
|
border-radius: 50%; |
|
|
|
border-radius: 50%; |
|
|
|
display: flex; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
align-items: center; |
|
|
|
@ -812,6 +1156,11 @@ export default { |
|
|
|
margin-right: 0.12rem; |
|
|
|
margin-right: 0.12rem; |
|
|
|
font-size: 0.24rem; |
|
|
|
font-size: 0.24rem; |
|
|
|
color: #ffffff; |
|
|
|
color: #ffffff; |
|
|
|
|
|
|
|
background: linear-gradient( |
|
|
|
|
|
|
|
135deg, |
|
|
|
|
|
|
|
rgb(67, 233, 123) 0%, |
|
|
|
|
|
|
|
rgb(56, 249, 215) 100% |
|
|
|
|
|
|
|
); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.device-header-info { |
|
|
|
.device-header-info { |
|
|
|
@ -838,25 +1187,25 @@ export default { |
|
|
|
|
|
|
|
|
|
|
|
&.running { |
|
|
|
&.running { |
|
|
|
background: rgba(145, 204, 117, 0.2); |
|
|
|
background: rgba(145, 204, 117, 0.2); |
|
|
|
color: #91CC75; |
|
|
|
color: #91cc75; |
|
|
|
border: 1px solid rgba(145, 204, 117, 0.3); |
|
|
|
border: 1px solid rgba(145, 204, 117, 0.3); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
&.offline { |
|
|
|
&.offline { |
|
|
|
background: rgba(238, 102, 102, 0.2); |
|
|
|
background: rgba(238, 102, 102, 0.2); |
|
|
|
color: #EE6666; |
|
|
|
color: #ee6666; |
|
|
|
border: 1px solid rgba(238, 102, 102, 0.3); |
|
|
|
border: 1px solid rgba(238, 102, 102, 0.3); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
&.fault { |
|
|
|
&.fault { |
|
|
|
background: rgba(250, 200, 88, 0.2); |
|
|
|
background: rgba(250, 200, 88, 0.2); |
|
|
|
color: #FAC858; |
|
|
|
color: #fac858; |
|
|
|
border: 1px solid rgba(250, 200, 88, 0.3); |
|
|
|
border: 1px solid rgba(250, 200, 88, 0.3); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
&.standby { |
|
|
|
&.standby { |
|
|
|
background: rgba(84, 112, 198, 0.2); |
|
|
|
background: rgba(84, 112, 198, 0.2); |
|
|
|
color: #5470C6; |
|
|
|
color: #5470c6; |
|
|
|
border: 1px solid rgba(84, 112, 198, 0.3); |
|
|
|
border: 1px solid rgba(84, 112, 198, 0.3); |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
@ -1017,22 +1366,22 @@ export default { |
|
|
|
|
|
|
|
|
|
|
|
&.running { |
|
|
|
&.running { |
|
|
|
background: rgba(145, 204, 117, 0.2); |
|
|
|
background: rgba(145, 204, 117, 0.2); |
|
|
|
color: #91CC75; |
|
|
|
color: #91cc75; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
&.offline { |
|
|
|
&.offline { |
|
|
|
background: rgba(238, 102, 102, 0.2); |
|
|
|
background: rgba(238, 102, 102, 0.2); |
|
|
|
color: #EE6666; |
|
|
|
color: #ee6666; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
&.fault { |
|
|
|
&.fault { |
|
|
|
background: rgba(250, 200, 88, 0.2); |
|
|
|
background: rgba(250, 200, 88, 0.2); |
|
|
|
color: #FAC858; |
|
|
|
color: #fac858; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
&.standby { |
|
|
|
&.standby { |
|
|
|
background: rgba(84, 112, 198, 0.2); |
|
|
|
background: rgba(84, 112, 198, 0.2); |
|
|
|
color: #5470C6; |
|
|
|
color: #5470c6; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
@ -1092,15 +1441,15 @@ export default { |
|
|
|
color: #ffffff; |
|
|
|
color: #ffffff; |
|
|
|
|
|
|
|
|
|
|
|
&.running { |
|
|
|
&.running { |
|
|
|
color: #91CC75; |
|
|
|
color: #91cc75; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
&.offline { |
|
|
|
&.offline { |
|
|
|
color: #EE6666; |
|
|
|
color: #ee6666; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
&.fault { |
|
|
|
&.fault { |
|
|
|
color: #FAC858; |
|
|
|
color: #fac858; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
