yangjun
/
hldy_yunwei_vue
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

调整智能水表、智能电表、温湿度计的日志页面样式，调整边距等

This commit is contained in:
1378012178@qq.com 2025-10-27 16:37:22 +08:00
parent baaad2ee26
commit 65778c04a0
11 changed files with 764 additions and 680 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/views/iot/tq/ApiRequestLog/ApiRequestLogList.vue
View File

@ -183,10 +183,11 @@ defineExpose({
<style lang="less" scoped> <style lang="less" scoped>
.jeecg-basic-table-form-container { .jeecg-basic-table-form-container {
padding: 0; padding: 0;
margin-bottom: 14px;
.table-page-search-submitButtons { .table-page-search-submitButtons {
display: block; display: block;
margin-bottom: 24px; margin-bottom: 14px;
white-space: nowrap; white-space: nowrap;
} }
@ -201,7 +202,7 @@ defineExpose({
} }
.ant-form-item:not(.ant-form-item-with-help) { .ant-form-item:not(.ant-form-item-with-help) {
margin-bottom: 16px; margin-bottom: 14px;
height: 32px; height: 32px;
} }

148
src/views/iot/tq/ApiRequestLog/ApiRequestLogList2.vue
View File

@ -2,7 +2,8 @@
<div> <div>
<!--查询区域--> <!--查询区域-->
<div class="jeecg-basic-table-form-container"> <div class="jeecg-basic-table-form-container">
<a-form ref="formRef" @keyup.enter.native="searchQuery" :model="queryParam" :label-col="labelCol" :wrapper-col="wrapperCol"> <a-form ref="formRef" @keyup.enter.native="searchQuery" :model="queryParam" :label-col="labelCol"
:wrapper-col="wrapperCol">
<a-row :gutter="24"> <a-row :gutter="24">
<a-col :lg="6"> <a-col :lg="6">
<a-form-item name="paramStatus"> <a-form-item name="paramStatus">
@ -17,14 +18,16 @@
<a-col :lg="6"> <a-col :lg="6">
<a-form-item name="paramsRequestTime"> <a-form-item name="paramsRequestTime">
<template #label><span title="抄表时间">本次抄表时间</span></template> <template #label><span title="抄表时间">本次抄表时间</span></template>
<a-date-picker placeholder="请选择日期" format="YYYY-MM-DD" valueFormat="YYYY-MM-DD" v-model:value="queryParam.paramsRequestTime" style="width: 100%" /> <a-date-picker placeholder="请选择日期" format="YYYY-MM-DD" valueFormat="YYYY-MM-DD"
v-model:value="queryParam.paramsRequestTime" style="width: 100%" />
</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">
<span style="float: left; overflow: hidden" class="table-page-search-submitButtons"> <span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
<a-button type="primary" preIcon="ant-design:search-outlined" @click="searchQuery">查询</a-button> <a-button type="primary" preIcon="ant-design:search-outlined" @click="searchQuery">查询</a-button>
<a-button type="primary" preIcon="ant-design:reload-outlined" @click="searchReset" style="margin-left: 8px">重置</a-button> <a-button type="primary" preIcon="ant-design:reload-outlined" @click="searchReset"
style="margin-left: 8px">重置</a-button>
</span> </span>
</a-col> </a-col>
</a-row> </a-row>
@ -44,29 +47,29 @@
</template> </template>
<script lang="ts" name="ApiRequestLog-ApiRequestLog" setup> <script lang="ts" name="ApiRequestLog-ApiRequestLog" setup>
import { ref, reactive } from 'vue'; import { ref, reactive } from 'vue';
import { BasicTable, useTable, TableAction } from '/@/components/Table'; import { BasicTable, useTable, TableAction } from '/@/components/Table';
import { useListPage } from '/@/hooks/system/useListPage'; import { useListPage } from '/@/hooks/system/useListPage';
import { dbsbcolumns, superQuerySchema } from './ApiRequestLog.data'; import { dbsbcolumns, superQuerySchema } from './ApiRequestLog.data';
import { list, deleteOne, batchDelete, getImportUrl, getExportUrl } from './ApiRequestLog.api'; import { list, deleteOne, batchDelete, getImportUrl, getExportUrl } from './ApiRequestLog.api';
import { downloadFile } from '/@/utils/common/renderUtils'; import { downloadFile } from '/@/utils/common/renderUtils';
import ApiRequestLogModal from './components/ApiRequestLogModal.vue' import ApiRequestLogModal from './components/ApiRequestLogModal.vue'
import { useUserStore } from '/@/store/modules/user'; import { useUserStore } from '/@/store/modules/user';
import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue'; import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
import JSelectMultiple from '/@/components/Form/src/jeecg/components/JSelectMultiple.vue'; import JSelectMultiple from '/@/components/Form/src/jeecg/components/JSelectMultiple.vue';
const formRef = ref(); const formRef = ref();
const queryParam = reactive<any>({}); const queryParam = reactive<any>({});
const toggleSearchStatus = ref<boolean>(false); const toggleSearchStatus = ref<boolean>(false);
const registerModal = ref(); const registerModal = ref();
const userStore = useUserStore(); const userStore = useUserStore();
//注册table数据 //注册table数据
const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({ const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
tableProps: { tableProps: {
title: 'api请求日志', title: 'api请求日志',
api: list, api: list,
columns:dbsbcolumns, columns: dbsbcolumns,
canResize:false, canResize: false,
useSearchForm: false, useSearchForm: false,
immediate: false, immediate: false,
showActionColumn: false, showActionColumn: false,
@ -78,121 +81,128 @@
return Object.assign(params, queryParam); return Object.assign(params, queryParam);
}, },
}, },
}); });
const [registerTable, { reload, collapseAll, updateTableDataRecord, findTableDataRecord, getDataSource }, { rowSelection, selectedRowKeys }] = tableContext; const [registerTable, { reload, collapseAll, updateTableDataRecord, findTableDataRecord, getDataSource }, { rowSelection, selectedRowKeys }] = tableContext;
const labelCol = reactive({ const labelCol = reactive({
xs:24, xs: 24,
sm:8, sm: 8,
xl:6, xl: 6,
xxl:8 xxl: 8
}); });
const wrapperCol = reactive({ const wrapperCol = reactive({
xs: 24, xs: 24,
sm: 16, sm: 16,
}); });
/** /**
* 新增事件 * 新增事件
*/ */
function handleAdd() { function handleAdd() {
registerModal.value.disableSubmit = false; registerModal.value.disableSubmit = false;
registerModal.value.add(); registerModal.value.add();
} }
/** /**
* 编辑事件 * 编辑事件
*/ */
function handleEdit(record: Recordable) { function handleEdit(record: Recordable) {
registerModal.value.disableSubmit = false; registerModal.value.disableSubmit = false;
registerModal.value.edit(record); registerModal.value.edit(record);
} }
/** /**
* 详情 * 详情
*/ */
function handleDetail(record: Recordable) { function handleDetail(record: Recordable) {
registerModal.value.disableSubmit = true; registerModal.value.disableSubmit = true;
registerModal.value.edit(record); registerModal.value.edit(record);
} }
/** /**
* 删除事件 * 删除事件
*/ */
async function handleDelete(record) { async function handleDelete(record) {
await deleteOne({ id: record.id }, handleSuccess); await deleteOne({ id: record.id }, handleSuccess);
} }
/** /**
* 批量删除事件 * 批量删除事件
*/ */
async function batchHandleDelete() { async function batchHandleDelete() {
await batchDelete({ ids: selectedRowKeys.value }, handleSuccess); await batchDelete({ ids: selectedRowKeys.value }, handleSuccess);
} }
/** /**
* 成功回调 * 成功回调
*/ */
function handleSuccess() { function handleSuccess() {
(selectedRowKeys.value = []) && reload(); (selectedRowKeys.value = []) && reload();
} }
/** /**
* 查询 * 查询
*/ */
function searchQuery() { function searchQuery() {
console.log('searchQuery',queryParam); console.log('searchQuery', queryParam);
reload(); reload();
} }
/** /**
* 重置 * 重置
*/ */
function searchReset() { function searchReset() {
formRef.value.resetFields(); formRef.value.resetFields();
selectedRowKeys.value = []; selectedRowKeys.value = [];
//刷新数据 //刷新数据
reload(); reload();
} }
function init(record) { function init(record) {
console.log("🚀 ~ init ~ record:", record) console.log("🚀 ~ init ~ record:", record)
queryParam.cid = record.cid; queryParam.cid = record.cid;
queryParam.type = record.type; queryParam.type = record.type;
reload(); reload();
} }
defineExpose({ defineExpose({
init, init,
}); });
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.jeecg-basic-table-form-container { .jeecg-basic-table-form-container {
padding: 0; padding: 0;
margin-bottom: 14px;
.table-page-search-submitButtons { .table-page-search-submitButtons {
display: block; display: block;
margin-bottom: 24px; margin-bottom: 14px;
white-space: nowrap; white-space: nowrap;
} }
.query-group-cust{
.query-group-cust {
min-width: 100px !important; min-width: 100px !important;
} }
.query-group-split-cust{
.query-group-split-cust {
width: 30px; width: 30px;
display: inline-block; display: inline-block;
text-align: center text-align: center
} }
.ant-form-item:not(.ant-form-item-with-help){
margin-bottom: 16px; .ant-form-item:not(.ant-form-item-with-help) {
margin-bottom: 14px;
height: 32px; height: 32px;
} }
:deep(.ant-picker),:deep(.ant-input-number){
:deep(.ant-picker),
:deep(.ant-input-number) {
width: 100%; width: 100%;
} }
} }
</style> </style>

