修改温湿度列表样式

This commit is contained in:
yangjun 2025-06-30 14:54:10 +08:00
parent 686fe4edca
commit 972a1b13a1
8 changed files with 117 additions and 63 deletions

BIN
src/assets/iot/a10.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.0 KiB

BIN
src/assets/iot/a11.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

View File

@ -7,13 +7,13 @@
<a-col :lg="6"> <a-col :lg="6">
<a-form-item name="address"> <a-form-item name="address">
<template #label><span title="SN">SN</span></template> <template #label><span title="SN">SN</span></template>
<a-input placeholder="请输入SN" v-model:value="queryParam.address" allow-clear ></a-input> <j-input placeholder="请输入SN" v-model:value="queryParam.address" allow-clear ></j-input>
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :lg="6"> <a-col :lg="6">
<a-form-item name="nuId"> <a-form-item name="nuId">
<template #label><span title="护理单元">护理单元</span></template> <template #label><span title="护理单元">护理单元</span></template>
<j-dict-select-tag type='list' v-model:value="queryParam.nuId" :dictCode="`nu_base_info,nu_name,id`" placeholder="请选护理单元" allow-clear /> <j-dict-select-tag type='list' v-model:value="queryParam.nuId" :dictCode="`nu_base_info,nu_name,nu_id`" placeholder="请选护理单元" allow-clear />
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :xl="6" :lg="7" :md="8" :sm="24"> <a-col :xl="6" :lg="7" :md="8" :sm="24">
@ -38,7 +38,7 @@
</a-row> </a-row>
</template> </template>
<a-row> <a-row>
<a-col :span="12" style="margin-top: -10px;">{{item.nuName?item.nuName:'未配置'}}</a-col> <a-col :span="12" style="margin-top: -10px;">{{item.nuId_dictText?item.nuId_dictText:'未配置'}}</a-col>
<a-col :span="12" style="text-align: right;margin-top: -10px;"> <a-col :span="12" style="text-align: right;margin-top: -10px;">
<span style="text-align: right;background:#f6f6f6;padding: 2px 10px;border-radius:5px;">NUID: {{item.nuId?item.nuId:'未配置'}}</span> <span style="text-align: right;background:#f6f6f6;padding: 2px 10px;border-radius:5px;">NUID: {{item.nuId?item.nuId:'未配置'}}</span>
</a-col> </a-col>

View File

