| | |
| | | <template> |
| | | <div class="app-container"> |
| | | <!-- 页面功能说明,仅作为描述,不作为具体字段 --> |
| | | <el-form :model="filters" :inline="true"> |
| | | <el-form-item label="设备名称"> |
| | | <!-- 监控设备基础信息筛选 --> |
| | | <el-form-item label="监控设备名称"> |
| | | <el-input |
| | | v-model="filters.deviceName" |
| | | style="width: 240px" |
| | | placeholder="请输入设备名称" |
| | | placeholder="请输入监控设备名称" |
| | | clearable |
| | | :prefix-icon="Search" |
| | | @change="getTableData" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="规格型号"> |
| | | <!-- 温度监测字段(英文字段 deviceModel 不变) --> |
| | | <el-form-item label="温度监测参数"> |
| | | <el-input |
| | | v-model="filters.deviceModel" |
| | | style="width: 240px" |
| | | placeholder="请输入规格型号" |
| | | placeholder="请输入温度相关监测参数" |
| | | clearable |
| | | :prefix-icon="Search" |
| | | @change="getTableData" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="供应商"> |
| | | <!-- 压力监测字段(英文字段 supplierName 不变) --> |
| | | <el-form-item label="压力监测参数"> |
| | | <el-input |
| | | v-model="filters.supplierName" |
| | | style="width: 240px" |
| | | placeholder="请输入供应商" |
| | | placeholder="请输入压力相关监测参数" |
| | | clearable |
| | | :prefix-icon="Search" |
| | | @change="getTableData" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="单位"> |
| | | <!-- 能耗监测字段(英文字段 unit 不变) --> |
| | | <el-form-item label="能耗监测参数"> |
| | | <el-input |
| | | v-model="filters.unit" |
| | | style="width: 240px" |
| | | placeholder="请输入单位" |
| | | placeholder="请输入能耗相关监测参数" |
| | | clearable |
| | | :prefix-icon="Search" |
| | | @change="getTableData" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="录入日期:"> |
| | | <el-form-item label="监控日期:"> |
| | | <el-date-picker v-model="filters.entryDate" value-format="YYYY-MM-DD" format="YYYY-MM-DD" type="daterange" |
| | | placeholder="请选择" clearable @change="changeDaterange" /> |
| | | </el-form-item> |
| | |
| | | <div></div> |
| | | <div> |
| | | <el-button type="primary" @click="add" icon="Plus"> 新增 </el-button> |
| | | <el-button @click="handleOut" icon="download">导出</el-button> |
| | | <!-- <el-button @click="handleOut" icon="download">导出</el-button> --> |
| | | <el-button |
| | | type="danger" |
| | | icon="Delete" |
| | |
| | | import {Search} from "@element-plus/icons-vue"; |
| | | |
| | | defineOptions({ |
| | | name: "设备台账", |
| | | // 页面功能:设备远程监控 |
| | | name: "设备远程监控", |
| | | }); |
| | | |
| | | // 表格多选框选中项 |
| | |
| | | }, |
| | | [ |
| | | { |
| | | label: "设备名称", |
| | | label: "监控设备名称", |
| | | align: "center", |
| | | prop: "deviceName", |
| | | }, |
| | | { |
| | | label: "规格型号", |
| | | // 使用 deviceModel 字段承载温度监测相关参数 |
| | | label: "温度监测参数", |
| | | align: "center", |
| | | prop: "deviceModel", |
| | | }, |
| | | { |
| | | label: "供应商", |
| | | // 使用 supplierName 字段承载压力监测相关参数 |
| | | label: "压力监测参数", |
| | | align: "center", |
| | | prop: "supplierName", |
| | | }, |
| | | { |
| | | label: "单位", |
| | | // 使用 unit 字段承载能耗监测相关参数 |
| | | label: "能耗监测参数", |
| | | align: "center", |
| | | prop: "unit", |
| | | }, |
| | |
| | | prop: "number", |
| | | }, |
| | | { |
| | | label: "含税单价", |
| | | // 使用 taxIncludingPriceUnit 字段承载监控阈值上限 |
| | | label: "监控阈值上限", |
| | | align: "center", |
| | | prop: "taxIncludingPriceUnit", |
| | | }, |
| | | { |
| | | label: "含税总价", |
| | | // 使用 taxIncludingPriceTotal 字段承载监控阈值下限 |
| | | label: "监控阈值下限", |
| | | align: "center", |
| | | prop: "taxIncludingPriceTotal", |
| | | }, |
| | | { |
| | | label: "税率", |
| | | // 使用 taxRate 字段呈现实时监测值/当前读数 |
| | | label: "实时监测值", |
| | | align: "center", |
| | | prop: "taxRate", |
| | | }, |
| | | { |
| | | label: "不含税总价", |
| | | // 使用 unTaxIncludingPriceTotal 字段承载累计能耗/监控统计值 |
| | | label: "累计能耗", |
| | | align: "center", |
| | | prop: "unTaxIncludingPriceTotal", |
| | | }, |
| | | { |
| | | label: "录入人", |
| | | label: "监控人", |
| | | align: "center", |
| | | prop: "createUser", |
| | | }, |
| | | { |
| | | label: "录入日期", |
| | | label: "监控日期", |
| | | align: "center", |
| | | prop: "createTime", |
| | | }, |
| | |
| | | edit(row.id) |
| | | }, |
| | | }, |
| | | { |
| | | name: "生成二维码", |
| | | type: "text", |
| | | clickFun: (row) => { |
| | | showQRCode(row) |
| | | }, |
| | | }, |
| | | // { |
| | | // name: "生成二维码", |
| | | // type: "text", |
| | | // clickFun: (row) => { |
| | | // showQRCode(row) |
| | | // }, |
| | | // }, |
| | | ], |
| | | }, |
| | | ] |
| | |
| | | type: "warning", |
| | | }) |
| | | .then(() => { |
| | | proxy.download(`/device/ledger/export`, {}, "设备台账档案.xlsx"); |
| | | // 导出文件名改为设备远程监控 |
| | | proxy.download(`/device/ledger/export`, {}, "设备远程监控.xlsx"); |
| | | }) |
| | | .catch(() => { |
| | | proxy.$modal.msg("已取消"); |
| | |
| | | }; |
| | | |
| | | onMounted(() => { |
| | | filters.entryDate = [ |
| | | dayjs().format("YYYY-MM-DD"), |
| | | dayjs().add(1, "day").format("YYYY-MM-DD"), |
| | | ] |
| | | filters.entryDateStart = dayjs().format("YYYY-MM-DD") |
| | | filters.entryDateEnd = dayjs().add(1, "day").format("YYYY-MM-DD") |
| | | // filters.entryDate = [ |
| | | // dayjs().format("YYYY-MM-DD"), |
| | | // dayjs().add(1, "day").format("YYYY-MM-DD"), |
| | | // ] |
| | | // filters.entryDateStart = dayjs().format("YYYY-MM-DD") |
| | | // filters.entryDateEnd = dayjs().add(1, "day").format("YYYY-MM-DD") |
| | | getTableData(); |
| | | }); |
| | | </script> |
| | |
| | | justify-content: space-between; |
| | | margin-bottom: 10px; |
| | | } |
| | | |
| | | .feature-desc { |
| | | margin-bottom: 16px; |
| | | padding: 10px 12px; |
| | | background: #f5f7fa; |
| | | border-radius: 4px; |
| | | color: #606266; |
| | | font-size: 13px; |
| | | } |
| | | </style> |