54
src/views/iot/tq/electricity/apilog/ApiLogList.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<div> <div class="p-2">
<a-tabs v-model:activeKey="activeKey" type="card" @change="handleChange"> <a-tabs v-model:activeKey="activeKey" type="card" @change="handleChange">
<a-tab-pane key="3" tab="抄表" > <a-tab-pane key="3" tab="抄表">
<ApiRequestLogList ref="ApiRequestLogListModal3"></ApiRequestLogList> <ApiRequestLogList ref="ApiRequestLogListModal3"></ApiRequestLogList>
</a-tab-pane> </a-tab-pane>
<a-tab-pane key="9" tab="清零" force-render> <a-tab-pane key="9" tab="清零" force-render>
@ -18,76 +18,82 @@
</template> </template>
<script lang="ts" name="departUtils-sysDepart" setup> <script lang="ts" name="departUtils-sysDepart" setup>
import { ref, reactive } from 'vue'; import { ref, reactive } from 'vue';
import ApiRequestLogList from '/@/views/iot/tq/ApiRequestLog/ApiRequestLogList.vue'; import ApiRequestLogList from '/@/views/iot/tq/ApiRequestLog/ApiRequestLogList.vue';
import ApiRequestLogList2 from '/@/views/iot/tq/ApiRequestLog/ApiRequestLogList2.vue'; import ApiRequestLogList2 from '/@/views/iot/tq/ApiRequestLog/ApiRequestLogList2.vue';
const activeKey= ref('3'); const activeKey = ref('3');
const dbsbInfo = ref<any>({}); const dbsbInfo = ref<any>({});
const ApiRequestLogListModal9 = ref(); const ApiRequestLogListModal9 = ref();
const ApiRequestLogListModal3 = ref(); const ApiRequestLogListModal3 = ref();
const ApiRequestLogListModal10 = ref(); const ApiRequestLogListModal10 = ref();
const ApiRequestLogListModal11 = ref(); const ApiRequestLogListModal11 = ref();
function initLog(record){ function initLog(record) {
activeKey.value = "3"; activeKey.value = "3";
getDataList(activeKey.value, record); getDataList(activeKey.value, record);
dbsbInfo.value = record; dbsbInfo.value = record;
} }
function getDataList(type, record) { function getDataList(type, record) {
console.log("🚀 ~ getDataList ~ type, record:", type, record) console.log("🚀 ~ getDataList ~ type, record:", type, record)
var params = { var params = {
type: type, type: type,
cid: record.cid cid: record.cid
} }
if(type == '9'){ if (type == '9') {
ApiRequestLogListModal9.value.init(params); ApiRequestLogListModal9.value.init(params);
}else if(type == '3'){ } else if (type == '3') {
ApiRequestLogListModal3.value.init(params); ApiRequestLogListModal3.value.init(params);
}else if(type == '10'){ } else if (type == '10') {
ApiRequestLogListModal10.value.init(params); ApiRequestLogListModal10.value.init(params);
}else if(type == '11'){ } else if (type == '11') {
ApiRequestLogListModal11.value.init(params); ApiRequestLogListModal11.value.init(params);
} }
} }
function handleChange(key) { function handleChange(key) {
console.log("🚀 ~ handleChange ~ key:", key) console.log("🚀 ~ handleChange ~ key:", key)
activeKey.value = key; activeKey.value = key;
getDataList(key, dbsbInfo.value); getDataList(key, dbsbInfo.value);
} }
defineExpose({ defineExpose({
initLog, initLog,
}); });
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.jeecg-basic-table-form-container { .jeecg-basic-table-form-container {
padding: 0; padding: 0;
.table-page-search-submitButtons { .table-page-search-submitButtons {
display: block; display: block;
margin-bottom: 24px; margin-bottom: 24px;
white-space: nowrap; white-space: nowrap;
} }
.query-group-cust{
.query-group-cust {
min-width: 100px !important; min-width: 100px !important;
} }
.query-group-split-cust{
.query-group-split-cust {
width: 30px; width: 30px;
display: inline-block; display: inline-block;
text-align: center text-align: center
} }
.ant-form-item:not(.ant-form-item-with-help){
.ant-form-item:not(.ant-form-item-with-help) {
margin-bottom: 16px; margin-bottom: 16px;
height: 32px; height: 32px;
} }
:deep(.ant-picker),:deep(.ant-input-number){
:deep(.ant-picker),
:deep(.ant-input-number) {
width: 100%; width: 100%;
} }
} }
</style> </style>