@ -7,13 +7,13 @@
<a-col :lg="6"> <a-col :lg="6">
<a-form-item name="address"> <a-form-item name="address">
<template #label><span title="SN">SN</span></template> <template #label><span title="SN">SN</span></template>
<a-input placeholder="请输入SN" v-model:value="queryParam.address" allow-clear ></a-input> <j-input placeholder="请输入SN" v-model:value="queryParam.address" allow-clear ></j-input>
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :lg="6"> <a-col :lg="6">
<a-form-item name="nuId"> <a-form-item name="nuId">
<template #label><span title="护理单元">护理单元</span></template> <template #label><span title="护理单元">护理单元</span></template>
<j-dict-select-tag type='list' v-model:value="queryParam.nuId" :dictCode="`nu_base_info,nu_name,id`" placeholder="请选护理单元" allow-clear /> <j-dict-select-tag type='list' v-model:value="queryParam.nuId" :dictCode="`nu_base_info,nu_name,nu_id`" placeholder="请选护理单元" allow-clear />
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :xl="6" :lg="7" :md="8" :sm="24"> <a-col :xl="6" :lg="7" :md="8" :sm="24">
@ -38,7 +38,7 @@
</a-row> </a-row>
</template> </template>
<a-row> <a-row>
<a-col :span="12" style="margin-top: -10px;">{{item.nuName?item.nuName:'未配置'}}</a-col> <a-col :span="12" style="margin-top: -10px;">{{item.nuId_dictText?item.nuId_dictText:'未配置'}}</a-col>
<a-col :span="12" style="text-align: right;margin-top: -10px;"> <a-col :span="12" style="text-align: right;margin-top: -10px;">
<span style="text-align: right;background:#f6f6f6;padding: 2px 10px;border-radius:5px;">NUID: {{item.nuId?item.nuId:'未配置'}}</span> <span style="text-align: right;background:#f6f6f6;padding: 2px 10px;border-radius:5px;">NUID: {{item.nuId?item.nuId:'未配置'}}</span>
</a-col> </a-col>
@ -57,11 +57,11 @@
<span class="antTitle">抄表</span> <span class="antTitle">抄表</span>
</span> </span>
<span style="display:inline-block;margin-left:10%;" @click="handleControlLz(item)"> <span style="display:inline-block;margin-left:10%;" @click="handleControlLz(item)">
<span class="tbClass"><img src="../../../../assets/iot/a5.png" style="width:20px;" /></span><br/> <span class="tbClass"><img src="../../../../assets/iot/a10.png" style="width:20px;" /></span><br/>
<span class="antTitle">开阀</span> <span class="antTitle">开阀</span>
</span> </span>
<span style="display:inline-block;margin-left:10%;" @click="handleControlHz(item)"> <span style="display:inline-block;margin-left:10%;" @click="handleControlHz(item)">
<span class="tbClass"><img src="../../../../assets/iot/a2.png" style="width:20px;" /></span><br/> <span class="tbClass"><img src="../../../../assets/iot/a11.png" style="width:20px;" /></span><br/>
<span class="antTitle">关阀</span> <span class="antTitle">关阀</span>
</span> </span>
<span style="display:inline-block;margin-left:10%;" @click="handleReset(item)"> <span style="display:inline-block;margin-left:10%;" @click="handleReset(item)">
@ -103,6 +103,7 @@ import { Pagination } from 'ant-design-vue';
import ApiLogModal from "@/views/iot/tq/electricity/apilog/WaterApiLogModal.vue"; import ApiLogModal from "@/views/iot/tq/electricity/apilog/WaterApiLogModal.vue";
import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue'; import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
import { set } from 'lodash-es'; import { set } from 'lodash-es';
import JInput from "/@/components/Form/src/jeecg/components/JInput.vue";
const formRef = ref(); const formRef = ref();
const queryParam = reactive<any>({}); const queryParam = reactive<any>({});

View File

