修改温湿度列表样式

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-form-item name="address">
<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-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,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-col>
<a-col :xl="6" :lg="7" :md="8" :sm="24">
@ -38,7 +38,7 @@
</a-row>
</template>
<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;">
<span style="text-align: right;background:#f6f6f6;padding: 2px 10px;border-radius:5px;">NUID: {{item.nuId?item.nuId:'未配置'}}</span>
</a-col>

View File

@ -7,13 +7,13 @@
<a-col :lg="6">
<a-form-item name="address">
<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-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,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-col>
<a-col :xl="6" :lg="7" :md="8" :sm="24">
@ -38,7 +38,7 @@
</a-row>
</template>
<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;">
<span style="text-align: right;background:#f6f6f6;padding: 2px 10px;border-radius:5px;">NUID: {{item.nuId?item.nuId:'未配置'}}</span>
</a-col>
@ -57,11 +57,11 @@
<span class="antTitle">抄表</span>
</span>
<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>
<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>
<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 JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
import { set } from 'lodash-es';
import JInput from "/@/components/Form/src/jeecg/components/JInput.vue";
const formRef = ref();
const queryParam = reactive<any>({});

View File

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

View File

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

View File

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

View File

@ -6,8 +6,14 @@
<a-row :gutter="24">
<a-col :lg="6">
<a-form-item name="sn">
<template #label><span title="同步类型">表号</span></template>
<a-input placeholder="请输入同步类型" v-model:value="queryParam.sn" allow-clear ></a-input>
<template #label><span title="SN">SN</span></template>
<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-col>
<a-col :xl="6" :lg="7" :md="8" :sm="24">
@ -19,47 +25,63 @@
</div>
<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-card style="width: 100%;border-radius: 8px;">
<template #title >
<div class="cardTitle">
<a-row>
<a-col :span="12">
<span style="margin-left:15px;font-size:14px;">表号{{item.sn}}</span>
<a-card style="width: 100%;border-radius: 8px;" :headStyle="{ height: '60px', padding: '0 24px' }" :bodyStyle="{ padding: '24px 24px 4px 24px' }">
<template #title>
<a-row style="font-weight: normal;">
<a-col :span="18" style="font-size: 14px;">
<div>SN<span style="font-weight: bold;">{{item.sn}}</span></div>
<div style="font-size: 12px;">抄表时间{{item.reportingTime?item.reportingTime:'未抄表'}}</div>
</a-col>
<a-col :span="12" style="text-align: right;">
<span style="margin-right:15px;font-size:14px;">{{item.status=='0'?'在线':'离线'}}</span>
<a-col :span="6" style="text-align: center;padding-top: 4px;">
<div :class="item.relayState=='1'?'zxClass':'lxClass'">{{item.status=='1'?'在线':'离线'}}</div>
</a-col>
</a-row>
</div>
</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-col :span="12">
<span><Statistic title="温度" :value="item.temperature?item.temperature:'无'" style="text-align:center;" /></span>
<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;">
<span style="text-align: right;background:#f6f6f6;padding: 2px 10px;border-radius:5px;">NUID: {{item.nuId?item.nuId:'未配置'}}</span>
</a-col>
<a-col :span="12">
<span><Statistic title="湿度" :value="item.humidity?item.humidity:'无'" style="text-align:center;" /></span>
<a-col :span="24" style="padding: 12px 0 0 5px;margin-top:18px;">
<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-row>
</p>
<a-divider />
<p style="text-align:center;">
<span>
<a @click="handleRead(item)">抄表</a>
<a-divider type="vertical" />
<a @click="handleEdit(item)">配置</a>
<a-divider type="vertical" />
<a @click="showApiLog(item)">日志</a>
</span>
<span style="display:inline-block;" @click="handleRead(item)">
<span class="tbClass"><img src="../../../assets/iot/a7.png" style="width:20px;" /></span><br/>
<span class="antTitle">抄表</span>
</span>
<span style="display:inline-block;margin-left:10%;" @click="handleEdit(item)">
<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>
</p>
</a-card>
</a-col>
<a-col v-if="tableData.total==0" >
<div style="margin: 30px auto;">
<a-empty />
</div>
</a-col>
</a-row>
<div
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 DeviceInfoDrawer from "./components/DeviceInfoDrawer.vue";
import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
import { set } from 'lodash-es';
import {useDrawer} from "@/components/Drawer";
import JInput from "/@/components/Form/src/jeecg/components/JInput.vue";
//drawer
const [registerDrawer, { openDrawer }] = useDrawer();
@ -173,4 +197,31 @@ const pageParams = ref({ pageNo: 1, pageSize: 8 })
display: block;
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>