59
src/views/iot/tq/electricity/apilog/ApiLogModal.vue
View File

@ -1,8 +1,9 @@
<template> <template>
<a-drawer :title="title" :width="width" v-model:visible="visible" :closable="true" <a-drawer :title="title" :width="width" v-model:visible="visible" :closable="true"
:footer-style="{ textAlign: 'right' }" @close="handleCancel"> :footer-style="{ textAlign: 'right' }" :bodyStyle="{ padding: '14px' }" @close="handleCancel">
<DepartUtilsList ref="registerForm" @ok="submitCallback" :formDisabled="disableSubmit" :formBpm="false"></DepartUtilsList> <DepartUtilsList ref="registerForm" @ok="submitCallback" :formDisabled="disableSubmit" :formBpm="false">
</DepartUtilsList>
<template #footer> <template #footer>
<a-button type="primary" style="margin-right: 8px" @click="handleCancel">关闭</a-button> <a-button type="primary" style="margin-right: 8px" @click="handleCancel">关闭</a-button>
<a-button type="primary" @click="handleOk" v-if="!disableSubmit">确认</a-button> <a-button type="primary" @click="handleOk" v-if="!disableSubmit">确认</a-button>
@ -11,62 +12,62 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { ref, nextTick, defineExpose } from 'vue'; import { ref, nextTick, defineExpose } from 'vue';
import DepartUtilsList from './ApiLogList.vue' import DepartUtilsList from './ApiLogList.vue'
import JModal from '/@/components/Modal/src/JModal/JModal.vue'; import JModal from '/@/components/Modal/src/JModal/JModal.vue';
const title = ref<string>(''); const title = ref<string>('');
const width = ref<string>('80%'); const width = ref<string>('80%');
const visible = ref<boolean>(false); const visible = ref<boolean>(false);
const disableSubmit = ref<boolean>(false); const disableSubmit = ref<boolean>(false);
const registerForm = ref(); const registerForm = ref();
const emit = defineEmits(['register', 'success']); const emit = defineEmits(['register', 'success']);
/** /**
* 日志 * 日志
* @param record * @param record
*/ */
function showApiLog(record) { function showApiLog(record) {
title.value = '日志'; title.value = '日志';
visible.value = true; visible.value = true;
nextTick(() => { nextTick(() => {
registerForm.value.initLog(record); registerForm.value.initLog(record);
}); });
} }
/** /**
* 确定按钮点击事件 * 确定按钮点击事件
*/ */
function handleOk() { function handleOk() {
registerForm.value.submitForm(); registerForm.value.submitForm();
} }
/** /**
* form保存回调事件 * form保存回调事件
*/ */
function submitCallback(params) { function submitCallback(params) {
handleCancel(); handleCancel();
emit('success',params); emit('success', params);
} }
/** /**
* 取消按钮回调事件 * 取消按钮回调事件
*/ */
function handleCancel() { function handleCancel() {
visible.value = false; visible.value = false;
} }
defineExpose({ defineExpose({
showApiLog, showApiLog,
disableSubmit, disableSubmit,
}); });
</script> </script>
<style lang="less"> <style lang="less">
/**隐藏样式-modal确定按钮 */ /**隐藏样式-modal确定按钮 */
.jee-hidden { .jee-hidden {
display: none !important; display: none !important;
} }
</style> </style>
<style lang="less" scoped></style> <style lang="less" scoped></style>