@ -1,6 +1,6 @@
<template> <template>
<!--引用表格--> <!--引用表格-->
<BasicTable @register="registerTable"> <BasicTable @register="registerTable" style="margin-top: -8px;">
<!--插槽:table标题--> <!--插槽:table标题-->
<template #tableTitle> <template #tableTitle>
</template> </template>
@ -30,6 +30,7 @@
columns:alarmColumns, columns:alarmColumns,
canResize:false, canResize:false,
showActionColumn: false, showActionColumn: false,
useSearchForm: false,
// showTableSetting: false, // showTableSetting: false,
formConfig: { formConfig: {
//labelWidth: 120, //labelWidth: 120,

View File

@ -1,6 +1,6 @@
<template> <template>
<!--引用表格--> <!--引用表格-->
<BasicTable @register="registerTable"> <BasicTable @register="registerTable" style="margin-top: -8px;">
<!--插槽:table标题--> <!--插槽:table标题-->
<template #tableTitle> <template #tableTitle>
</template> </template>
@ -31,6 +31,7 @@
canResize:false, canResize:false,
showActionColumn: false, showActionColumn: false,
// showTableSetting: false, // showTableSetting: false,
useSearchForm: false,
formConfig: { formConfig: {
//labelWidth: 120, //labelWidth: 120,
schemas: logQuerySchema, schemas: logQuerySchema,

View File

@ -418,18 +418,18 @@ export const alarmColumns: BasicColumn[] = [
align: "center", align: "center",
dataIndex: 'sn' dataIndex: 'sn'
}, },
{ // {
title: '状态', // title: '状态',
align: "center", // align: "center",
dataIndex: 'status', // dataIndex: 'status',
customRender:({record})=>{ // customRender:({record})=>{
if(record.optType == '0'){ // if(record.optType == '0'){
return '告警'; // return '告警';
}else { // }else {
return '清除'; // return '清除';
} // }
}, // },
}, // },
{ {
title: '告警时间', title: '告警时间',
align: "center", align: "center",
@ -446,20 +446,20 @@ export const alarmColumns: BasicColumn[] = [
dataIndex: 'wrData' dataIndex: 'wrData'
}, },
{ {
title: '清除时间', title: '消除告警时间',
align: "center", align: "center",
dataIndex: 'clearDate' dataIndex: 'clearDate'
}, },
{ // {
title: '清除内容', // title: '清除内容',
align: "center", // align: "center",
dataIndex: 'clearContent' // dataIndex: 'clearContent'
}, // },
{ // {
title: '清除值', // title: '清除值',
align: "center", // align: "center",
dataIndex: 'clearData' // dataIndex: 'clearData'
}, // },
]; ];
export const alarmQuerySchema: FormSchema[] = [ export const alarmQuerySchema: FormSchema[] = [

View File

@ -6,8 +6,14 @@
<a-row :gutter="24"> <a-row :gutter="24">
<a-col :lg="6"> <a-col :lg="6">
<a-form-item name="sn"> <a-form-item name="sn">
<template #label><span title="同步类型">表号</span></template> <template #label><span title="SN">SN</span></template>
<a-input placeholder="请输入同步类型" v-model:value="queryParam.sn" allow-clear ></a-input> <j-input placeholder="请输入SN" v-model:value="queryParam.sn" allow-clear ></j-input>
</a-form-item>
</a-col>
<a-col :lg="6">
<a-form-item name="nuId">
<template #label><span title="护理单元">护理单元</span></template>
<j-dict-select-tag type='list' v-model:value="queryParam.nuId" :dictCode="`nu_base_info,nu_name,nu_id`" placeholder="请选护理单元" allow-clear />
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :xl="6" :lg="7" :md="8" :sm="24"> <a-col :xl="6" :lg="7" :md="8" :sm="24">
@ -19,47 +25,63 @@
</div> </div>
<a-row> <a-row>
<a-col v-for="(item,index) in tableData.records" :key="index" :xs="24" :sm="24" :md="12" :lg="12" :xl="8" :xxl="6" style="padding: 8px;"> <a-col v-for="(item,index) in tableData.records" :key="index" :xs="24" :sm="24" :md="12" :lg="12" :xl="8" :xxl="6" style="padding: 8px;">
<a-card style="width: 100%;border-radius: 8px;"> <a-card style="width: 100%;border-radius: 8px;" :headStyle="{ height: '60px', padding: '0 24px' }" :bodyStyle="{ padding: '24px 24px 4px 24px' }">
<template #title > <template #title>
<div class="cardTitle"> <a-row style="font-weight: normal;">
<a-row> <a-col :span="18" style="font-size: 14px;">
<a-col :span="12"> <div>SN<span style="font-weight: bold;">{{item.sn}}</span></div>
<span style="margin-left:15px;font-size:14px;">表号{{item.sn}}</span> <div style="font-size: 12px;">抄表时间{{item.reportingTime?item.reportingTime:'未抄表'}}</div>
</a-col> </a-col>
<a-col :span="12" style="text-align: right;"> <a-col :span="6" style="text-align: center;padding-top: 4px;">
<span style="margin-right:15px;font-size:14px;">{{item.status=='0'?'在线':'离线'}}</span> <div :class="item.relayState=='1'?'zxClass':'lxClass'">{{item.status=='1'?'在线':'离线'}}</div>
</a-col> </a-col>
</a-row> </a-row>
</div>
</template> </template>
<p>
<span>护理单元名称{{item.nuName?item.nuName:'未配置'}}</span>
</p>
<p>
<span>上次抄表时间{{item.readTime?item.readTime:'未抄表'}}</span>
</p>
<p style="margin-top: 20px;">
<a-row> <a-row>
<a-col :span="12"> <a-col :span="12" style="margin-top: -10px;">{{item.nuId_dictText?item.nuId_dictText:'未配置'}}</a-col>
<span><Statistic title="温度" :value="item.temperature?item.temperature:'无'" style="text-align:center;" /></span> <a-col :span="12" style="text-align: right;margin-top: -10px;">
<span style="text-align: right;background:#f6f6f6;padding: 2px 10px;border-radius:5px;">NUID: {{item.nuId?item.nuId:'未配置'}}</span>
</a-col> </a-col>
<a-col :span="12"> <a-col :span="24" style="padding: 12px 0 0 5px;margin-top:18px;">
<span><Statistic title="湿度" :value="item.humidity?item.humidity:'无'" style="text-align:center;" /></span> <a-row>
<a-col :span="11" style="text-align: center;">
<span><img src="../../../assets/iot/a8.png" style="width:25px;margin-top: -15px;" /></span>
<span style="font-size: 30px;font-weight:700;">{{item.temperature?item.temperature:'-'}}</span>
<span style="font-size: 16px;"></span>
</a-col>
<a-col :span="2" style="text-align: center;">
<a-divider type="vertical" style="height: 40px;"/>
</a-col>
<a-col :span="11" style="text-align: center;">
<span style="margin-top:0px;"><img src="../../../assets/iot/a9.png" style="width:25px;margin-top: -15px;" /></span>
<span style="font-size: 30px;font-weight:700;margin-left: 6px;">{{item.humidity?item.humidity:'-'}}</span>
<span style="font-size: 16px;">%</span>
</a-col>
</a-row>
</a-col> </a-col>
</a-row> </a-row>
</p>
<a-divider /> <a-divider />
<p style="text-align:center;"> <p style="text-align:center;">
<span> <span style="display:inline-block;" @click="handleRead(item)">
<a @click="handleRead(item)">抄表</a> <span class="tbClass"><img src="../../../assets/iot/a7.png" style="width:20px;" /></span><br/>
<a-divider type="vertical" /> <span class="antTitle">抄表</span>
<a @click="handleEdit(item)">配置</a> </span>
<a-divider type="vertical" /> <span style="display:inline-block;margin-left:10%;" @click="handleEdit(item)">
<a @click="showApiLog(item)">日志</a> <span class="tbClass"><img src="../../../assets/iot/a6.png" style="width:20px;" /></span><br/>
<span class="antTitle">配置</span>
</span>
<span style="display:inline-block;margin-left:10%;" @click="showApiLog(item)">
<span class="tbClass"><img src="../../../assets/iot/a4.png" style="width:20px;" /></span><br/>
<span class="antTitle">日志</span>
</span> </span>
</p> </p>
</a-card> </a-card>
</a-col> </a-col>
<a-col v-if="tableData.total==0" >
<div style="margin: 30px auto;">
<a-empty />
</div>
</a-col>
</a-row> </a-row>
<div <div
style="float:right;bottom: 20px;z-index: 999;padding: 8px 16px;border-radius: 4px;display: flex;align-items: center;"> style="float:right;bottom: 20px;z-index: 999;padding: 8px 16px;border-radius: 4px;display: flex;align-items: center;">
@ -83,8 +105,10 @@
import ApiLogAlarmModal from './components/ApiLogAlarmModal.vue' import ApiLogAlarmModal from './components/ApiLogAlarmModal.vue'
import DeviceInfoDrawer from "./components/DeviceInfoDrawer.vue"; import DeviceInfoDrawer from "./components/DeviceInfoDrawer.vue";
import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
import { set } from 'lodash-es'; import { set } from 'lodash-es';
import {useDrawer} from "@/components/Drawer"; import {useDrawer} from "@/components/Drawer";
import JInput from "/@/components/Form/src/jeecg/components/JInput.vue";
//drawer //drawer
const [registerDrawer, { openDrawer }] = useDrawer(); const [registerDrawer, { openDrawer }] = useDrawer();
@ -173,4 +197,31 @@ const pageParams = ref({ pageNo: 1, pageSize: 8 })
display: block; display: block;
position: absolute; position: absolute;
} }
.zxClass{
font-size:14px;
background: linear-gradient(to right, #1ea0fa, #017de9);
border-radius: 8px;
height: 35px;
color: white;
line-height: 35px;
}
.lxClass{
font-size:14px;
background: linear-gradient(to right, #cccccc, #cccccc);
border-radius: 8px;
height: 35px;
color: white;
line-height: 35px;
}
.tbClass{
background: #f6f6f6;
padding: 8px;
border-radius: 5px;
}
.antTitle{
margin-top: 10px;
display: block;
font-size: 12px;
}
</style> </style>