59
src/views/iot/tq/electricity/apilog/WaterApiLogList.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<div> <div class="p-2">
<a-tabs v-model:activeKey="activeKey" type="card" @change="handleChange"> <a-tabs v-model:activeKey="activeKey" type="card" @change="handleChange">
<a-tab-pane key="42" tab="抄表" > <a-tab-pane key="42" tab="抄表">
<ApiRequestLogList ref="ApiRequestLogListModal42"></ApiRequestLogList> <ApiRequestLogList ref="ApiRequestLogListModal42"></ApiRequestLogList>
</a-tab-pane> </a-tab-pane>
<a-tab-pane key="49" tab="清零" force-render> <a-tab-pane key="49" tab="清零" force-render>
@ -18,76 +18,83 @@
</template> </template>
<script lang="ts" name="departUtils-sysDepart" setup> <script lang="ts" name="departUtils-sysDepart" setup>
import { ref, reactive } from 'vue'; import { ref, reactive } from 'vue';
import ApiRequestLogList from '/@/views/iot/tq/ApiRequestLog/ApiRequestLogList.vue'; import ApiRequestLogList from '/@/views/iot/tq/ApiRequestLog/ApiRequestLogList.vue';
import ApiRequestLogList2 from '/@/views/iot/tq/ApiRequestLog/ApiRequestLogList2.vue'; import ApiRequestLogList2 from '/@/views/iot/tq/ApiRequestLog/ApiRequestLogList2.vue';
const activeKey= ref('42'); const activeKey = ref('42');
const dbsbInfo = ref<any>({}); const dbsbInfo = ref<any>({});
const ApiRequestLogListModal42 = ref(); const ApiRequestLogListModal42 = ref();
const ApiRequestLogListModal43 = ref(); const ApiRequestLogListModal43 = ref();
const ApiRequestLogListModal49 = ref(); const ApiRequestLogListModal49 = ref();
const ApiRequestLogListModal53 = ref(); const ApiRequestLogListModal53 = ref();
function initLog(record){ function initLog(record) {
activeKey.value = "42"; activeKey.value = "42";
getDataList(activeKey.value, record); getDataList(activeKey.value, record);
dbsbInfo.value = record; dbsbInfo.value = record;
} }
function getDataList(type, record) { function getDataList(type, record) {
console.log("🚀 ~ getDataList ~ type, record:", type, record) console.log("🚀 ~ getDataList ~ type, record:", type, record)
var params = { var params = {
type: type, type: type,
cid: record.cid cid: record.cid
} }
if(type == '42'){ if (type == '42') {
ApiRequestLogListModal42.value.init(params); ApiRequestLogListModal42.value.init(params);
}else if(type == '43'){ } else if (type == '43') {
ApiRequestLogListModal43.value.init(params); ApiRequestLogListModal43.value.init(params);
}else if(type == '49'){ } else if (type == '49') {
ApiRequestLogListModal49.value.init(params); ApiRequestLogListModal49.value.init(params);
}else if(type == '53'){ } else if (type == '53') {
ApiRequestLogListModal53.value.init(params); ApiRequestLogListModal53.value.init(params);
} }
} }
function handleChange(key) { function handleChange(key) {
console.log("🚀 ~ handleChange ~ key:", key) console.log("🚀 ~ handleChange ~ key:", key)
activeKey.value = key; activeKey.value = key;
getDataList(key, dbsbInfo.value); getDataList(key, dbsbInfo.value);
} }
defineExpose({ defineExpose({
initLog, initLog,
}); });
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.jeecg-basic-table-form-container { .jeecg-basic-table-form-container {
padding: 0; padding: 0;
margin-bottom: 14px;
.table-page-search-submitButtons { .table-page-search-submitButtons {
display: block; display: block;
margin-bottom: 24px; margin-bottom: 14px;
white-space: nowrap; white-space: nowrap;
} }
.query-group-cust{
.query-group-cust {
min-width: 100px !important; min-width: 100px !important;
} }
.query-group-split-cust{
.query-group-split-cust {
width: 30px; width: 30px;
display: inline-block; display: inline-block;
text-align: center text-align: center
} }
.ant-form-item:not(.ant-form-item-with-help){
margin-bottom: 16px; .ant-form-item:not(.ant-form-item-with-help) {
margin-bottom: 14px;
height: 32px; height: 32px;
} }
:deep(.ant-picker),:deep(.ant-input-number){
:deep(.ant-picker),
:deep(.ant-input-number) {
width: 100%; width: 100%;
} }
} }
</style> </style>

59
src/views/iot/tq/electricity/apilog/WaterApiLogModal.vue
View File

@ -1,8 +1,9 @@
<template> <template>
<a-drawer :title="title" :width="width" v-model:visible="visible" :closable="true" <a-drawer :title="title" :width="width" v-model:visible="visible" :closable="true"
:footer-style="{ textAlign: 'right' }" @close="handleCancel"> :footer-style="{ textAlign: 'right' }" :bodyStyle="{ padding: '14px' }" @close="handleCancel">
<WaterApiLogList ref="registerForm" @ok="submitCallback" :formDisabled="disableSubmit" :formBpm="false"></WaterApiLogList> <WaterApiLogList ref="registerForm" @ok="submitCallback" :formDisabled="disableSubmit" :formBpm="false">
</WaterApiLogList>
<template #footer> <template #footer>
<a-button type="primary" style="margin-right: 8px" @click="handleCancel">关闭</a-button> <a-button type="primary" style="margin-right: 8px" @click="handleCancel">关闭</a-button>
<a-button type="primary" @click="handleOk" v-if="!disableSubmit">确认</a-button> <a-button type="primary" @click="handleOk" v-if="!disableSubmit">确认</a-button>
@ -11,62 +12,62 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { ref, nextTick, defineExpose } from 'vue'; import { ref, nextTick, defineExpose } from 'vue';
import WaterApiLogList from './WaterApiLogList.vue' import WaterApiLogList from './WaterApiLogList.vue'
import JModal from '/@/components/Modal/src/JModal/JModal.vue'; import JModal from '/@/components/Modal/src/JModal/JModal.vue';
const title = ref<string>(''); const title = ref<string>('');
const width = ref<string>('80%'); const width = ref<string>('80%');
const visible = ref<boolean>(false); const visible = ref<boolean>(false);
const disableSubmit = ref<boolean>(false); const disableSubmit = ref<boolean>(false);
const registerForm = ref(); const registerForm = ref();
const emit = defineEmits(['register', 'success']); const emit = defineEmits(['register', 'success']);
/** /**
* 日志 * 日志
* @param record * @param record
*/ */
function showApiLog(record) { function showApiLog(record) {
title.value = '日志'; title.value = '日志';
visible.value = true; visible.value = true;
nextTick(() => { nextTick(() => {
registerForm.value.initLog(record); registerForm.value.initLog(record);
}); });
} }
/** /**
* 确定按钮点击事件 * 确定按钮点击事件
*/ */
function handleOk() { function handleOk() {
registerForm.value.submitForm(); registerForm.value.submitForm();
} }
/** /**
* form保存回调事件 * form保存回调事件
*/ */
function submitCallback(params) { function submitCallback(params) {
handleCancel(); handleCancel();
emit('success',params); emit('success', params);
} }
/** /**
* 取消按钮回调事件 * 取消按钮回调事件
*/ */
function handleCancel() { function handleCancel() {
visible.value = false; visible.value = false;
} }
defineExpose({ defineExpose({
showApiLog, showApiLog,
disableSubmit, disableSubmit,
}); });
</script> </script>
<style lang="less"> <style lang="less">
/**隐藏样式-modal确定按钮 */ /**隐藏样式-modal确定按钮 */
.jee-hidden { .jee-hidden {
display: none !important; display: none !important;
} }
</style> </style>
<style lang="less" scoped></style> <style lang="less" scoped></style>

124
src/views/iot/yiweilian/humid/components/AlarmList.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<div> <div>
<!--引用表格--> <!--引用表格-->
<BasicTable @register="registerTable"> <BasicTable @register="registerTable">
@ -9,36 +9,36 @@
<template v-slot:bodyCell="{ column, record, index, text }"> <template v-slot:bodyCell="{ column, record, index, text }">
</template> </template>
</BasicTable> </BasicTable>
</div> </div>
</template> </template>
<script lang="ts" name="yiweilian-apiLogList" setup> <script lang="ts" name="yiweilian-apiLogList" setup>
import { ref, reactive } from 'vue'; import { ref, reactive } from 'vue';
import { BasicTable, useTable, TableAction } from '/@/components/Table'; import { BasicTable, useTable, TableAction } from '/@/components/Table';
import { useListPage } from '/@/hooks/system/useListPage'; import { useListPage } from '/@/hooks/system/useListPage';
import { alarmColumns, alarmQuerySchema } from '../humid.data'; import { alarmColumns, alarmQuerySchema } from '../humid.data';
import { alarmList } from '../humid.api'; import { alarmList } from '../humid.api';
import { useUserStore } from '/@/store/modules/user'; import { useUserStore } from '/@/store/modules/user';
const formRef = ref(); const formRef = ref();
const queryParam = reactive<any>({}); const queryParam = reactive<any>({});
const toggleSearchStatus = ref<boolean>(false); const toggleSearchStatus = ref<boolean>(false);
const registerModal = ref(); const registerModal = ref();
const userStore = useUserStore(); const userStore = useUserStore();
//注册table数据 //注册table数据
const { prefixCls, tableContext } = useListPage({ const { prefixCls, tableContext } = useListPage({
tableProps: { tableProps: {
title: '告警日志', title: '告警日志',
api: alarmList, api: alarmList,
columns:alarmColumns, columns: alarmColumns,
canResize:false, canResize: false,
showActionColumn: false, showActionColumn: false,
// showTableSetting: false, // showTableSetting: false,
formConfig: { formConfig: {
//labelWidth: 120, //labelWidth: 120,
schemas: alarmQuerySchema, schemas: alarmQuerySchema,
autoSubmitOnEnter:false, autoSubmitOnEnter: false,
showAdvancedButton:false, showAdvancedButton: false,
fieldMapToNumber: [ fieldMapToNumber: [
], ],
fieldMapToTime: [ fieldMapToTime: [
@ -52,69 +52,99 @@
return Object.assign(params, queryParam); return Object.assign(params, queryParam);
}, },
}, },
}); });
const [registerTable, { reload, collapseAll, updateTableDataRecord, findTableDataRecord, getDataSource }, { rowSelection, selectedRowKeys }] = tableContext; const [registerTable, { reload, collapseAll, updateTableDataRecord, findTableDataRecord, getDataSource }, { rowSelection, selectedRowKeys }] = tableContext;
const labelCol = reactive({ const labelCol = reactive({
xs:24, xs: 24,
sm:8, sm: 8,
xl:6, xl: 6,
xxl:8 xxl: 8
}); });
const wrapperCol = reactive({ const wrapperCol = reactive({
xs: 24, xs: 24,
sm: 16, sm: 16,
}); });
/** /**
* 高级查询事件 * 高级查询事件
*/ */
function handleSuperQuery(params) { function handleSuperQuery(params) {
Object.keys(params).map((k) => { Object.keys(params).map((k) => {
queryParam[k] = params[k]; queryParam[k] = params[k];
}); });
searchQuery(); searchQuery();
} }
/** /**
* 成功回调 * 成功回调
*/ */
function handleSuccess() { function handleSuccess() {
(selectedRowKeys.value = []) && reload(); (selectedRowKeys.value = []) && reload();
} }
/** /**
* 查询 * 查询
*/ */
function searchQuery() { function searchQuery() {
reload(); reload();
} }
/** /**
* 重置 * 重置
*/ */
function searchReset() { function searchReset() {
formRef.value.resetFields(); formRef.value.resetFields();
selectedRowKeys.value = []; selectedRowKeys.value = [];
//刷新数据 //刷新数据
reload(); reload();
} }
function init(record) { function init(record) {
console.log("🚀 ~ init ~ record:", record) console.log("🚀 ~ init ~ record:", record)
queryParam.sn = record.sn; queryParam.sn = record.sn;
reload(); reload();
} }
defineExpose({ defineExpose({
init, init,
}); });
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.jeecg-basic-table-form-container { .jeecg-basic-table-form-container {
padding: 0px !important; padding: 0;
} margin-bottom: 14px;
.table-page-search-submitButtons {
display: block;
margin-bottom: 14px;
white-space: nowrap;
}
.query-group-cust {
min-width: 100px !important;
}
.query-group-split-cust {
width: 30px;
display: inline-block;
text-align: center
}
.ant-form-item:not(.ant-form-item-with-help) {
margin-bottom: 14px;
height: 32px;
}
:deep(.ant-row) {
margin-bottom: 8px;
}
:deep(.ant-picker),
:deep(.ant-input-number) {
width: 100%;
}
}
</style> </style>

40
src/views/iot/yiweilian/humid/components/ApiLogAlarmList.vue
View File

@ -1,4 +1,5 @@
<template> <template>
<div class="p-2">
<a-tabs v-model:activeKey="activeKey" type="card" @change="handleChange"> <a-tabs v-model:activeKey="activeKey" type="card" @change="handleChange">
<a-tab-pane key="1" tab="抄表"> <a-tab-pane key="1" tab="抄表">
<ApiLogList ref="apiLogList"></ApiLogList> <ApiLogList ref="apiLogList"></ApiLogList>
@ -7,50 +8,49 @@
<AlarmList ref="alarmList"></AlarmList> <AlarmList ref="alarmList"></AlarmList>
</a-tab-pane> </a-tab-pane>
</a-tabs> </a-tabs>
</div>
</template> </template>
<script lang="ts" name="departUtils-sysDepart" setup> <script lang="ts" name="departUtils-sysDepart" setup>
import { ref, reactive } from 'vue'; import { ref, reactive } from 'vue';
import ApiLogList from './ApiLogList.vue'; import ApiLogList from './ApiLogList.vue';
import AlarmList from './AlarmList.vue'; import AlarmList from './AlarmList.vue';
const activeKey= ref('1'); const activeKey = ref('1');
const dbsbInfo = ref<any>({}); const dbsbInfo = ref<any>({});
const apiLogList = ref(); const apiLogList = ref();
const alarmList = ref(); const alarmList = ref();
function init(record){ function init(record) {
activeKey.value = "1"; activeKey.value = "1";
getDataList(activeKey.value, record); getDataList(activeKey.value, record);
dbsbInfo.value = record; dbsbInfo.value = record;
} }
function getDataList(type, record) { function getDataList(type, record) {
console.log("🚀 ~ getDataList ~ type, record:", type, record) console.log("🚀 ~ getDataList ~ type, record:", type, record)
var params = { var params = {
sn: record.sn sn: record.sn
} }
if(type == '1'){ if (type == '1') {
apiLogList.value.init(params); apiLogList.value.init(params);
}else if(type == '2'){ } else if (type == '2') {
alarmList.value.init(params); alarmList.value.init(params);
} }
} }
function handleChange(key) { function handleChange(key) {
console.log("🚀 ~ handleChange ~ key:", key) console.log("🚀 ~ handleChange ~ key:", key)
activeKey.value = key; activeKey.value = key;
getDataList(key, dbsbInfo.value); getDataList(key, dbsbInfo.value);
} }
defineExpose({ defineExpose({
init, init,
}); });
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
//:deep(.ant-tabs-nav){
// margin: 0 !important;
//}
</style> </style>

61
src/views/iot/yiweilian/humid/components/ApiLogAlarmModal.vue
View File

@ -1,7 +1,8 @@
<template> <template>
<a-drawer :title="title" :width="width" v-model:visible="visible" :closable="true" bodyStyle="padding:14px;" <a-drawer :title="title" :width="width" v-model:visible="visible" :closable="true"
:footer-style="{ textAlign: 'right' }" @close="handleCancel"> :footer-style="{ textAlign: 'right' }" :bodyStyle="{ padding: '14px' }" @close="handleCancel">
<ApiLogAlarmList ref="registerForm" @ok="submitCallback" :formDisabled="disableSubmit" :formBpm="false"></ApiLogAlarmList> <ApiLogAlarmList ref="registerForm" @ok="submitCallback" :formDisabled="disableSubmit" :formBpm="false">
</ApiLogAlarmList>
<template #footer> <template #footer>
<a-button type="primary" style="margin-right: 8px" @click="handleCancel">关闭</a-button> <a-button type="primary" style="margin-right: 8px" @click="handleCancel">关闭</a-button>
<a-button type="primary" @click="handleOk" v-if="!disableSubmit">确认</a-button> <a-button type="primary" @click="handleOk" v-if="!disableSubmit">确认</a-button>
@ -10,62 +11,62 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { ref, nextTick, defineExpose } from 'vue'; import { ref, nextTick, defineExpose } from 'vue';
import ApiLogAlarmList from './ApiLogAlarmList.vue' import ApiLogAlarmList from './ApiLogAlarmList.vue'
import JModal from '/@/components/Modal/src/JModal/JModal.vue'; import JModal from '/@/components/Modal/src/JModal/JModal.vue';
const title = ref<string>(''); const title = ref<string>('');
const width = ref<string>('80%'); const width = ref<string>('80%');
const visible = ref<boolean>(false); const visible = ref<boolean>(false);
const disableSubmit = ref<boolean>(false); const disableSubmit = ref<boolean>(false);
const registerForm = ref(); const registerForm = ref();
const emit = defineEmits(['register', 'success']); const emit = defineEmits(['register', 'success']);
/** /**
* 日志 * 日志
* @param record * @param record
*/ */
function showLogAlarm(record) { function showLogAlarm(record) {
title.value = '日志'; title.value = '日志';
visible.value = true; visible.value = true;
nextTick(() => { nextTick(() => {
registerForm.value.init(record); registerForm.value.init(record);
}); });
} }
/** /**
* 确定按钮点击事件 * 确定按钮点击事件
*/ */
function handleOk() { function handleOk() {
registerForm.value.submitForm(); registerForm.value.submitForm();
} }
/** /**
* form保存回调事件 * form保存回调事件
*/ */
function submitCallback(params) { function submitCallback(params) {
handleCancel(); handleCancel();
emit('success',params); emit('success', params);
} }
/** /**
* 取消按钮回调事件 * 取消按钮回调事件
*/ */
function handleCancel() { function handleCancel() {
visible.value = false; visible.value = false;
} }
defineExpose({ defineExpose({
showLogAlarm, showLogAlarm,
disableSubmit, disableSubmit,
}); });
</script> </script>
<style lang="less"> <style lang="less">
/**隐藏样式-modal确定按钮 */ /**隐藏样式-modal确定按钮 */
.jee-hidden { .jee-hidden {
display: none !important; display: none !important;
} }
</style> </style>
<style lang="less" scoped></style> <style lang="less" scoped></style>

124
src/views/iot/yiweilian/humid/components/ApiLogList.vue
View File

@ -1,20 +1,23 @@
<template> <template>
<div> <div>
<!--查询区域--> <!--查询区域-->
<div class="jeecg-basic-table-form-container"> <div class="jeecg-basic-table-form-container">
<a-form ref="formRef" @keyup.enter.native="searchQuery" :model="queryParam" :label-col="labelCol" :wrapper-col="wrapperCol"> <a-form ref="formRef" @keyup.enter.native="searchQuery" :model="queryParam" :label-col="labelCol"
:wrapper-col="wrapperCol">
<a-row :gutter="24"> <a-row :gutter="24">
<a-col :lg="6"> <a-col :lg="6">
<a-form-item name="paramsRequestTime"> <a-form-item name="paramsRequestTime">
<template #label><span title="抄表时间">操作时间</span></template> <template #label><span title="抄表时间">操作时间</span></template>
<a-date-picker placeholder="请选择日期" format="YYYY-MM-DD" valueFormat="YYYY-MM-DD" v-model:value="queryParam.paramsRequestTime" style="width: 100%" /> <a-date-picker placeholder="请选择日期" format="YYYY-MM-DD" valueFormat="YYYY-MM-DD"
v-model:value="queryParam.paramsRequestTime" style="width: 100%" />
</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">
<span style="float: left; overflow: hidden" class="table-page-search-submitButtons"> <span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
<a-button type="primary" preIcon="ant-design:search-outlined" @click="searchQuery">查询</a-button> <a-button type="primary" preIcon="ant-design:search-outlined" @click="searchQuery">查询</a-button>
<a-button type="primary" preIcon="ant-design:reload-outlined" @click="searchReset" style="margin-left: 8px">重置</a-button> <a-button type="primary" preIcon="ant-design:reload-outlined" @click="searchReset"
style="margin-left: 8px">重置</a-button>
</span> </span>
</a-col> </a-col>
</a-row> </a-row>
@ -32,25 +35,25 @@
</template> </template>
<script lang="ts" name="yiweilian-apiLogList" setup> <script lang="ts" name="yiweilian-apiLogList" setup>
import { ref, reactive } from 'vue'; import { ref, reactive } from 'vue';
import { BasicTable, useTable, TableAction } from '/@/components/Table'; import { BasicTable, useTable, TableAction } from '/@/components/Table';
import { useListPage } from '/@/hooks/system/useListPage'; import { useListPage } from '/@/hooks/system/useListPage';
import { logColumns, logQuerySchema } from '../humid.data'; import { logColumns, logQuerySchema } from '../humid.data';
import { logList } from '../humid.api'; import { logList } from '../humid.api';
import { useUserStore } from '/@/store/modules/user'; import { useUserStore } from '/@/store/modules/user';
const formRef = ref(); const formRef = ref();
const queryParam = reactive<any>({optType:'read'}); const queryParam = reactive<any>({ optType: 'read' });
const toggleSearchStatus = ref<boolean>(false); const toggleSearchStatus = ref<boolean>(false);
const registerModal = ref(); const registerModal = ref();
const userStore = useUserStore(); const userStore = useUserStore();
//注册table数据 //注册table数据
const { prefixCls, tableContext } = useListPage({ const { prefixCls, tableContext } = useListPage({
tableProps: { tableProps: {
title: '操作日志', title: '操作日志',
api: logList, api: logList,
columns:logColumns, columns: logColumns,
canResize:false, canResize: false,
showActionColumn: false, showActionColumn: false,
// showTableSetting: false, // showTableSetting: false,
// formConfig: { // formConfig: {
@ -70,72 +73,95 @@
return Object.assign(params, queryParam); return Object.assign(params, queryParam);
}, },
}, },
}); });
const [registerTable, { reload, collapseAll, updateTableDataRecord, findTableDataRecord, getDataSource }, { rowSelection, selectedRowKeys }] = tableContext; const [registerTable, { reload, collapseAll, updateTableDataRecord, findTableDataRecord, getDataSource }, { rowSelection, selectedRowKeys }] = tableContext;
const labelCol = reactive({ const labelCol = reactive({
xs:24, xs: 24,
sm:8, sm: 8,
xl:6, xl: 6,
xxl:8 xxl: 8
}); });
const wrapperCol = reactive({ const wrapperCol = reactive({
xs: 24, xs: 24,
sm: 16, sm: 16,
}); });
/** /**
* 高级查询事件 * 高级查询事件
*/ */
function handleSuperQuery(params) { function handleSuperQuery(params) {
Object.keys(params).map((k) => { Object.keys(params).map((k) => {
queryParam[k] = params[k]; queryParam[k] = params[k];
}); });
searchQuery(); searchQuery();
} }
/** /**
* 成功回调 * 成功回调
*/ */
function handleSuccess() { function handleSuccess() {
(selectedRowKeys.value = []) && reload(); (selectedRowKeys.value = []) && reload();
} }
/** /**
* 查询 * 查询
*/ */
function searchQuery() { function searchQuery() {
reload(); reload();
} }
/** /**
* 重置 * 重置
*/ */
function searchReset() { function searchReset() {
formRef.value.resetFields(); formRef.value.resetFields();
selectedRowKeys.value = []; selectedRowKeys.value = [];
//刷新数据 //刷新数据
reload(); reload();
} }
function init(record) { function init(record) {
console.log("🚀 ~ init ~ record:", record) console.log("🚀 ~ init ~ record:", record)
queryParam.sn = record.sn; queryParam.sn = record.sn;
reload(); reload();
} }
defineExpose({ defineExpose({
init, init,
}); });
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.jeecg-basic-table-form-container { .jeecg-basic-table-form-container {
padding: 0; padding: 0;
.ant-form{ margin-bottom: 12px;
margin-bottom: 14px;
} .table-page-search-submitButtons {
display: block;
margin-bottom: 12px;
white-space: nowrap;
} }
.query-group-cust {
min-width: 100px !important;
}
.query-group-split-cust {
width: 30px;
display: inline-block;
text-align: center
}
.ant-form-item:not(.ant-form-item-with-help) {
margin-bottom: 12px;
height: 32px;
}
:deep(.ant-picker),
:deep(.ant-input-number) {
width: 100%;
}
}
</style> </style>

1
src/views/iot/yiweilian/humid/humid.data.ts
View File

@ -640,5 +640,6 @@ export const alarmQuerySchema: FormSchema[] = [
], ],
}, },
colProps: { span: 6 }, colProps: { span: 6 },
labelLength:8,
}, },
]; ];