修正ts类型

This commit is contained in:
Zy
2026-05-13 15:28:25 +08:00
parent 1b738c0f4d
commit a1750bc67b
114 changed files with 2346 additions and 613 deletions

View File

@@ -54,7 +54,7 @@
</el-table-column>
<el-table-column label="收费项目" align="center" prop="payType">
<template #default="scope">
<dict-tag :options="com_payrecord_pay_type" :value="scope.row.payType || ''"></dict-tag>
<dict-tag :options="com_payrecord_pay_type" :value="scope.row.payType"></dict-tag>
</template>
</el-table-column>
<el-table-column label="抄表周期" align="center" prop="recordMonth" width="180">
@@ -87,12 +87,88 @@
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
</el-card>
<!-- 添加或修改抄表周期明细对话框 -->
<el-dialog :title="dialog.title" v-model="dialog.visible" width="800px" append-to-body>
<el-form ref="payRecordListFormRef" :model="form" label-position="left">
<el-row>
<el-col :span="12">
<el-form-item label="抄表小区:" prop="recordId">
{{ form.villageName ?? '--' }}
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="房屋号码:" prop="houseName"> {{ form.houseName ?? '--' }}</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="住户姓名:" prop="recordId">
{{ form.residentName ?? '--' }}
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="住户编号:" prop="residentCode"> {{ form.residentCode ?? '--' }}</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="住户性别:" prop="recordId">
{{ form.gender === '1' ? '男' : '女' }}
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="手机号码:" prop="residentCode"> {{ form.phone ?? '--' }}</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="收费项目:" prop="recordId">
<dict-tag v-if="form.payType" :options="com_payrecord_pay_type" :value="form.payType"></dict-tag>
<span v-else>--</span>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="抄表月份:" prop="residentCode"> {{ form.recordMonth ?? '--' }}</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="收费起止日期:" prop="recordId">
{{ parseTime(form.startTime, '{y}-{m}-{d}') }} -- {{ parseTime(form.endTime, '{y}-{m}-{d}') }}
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="起始读数:" prop="startRead"> {{ form.startRead ?? '--' }} </el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="终止读数:" prop="endRead"> {{ form.endRead ?? '--' }} </el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="本期用度:" prop="startRead"> {{ form.currentCost ?? '--' }} </el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="单价:" prop="price"> {{ form.price ?? '--' }} /</el-form-item>
</el-col>
</el-row>
<el-form-item label="费用合计:" prop="totalCost"> {{ form.totalCost ?? '--' }} </el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button @click="cancel"> </el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup name="PayRecord" lang="ts">
import { listPayRecord, getPayRecord, delPayRecord, addPayRecord, updatePayRecord } from '@/api/system/SdbPayRecord';
import { PayRecordVO, PayRecordQuery, PayRecordForm } from '@/api/system/SdbPayRecord/type';
import { PayRecordListForm } from '@/api/system/SdbPayRecordMain/type';
import { checkPermi } from '@/utils/permission';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
@@ -116,16 +192,29 @@ const dialog = reactive<DialogOption>({
title: ''
});
const initFormData: PayRecordForm = {
const initFormData: PayRecordListForm = {
id: undefined,
deviceType: undefined,
houseId: undefined,
recordId: undefined,
housenumname: undefined,
payType: undefined,
recordMonth: undefined,
startTime: undefined,
endTime: undefined
endTime: undefined,
currentCost: undefined,
totalCost: undefined,
deviceCode: undefined,
deviceType: undefined,
villageName: undefined,
houseName: undefined,
residentName: undefined,
gender: undefined,
phone: undefined,
startRead: undefined,
endRead: undefined,
price: undefined,
residentCode: undefined
};
const data = reactive<PageData<PayRecordForm, PayRecordQuery>>({
const data = reactive<PageData<PayRecordListForm, PayRecordQuery>>({
form: { ...initFormData },
queryParams: {
pageNum: 1,
@@ -187,6 +276,27 @@ const handleMain = async (row?: PayRecordVO) => {
}
});
};
/** 修改按钮操作 */
const handleUpdate = async (id: string) => {
// const res = await getPayRecordList(id);
// Object.assign(form.value, res.data);
dialog.visible = true;
dialog.title = '最新抄表详细';
};
/** 取消按钮 */
const cancel = () => {
reset();
dialog.visible = false;
};
const payRecordListFormRef = ref<ElFormInstance>();
/** 表单重置 */
const reset = () => {
form.value = { ...initFormData };
payRecordListFormRef.value?.resetFields();
};
/** 删除按钮操作 */
const handleDelete = async (row?: PayRecordVO) => {
const _ids = row?.id || ids.value;

View File

@@ -24,40 +24,38 @@
</transition>
<el-card class="flex-1" shadow="never">
<template #header>
<el-row :gutter="10" class="mb8">
<right-toolbar></right-toolbar>
</el-row>
</template>
<el-table v-loading="loading" border :data="payRecordListList" @selection-change="handleSelectionChange">
<el-table v-loading="loading" border :data="payRecordListList">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="仪表名称" align="center" prop="deviceType">
<template #default="scope">
<dict-tag :options="com_waterelectricity_topup_type" :value="scope.row.deviceType"></dict-tag>
</template>
</el-table-column>
<el-table-column label="设备编号" align="center" prop="deviceCode" />
<el-table-column label="房间号" align="center" prop="houseName" />
<el-table-column label="仪表名称" align="center" prop="payType" />
<el-table-column label="收费项目" align="center" prop="payType">
<el-table-column label="收费项目" align="center" prop="payType" width="160">
<template #default="scope">
<dict-tag :options="com_payrecord_pay_type" :value="scope.row.payType"></dict-tag>
</template>
</el-table-column>
<el-table-column label="抄表月份" align="center" prop="recordMonth" width="180">
<el-table-column label="抄表月份" align="center" prop="recordMonth" width="100">
<template #default="scope">
<span>{{ parseTime(scope.row.recordMonth, '{y}-{m}') }}</span>
</template>
</el-table-column>
<el-table-column label="开始时间" align="center" prop="startTime" width="180">
<el-table-column label="开始时间" align="center" prop="startTime" width="160">
<template #default="scope">
<span>{{ parseTime(scope.row.startTime, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column>
<el-table-column label="结束时间" align="center" prop="endTime" width="180">
<el-table-column label="结束时间" align="center" prop="endTime" width="160">
<template #default="scope">
<span>{{ parseTime(scope.row.endTime, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column>
<el-table-column label="本期用度" align="center" prop="currentCost" />
<el-table-column label="费用合计(元)" align="center" prop="totalCost" />
<el-table-column label="设备编号" align="center" prop="deviceCode" />
<el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">
<el-table-column label="本期用度" align="center" prop="currentCost" width="160" />
<el-table-column label="费用合计(元)" align="center" prop="totalCost" width="120" />
<el-table-column label="操作" align="center" width="160" fixed="right" class-name="small-padding fixed-width">
<template #default="scope">
<el-button link type="primary" @click="handleUpdate(scope.row)">详情</el-button>
</template>
@@ -148,7 +146,9 @@ import { listPayRecordList, getPayRecordList, delPayRecordList, addPayRecordList
import { PayRecordListVO, PayRecordListQuery, PayRecordListForm } from '@/api/system/SdbPayRecordMain/type';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { com_payrecord_pay_type } = toRefs<any>(proxy?.useDict('com_payrecord_pay_type'));
const { com_payrecord_pay_type, com_waterelectricity_topup_type } = toRefs<any>(
proxy?.useDict('com_payrecord_pay_type', 'com_waterelectricity_topup_type')
);
const payRecordListList = ref<PayRecordListVO[]>([]);
const buttonLoading = ref(false);
@@ -159,6 +159,7 @@ const single = ref(true);
const multiple = ref(true);
const total = ref(0);
const router = useRouter();
const route = useRoute();
const queryFormRef = ref<ElFormInstance>();
const payRecordListFormRef = ref<ElFormInstance>();
@@ -218,10 +219,18 @@ const deviceCodeList = [
];
const { queryParams, form } = toRefs(data);
const queryid = ref('');
if (route.query.id) {
queryid.value = route.query.id as string;
}
/** 查询抄表周期明细列表 */
const getList = async () => {
loading.value = true;
const res = await listPayRecordList(queryParams.value);
const res = await listPayRecordList({
...queryParams.value,
recordId: queryid.value ?? undefined
});
payRecordListList.value = res.rows;
total.value = res.total;
loading.value = false;

View File

@@ -10,7 +10,13 @@
</el-form-item>
<el-form-item label="收费项目" prop="chargeItemId">
<el-select v-model="form.chargeItemId" @change="handleChange">
<el-option v-for="(item, index) in chargeitemlist" :key="index" :value="item.id" :label="item.itemName"></el-option>
<el-option
:disabled="item.status === '1'"
v-for="(item, index) in chargeitemlist"
:key="index"
:value="item.id"
:label="item.itemName"
></el-option>
</el-select>
</el-form-item>
<!-- 水费电费 收费范围为 房屋 -->
@@ -27,6 +33,7 @@
</el-radio-group>
<div @click="handleClearCheckout" v-if="form.chargeScope === '1'" class="ml-10px cursor-pointer color-red">清空</div>
</el-form-item>
<!-- 房屋选择 -->
<el-form-item v-if="form.chargeScope === '1' && typeNamelist.includes(typeName)">
<div class="residentBox">
<ul class="checkoutSideUsesbox">
@@ -52,6 +59,7 @@
</ul>
</div>
</el-form-item>
<!-- 业主选择 -->
<el-form-item v-if="form.chargeScope === '1' && !typeNamelist.includes(typeName)">
<div class="residentBox">
<ul class="checkoutSideUsesbox">
@@ -113,7 +121,7 @@ import PageHeader from '@/components/Pageheader/index.vue';
import { listChargeItem } from '@/api/system/SdbChargeItem';
import { getBill, updateBill, addBill, BillHouse, listBillHouse, queryResidentList_holder } from '@/api/system/SdbBill';
import type { DatePickerType } from 'element-plus';
import { formatDate, formatDate2 } from '@/utils';
import { formatDate2 } from '@/utils';
import { Delete } from '@element-plus/icons-vue';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;

View File

@@ -48,8 +48,12 @@
<el-table-column label="账单名称" align="center" prop="billName" />
<el-table-column label="收费范围" align="center" prop="chargeScope" width="100">
<template #default="scope">
<!-- TODO 收费类型来判断收费范围 -->
<dict-tag :options="com_bill_charge_scope_house" :value="scope.row.chargeScope"></dict-tag>
<template v-if="ShowHouselist.includes(scope.row.chargeTypeId)">
<dict-tag :options="com_bill_charge_scope_house" :value="scope.row.chargeScope"></dict-tag>
</template>
<template v-else>
<dict-tag :options="com_questionnaire_scope" :value="scope.row.chargeScope"></dict-tag>
</template>
</template>
</el-table-column>
<el-table-column label="收费项目" align="center" prop="chargeItemName" />
@@ -68,7 +72,7 @@
<template #default="scope">
<div class="flex justify-center">
<span>{{ scope.row.fixedPrice }}</span> /
<dict-tag :options="com_charge_item_unit" value="0"></dict-tag>
<dict-tag :options="com_charge_item_unit" :value="scope.row.unit"></dict-tag>
</div>
</template>
</el-table-column>
@@ -97,7 +101,7 @@ import { checkPermi } from '@/utils/permission';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { com_bill_search_filter } = toRefs<any>(proxy?.useDict('com_bill_search_filter'));
const { com_questionnaire_scope } = toRefs<any>(proxy?.useDict('com_questionnaire_scope'));
const { com_bill_charge_period } = toRefs<any>(proxy?.useDict('com_bill_charge_period'));
// const { com_bill_charge_period } = toRefs<any>(proxy?.useDict('com_bill_charge_period'));
const { com_bill_charge_scope_house } = toRefs<any>(proxy?.useDict('com_bill_charge_scope_house'));
const { com_charge_item_unit } = toRefs<any>(proxy?.useDict('com_charge_item_unit'));
@@ -118,6 +122,8 @@ const dialog = reactive<DialogOption>({
title: ''
});
const ShowHouselist = ['2049026484272791553'];
const initFormData: BillForm = {
id: undefined,
billCode: undefined,
@@ -135,9 +141,10 @@ const data = reactive<PageData<BillForm, BillQuery>>({
queryParams: {
pageNum: 1,
pageSize: 20,
billCode: '',
type: '',
value: ''
chargeItemId: '',
billCode: ''
// type: '',
// value: ''
}
});

View File

@@ -22,17 +22,17 @@
<div v-else-if="scope.row.chargeTypeName === '电费' || scope.row.chargeTypeName === '水费'">{{ scope.row.houseName }}</div>
</template>
</el-table-column>
<el-table-column align="center" label="收费项目">
<el-table-column align="center" label="收费项目" width="250">
<template #default="scope">
<div>{{ scope.row.chargeItemName }}</div>
</template>
</el-table-column>
<el-table-column align="center" label="收费周期">
<el-table-column align="center" label="收费周期" width="300">
<template #default="scope">
<div>{{ scope.row.startDate }} -- {{ scope.row.endDate }}</div>
</template>
</el-table-column>
<el-table-column align="center" label="单价">
<el-table-column align="center" label="单价" width="150">
<template #default="scope">
<div>{{ scope.row.fixedPrice }}</div>
</template>
@@ -42,13 +42,13 @@
<div>{{ scope.row.formula }}</div>
</template>
</el-table-column> -->
<el-table-column align="center" label="缴费状态">
<el-table-column align="center" label="缴费状态" width="120">
<template #default="scope">
<dict-tag v-if="!inglelist.includes(scope.row.chargeItemName)" :options="com_pay_status" :value="scope.row.payStatus"></dict-tag>
<div v-else>--</div>
</template>
</el-table-column>
<el-table-column align="center" label="应缴金额">
<el-table-column align="center" label="应缴金额" width="120">
<template #default="scope">
<div v-if="!inglelist.includes(scope.row.chargeItemName)">{{ scope.row.money ?? '--' }}</div>
<div v-else>--</div>
@@ -67,7 +67,7 @@
</div>
<div>
<span>账单名称 </span>
<span style="text-wrap: wrap; text-indent: 2rem">{{ from.billResidentId.join('、 ') }}</span>
<span style="text-wrap: wrap; text-indent: 2rem">{{ from.billResidentId.map((item) => item.chargeItemName).join('、 ') }}</span>
</div>
<div>
<span>应收合计{{ from.allCost }}</span>
@@ -157,11 +157,8 @@ const getList = () => {
};
/** 多选框选中数据 */
const handleSelectionChange = (selection: billlistType[]) => {
// TODO: 获取选中的id
ids.value = [];
ids.value = selection;
console.log(ids.value);
console.log(selection);
single.value = selection.length != 1;
multiple.value = !selection.length;
@@ -189,15 +186,20 @@ const from = ref({
});
const openDiage = () => {
if (!ids.value.length) {
ElMessage.warning('请至少选择一条账单进行收款');
return;
}
from.value = {
allCost: 0,
payStatus: '0',
billResidentId: ['202505电费', '202505水费'],
billResidentId: [],
payType: '0',
remark: ''
};
// 计算金额
console.log(ids.value);
ids.value.forEach((item) => {
from.value.billResidentId.push(item);
from.value.allCost += Number(item.money);
});
dialog.visible = true;

View File

@@ -132,6 +132,7 @@ const queryParams = ref({
pageSize: 10
});
const tabledata = ref([]);
// 支付状态 0未缴纳 1已缴纳 2缴纳失败
const getList = () => {
billQuery({
residentId: props.query.residentId,
@@ -144,7 +145,6 @@ const getList = () => {
};
/** 多选框选中数据 */
const handleSelectionChange = (selection: billlistType[]) => {
// TODO: 获取选中的id
ids.value = selection.map((item) => item.residentId);
single.value = selection.length != 1;
multiple.value = !selection.length;

View File

@@ -13,7 +13,7 @@
</el-select>
</div>
<div class="searchBox">
<el-input v-model="searchValue" @keyup.enter="getlist">
<el-input clearable v-model="searchValue" @keyup.enter="getlist">
<template #suffix>
<el-icon @click="getlist" class="cursor-pointer">
<Search></Search>
@@ -21,16 +21,19 @@
</template>
</el-input>
<div class="listbox" v-if="list.length">
<div class="listbox" v-if="onceSearch || Searching">
<div class="list_item">
<div class="title">
<DictTag :options="com_cashier_type" :value="searchType"></DictTag>
<DictTag :options="com_cashier_type" :value="LazysearchType"></DictTag>
</div>
<div class="list_body">
<div class="list_body" v-loading="Searching" v-if="list.length > 0 || Searching">
<div class="list_value" @click="searchclick(item)" v-for="(item, index) in list" :key="index">
{{ item.houseName }}-{{ item.residentName }}-{{ item.phone }}
</div>
</div>
<div v-else class="flex h-full items-center justify-center">
<span class="noData">暂无数据</span>
</div>
</div>
</div>
</div>
@@ -58,25 +61,30 @@
</template>
<script setup lang="ts">
// TODO 收银台
// TODO 历史缴费
// TODO 添加临时收费
// TODO 预存
// TODO 缴费
import { Search } from '@element-plus/icons-vue';
import { Component, DefineComponent, ref } from 'vue';
import { Component, ref } from 'vue';
import cashier from './cashier.vue';
import history from './history.vue';
import { debounce } from '@/utils';
import { cashQuery } from '@/api/system/SdbCashier';
/** 当前状态 搜索后 搜索前 */
const isSearch = ref(true);
/** 为了loading 搜索结果 添加防抖 */
const Searching = ref(false);
const onceSearch = ref(false);
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { com_cashier_type } = toRefs<any>(proxy?.useDict('com_cashier_type'));
console.log(com_cashier_type);
/** 房屋 住户 车辆 车位 */
const com_cashier_type_list = ref(['houseName', 'residentName']);
const searchform = ref();
const searchValue = ref('');
const searchType = ref('residentName');
const searchType = ref('houseName');
const LazysearchType = ref('');
function handleChangeSearchType() {
list.value = [];
searchValue.value = '';
@@ -126,13 +134,46 @@ function handleChecout(index: TabValue) {
}
// ! ===================================================================================
// 用于追踪最新请求的标识
let latestRequestId = 0;
function getlist() {
console.log('search2');
// 生成当前请求的唯一ID
const currentRequestId = ++latestRequestId;
const currenttime = Date.now();
Searching.value = true;
searchform.value = {};
searchform.value[searchType.value] = searchValue.value;
cashQuery(searchform.value).then((res) => {
list.value = res.data;
});
let lastdata = [];
cashQuery(searchform.value)
.then((res) => {
// 检查是否是最新的请求,防止竞态条件
if (currentRequestId === latestRequestId) {
lastdata = res.data;
}
})
.finally(() => {
if (currentRequestId === latestRequestId) {
LazysearchType.value = searchType.value;
onceSearch.value = true;
// 计算已过去的时间
const elapsedTime = Date.now() - currenttime;
const minLoadingTime = 300;
if (elapsedTime < minLoadingTime) {
setTimeout(() => {
// 再次检查,防止在等待期间发起了新请求
if (currentRequestId === latestRequestId) {
list.value = lastdata;
Searching.value = false;
}
}, minLoadingTime - elapsedTime);
} else {
list.value = lastdata;
Searching.value = false;
}
}
});
}
// ! ===================================================================================
const handleBack = () => {
@@ -142,6 +183,9 @@ const handleBack = () => {
</script>
<style scoped lang="scss">
.noData {
color: #999999;
}
.tabsbox {
height: 60px;
background-color: #fff;
@@ -203,11 +247,15 @@ const handleBack = () => {
}
.listbox {
border: 1px solid #ccc;
width: 100%;
padding: 15px;
min-height: 200px;
font-size: 16px;
margin-top: -2px;
box-sizing: border-box;
border-radius: 0px 0px 5px 5px;
background-color: rgba(255, 255, 255, 1);
color: rgba(16, 16, 16, 1);
box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.1);
.list_item {
padding-bottom: 30px;

View File

@@ -66,7 +66,7 @@
<el-table-column label="设备编码" width="250" align="center" prop="deviceCode" />
<el-table-column label="设备状态" width="100" align="center" prop="status">
<template #default="scope">
<div class="readRecord" v-if="scope.row.status">
<div class="readRecord" v-if="scope.row.status !== null">
<DictTag :options="com_waterdevice_on_status" :value="scope.row.status"></DictTag>
</div>
<span v-else>---</span>
@@ -121,32 +121,31 @@
></el-switch>
</template>
</el-table-column> -->
<el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">
<el-table-column min-width="120" label="操作" align="center" fixed="right" class-name="small-padding fixed-width">
<template #default="scope">
<el-row>
<el-col :span="24" class="flex flex-items-center actions">
<el-button link type="primary" @click="handleRecode(scope.row)" v-hasPermi="['equipment:view:electricitydevice']">充值记录</el-button>
<el-button link type="primary" @click="handleQrCode(scope.row)" v-hasPermi="['equipment:addqrcode:electricitydevice']"
>生成条码</el-button
>
<el-button link type="primary" @click="handleOpenDialog('usedWater', scope.row)" v-hasPermi="['equipment:useWater:electricitydevice']"
>用水量</el-button
>
<el-button
link
type="primary"
@click="handleOpenDialog('Upload', scope.row)"
v-hasPermi="['equipment:updatehardware:electricitydevice']"
>更新固件</el-button
>
<el-button
link
type="primary"
@click="handleOpenDialog('UpdateHouse', scope.row)"
v-hasPermi="['equipment:edithouse:electricitydevice']"
>绑定房屋</el-button
>
<!-- <el-dropdown style="vertical-align: text-top">
<div class="actions">
<el-button link type="primary" @click="handleRecode(scope.row)" v-hasPermi="['equipment:view:electricitydevice']">充值记录</el-button>
<el-button link type="primary" @click="handleQrCode(scope.row)" v-hasPermi="['equipment:addqrcode:electricitydevice']"
>生成条码</el-button
>
<el-button link type="primary" @click="handleOpenDialog('usedWater', scope.row)" v-hasPermi="['equipment:useWater:electricitydevice']"
>用电量</el-button
>
<el-button
link
type="primary"
@click="handleOpenDialog('Upload', scope.row)"
v-hasPermi="['equipment:updatehardware:electricitydevice']"
>更新固件</el-button
>
<el-button
link
type="primary"
@click="handleOpenDialog('UpdateHouse', scope.row)"
v-hasPermi="['equipment:edithouse:electricitydevice']"
>绑定房屋</el-button
>
<!-- <el-dropdown style="vertical-align: text-top">
<el-button link type="primary">
<div>
更多<el-icon><arrow-down /></el-icon>
@@ -166,8 +165,7 @@
</el-dropdown-menu>
</template>
</el-dropdown> -->
</el-col>
</el-row>
</div>
</template>
</el-table-column>
</el-table>
@@ -180,19 +178,21 @@
<el-form-item label="设备编号" prop="deviceCode"> {{ UsedWaterform.deviceCode }} </el-form-item>
<el-form-item label="开始时间" prop="startTime">
<el-date-picker
format="YYYY-MM-DD HH:MM:ss"
value-format="YYYY-MM-DD HH:MM:ss"
format="YYYY-MM-DD HH:mm:ss"
value-format="YYYY-MM-DD HH:mm:ss"
v-model="UsedWaterform.startTime"
type="datetime"
@update:model-value="handleStarTime"
placeholder="开始时间"
/>
</el-form-item>
<el-form-item label="结束时间" prop="endTime">
<el-date-picker
format="YYYY-MM-DD HH:MM:ss"
value-format="YYYY-MM-DD HH:MM:ss"
format="YYYY-MM-DD HH:mm:ss"
value-format="YYYY-MM-DD HH:mm:ss"
v-model="UsedWaterform.endTime"
type="datetime"
@update:model-value="handleEndTime"
placeholder="结束时间"
/>
</el-form-item>
@@ -326,6 +326,26 @@ const rules = {
startTime: [{ required: true, message: '请选择开始时间', trigger: 'blur' }],
endTime: [{ required: true, message: '请选择结束时间', trigger: 'blur' }]
};
function handleStarTime(val: string) {
if (!val) return;
const current = new Date(val).getTime();
if (UsedWaterform.value.endTime && UsedWaterform.value.startTime) {
if (current > new Date(UsedWaterform.value.endTime).getTime()) {
UsedWaterform.value.endTime = '';
ElMessage.warning('开始时间不能大于结束时间');
}
}
}
function handleEndTime(val: string) {
if (!val) return;
const current = new Date(val).getTime();
if (UsedWaterform.value.startTime && UsedWaterform.value.endTime) {
if (current < new Date(UsedWaterform.value.startTime).getTime()) {
UsedWaterform.value.startTime = '';
ElMessage.warning('结束时间不能小于开始时间');
}
}
}
// ! =======================================================================================
// ? 上传固件 ==============================================================================================
@@ -464,7 +484,7 @@ function getTree() {
}
/** 电表 启停*/
// TODO 修改电表 启停
// TODO 修改电表 启停
const handleChangeWater = (val: string, row: ElectricityDeviceVO) => {};
/** 提交按钮 */
const submitForm = () => {
@@ -579,9 +599,18 @@ const download = (url: string) => {
<style lang="scss" scoped>
.actions {
:deep(.el-button + .el-button) {
margin-left: 0;
}
:deep(.el-button > span) {
font-weight: 650;
}
@media (max-width: 1500px) {
display: flex;
flex-direction: column;
align-items: center;
}
}
:deep(.waterDevice_online) {
color: #3dd4a7;

View File

@@ -4,7 +4,7 @@
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
<div v-show="showSearch" class="mb-[10px]">
<el-card shadow="hover">
<el-form ref="queryFormRef" label-width="100px" @submit.prevent="handleQuery" :model="queryParams" :inline="true">
<el-form ref="queryFormRef" label-width="70px" @submit.prevent="handleQuery" :model="queryParams" :inline="true">
<!-- <el-form-item label="设备状态" prop="eleStatus">
<el-select v-model="queryParams.eleStatus">
<el-option v-for="(item, index) in com_waterdevice_on_status" :key="index" :label="item.label" :value="item.value"></el-option>
@@ -15,8 +15,11 @@
<el-option v-for="(item, index) in com_water_readrecord_status" :key="index" :label="item.label" :value="item.value"></el-option>
</el-select>
</el-form-item> -->
<el-form-item label="设备编号" prop="deviceCode">
<el-input v-model="queryParams.deviceCode" placeholder="请输入" clearable />
</el-form-item>
<el-form-item label="房屋" prop="houseName">
<el-input v-model="queryParams.houseName" placeholder="请输入" clearable />
<el-input clearable v-model="queryParams.houseName" placeholder="请输入" />
</el-form-item>
<el-form-item>
<el-button type="primary" @click="handleQuery">搜索</el-button>
@@ -38,6 +41,9 @@
<el-dropdown-item @click="handleMarkqrcode" v-if="checkPermi(['equipment:addqrcode:waterdevice'])">
<span>批量生成条形码</span>
</el-dropdown-item>
<el-dropdown-item @click="handleMarkQrcodeZip">
<span>批量下载条形码</span>
</el-dropdown-item>
<!-- <el-dropdown-item v-hasPermi="['equipment:addqrcode:electricitydevice']">
<div @click="handleMarkqrcode">批量更新固件</div>
</el-dropdown-item> -->
@@ -51,13 +57,14 @@
<el-table-column label="设备编码" width="250" align="center" prop="deviceCode" />
<el-table-column label="设备状态" width="100" align="center" prop="eleStatus">
<template #default="scope">
<dict-tag v-if="scope.row.waterRecord" :options="com_waterdevice_on_status" :value="scope.row.waterRecord.eleStatus"></dict-tag>
<!-- 1 离线 0在线 -->
<dict-tag v-if="scope.row.waterRecord" :options="com_waterdevice_on_status" :value="Number(scope.row.status)"></dict-tag>
<span v-else>---</span>
</template>
</el-table-column>
<el-table-column label="分合状态" width="100" align="center">
<template #default="scope">
<dict-tag v-if="scope.row.status" :options="com_water_readrecord_status" :value="scope.row.waterRecord.status"></dict-tag>
<dict-tag v-if="scope.row.status !== null" :options="com_water_readrecord_status" :value="scope.row.waterRecord.status"></dict-tag>
<span v-else>---</span>
</template>
</el-table-column>
@@ -102,29 +109,30 @@
></el-switch>
</template>
</el-table-column> -->
<el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">
<el-table-column label="操作" min-width="120" align="center" fixed="right" class-name="small-padding fixed-width">
<template #default="scope">
<el-row>
<el-col :span="24" class="flex flex-items-center actions">
<el-button link type="primary" @click="handleRecode(scope.row)" v-hasPermi="['equipment:view:waterdevice']">充值记录</el-button>
<el-button
link
type="primary"
:loading="loadingQRCode.includes(scope.row.id)"
@click="handleQrCode(scope.row)"
v-hasPermi="['equipment:addqrcode:waterdevice']"
>生成条码</el-button
>
<el-button link type="primary" @click="handleOpenDialog('usedWater', scope.row)" v-hasPermi="['equipment:useWater:waterdevice']"
>用水量</el-button
>
<el-button link type="primary" @click="handleOpenDialog('Upload', scope.row)" v-hasPermi="['equipment:updatehardware:waterdevice']"
>更新固件</el-button
>
<el-button link type="primary" @click="handleOpenDialog('UpdateHouse', scope.row)" v-hasPermi="['equipment:edithouse:waterdevice']"
>绑定房屋</el-button
>
<!-- <el-dropdown style="vertical-align: text-top">
<div class="actions">
<el-button link type="primary" @click="handleRecode(scope.row)" v-hasPermi="['equipment:view:waterdevice']">充值记录</el-button>
<el-button
link
type="primary"
:loading="loadingQRCode.includes(scope.row.id)"
@click="handleQrCode(scope.row)"
v-hasPermi="['equipment:addqrcode:waterdevice']"
>生成条码</el-button
>
<el-button link type="primary" @click="handleOpenDialog('usedWater', scope.row)" v-hasPermi="['equipment:useWater:waterdevice']"
>用水量</el-button
>
<el-button link type="primary" @click="handleOpenDialog('Upload', scope.row)" v-hasPermi="['equipment:updatehardware:waterdevice']"
>更新固件</el-button
>
<el-button link type="primary" @click="handleUpdate(scope.row.deviceCode)">最新抄表记录</el-button>
<el-button link type="primary" @click="handleOpenDialog('UpdateHouse', scope.row)" v-hasPermi="['equipment:edithouse:waterdevice']"
>绑定房屋</el-button
>
<!-- <el-dropdown style="vertical-align: text-top">
<el-button link type="primary">
<div>
更多<el-icon><arrow-down /></el-icon>
@@ -144,13 +152,19 @@
</el-dropdown-menu>
</template>
</el-dropdown> -->
</el-col>
</el-row>
</div>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
<pagination
:pageSizes="[10, 30, 50, 100]"
v-show="total > 0"
:total="total"
v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize"
@pagination="getList"
/>
</el-card>
<!-- 添加或修改水 设备对话框 -->
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
@@ -163,6 +177,7 @@
value-format="YYYY-MM-DD HH:mm:ss"
v-model="UsedWaterform.startTime"
type="datetime"
@update:model-value="handleStarTime"
placeholder="开始时间"
/>
</el-form-item>
@@ -172,6 +187,7 @@
value-format="YYYY-MM-DD HH:mm:ss"
v-model="UsedWaterform.endTime"
type="datetime"
@update:model-value="handleEndTime"
placeholder="结束时间"
/>
</el-form-item>
@@ -251,6 +267,19 @@
<div class="useditem">用水量</div>
<div class="useditem value">{{ UsedWaterInfo.count }}</div>
</div>
<el-form v-if="dialogType === 'deviceLastRecord'" ref="deviceLastRecordformRef" :model="EditHouseform" label-width="100px">
<el-form-item label="设备编号" prop="deviceCode"> {{ deviceLastRecordform.deviceCode }} </el-form-item>
<el-form-item label="读表时间" prop="readTime"> {{ deviceLastRecordform.readTime }} </el-form-item>
<el-form-item label="阀门状态" prop="status">
<DictTag :options="com_water_readrecord_status" :value="deviceLastRecordform.status"></DictTag>
</el-form-item>
<el-form-item label="余额" prop="balance"> {{ deviceLastRecordform.balance }} </el-form-item>
<el-form-item label="用水量" prop="totalWater"> {{ deviceLastRecordform.totalWater }} </el-form-item>
<el-form-item>
<el-button @click="unSubmit">关闭</el-button>
</el-form-item>
</el-form>
</el-dialog>
</div>
</template>
@@ -262,18 +291,17 @@ import {
getWaterDeviceTimeRangeUsedWater,
WaterDeviceMakerQrcode,
updateWaterDevice,
WaterDeviceUpdateBin
WaterDeviceUpdateBin,
latestRecord
} from '@/api/system/SdbWaterDevice/index';
import { WaterDeviceVO, WaterDeviceQuery, WaterDeviceForm } from '@/api/system/SdbWaterDevice/type';
import { WaterDeviceVO } from '@/api/system/SdbWaterDevice/type';
import { useHouseStore } from '@/store/modules/house';
import { useUserStore } from '@/store/modules/user';
import { getHousePathById } from '@/utils/house';
import { Upload } from '@element-plus/icons-vue';
import { CascaderValue, tourEmits, UploadProps, UploadRawFile } from 'element-plus';
import { formatDate } from '@/utils/time';
import { CascaderValue, UploadProps, UploadRawFile } from 'element-plus';
import { checkPermi } from '@/utils/permission';
import { exportImagesToZip } from '@/utils/exportZip';
const huhao = 3096371295;
const uploadAUrl = import.meta.env.VITE_APP_BASE_API + '/waterDevice/uploadA';
const uploadBUrl = import.meta.env.VITE_APP_BASE_API + '/waterDevice/uploadB';
@@ -285,7 +313,7 @@ const waterDeviceList = ref<WaterDeviceVO[]>([]);
const buttonLoading = ref(false);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref<{ id: string; deviceCode: string }[]>([]);
const ids = ref<WaterDeviceVO[]>([]);
const single = ref(true);
const multiple = ref(true);
const total = ref(0);
@@ -303,19 +331,21 @@ const data = reactive({
pageSize: 10,
eleStatus: '',
houseName: '',
status: ''
status: '',
deviceCode: ''
}
});
const { queryParams } = toRefs(data);
/** 查询水 设备列表 */
const getList = async () => {
const getList = async (callback?: (vals: WaterDeviceVO[]) => void) => {
loading.value = true;
const res = await listWaterDevice(queryParams.value);
waterDeviceList.value = res.rows;
total.value = res.total;
loading.value = false;
callback && callback(waterDeviceList.value);
};
// ! 用水量 =============================================================================
const usedWaterInfo = ref(true);
@@ -325,6 +355,27 @@ const UsedWaterform = ref({
startTime: '',
endTime: ''
});
function handleStarTime(val: string) {
if (!val) return;
const current = new Date(val).getTime();
if (UsedWaterform.value.endTime && UsedWaterform.value.startTime) {
if (current > new Date(UsedWaterform.value.endTime).getTime()) {
UsedWaterform.value.endTime = '';
ElMessage.warning('开始时间不能大于结束时间');
}
}
}
function handleEndTime(val: string) {
if (!val) return;
const current = new Date(val).getTime();
if (UsedWaterform.value.startTime && UsedWaterform.value.endTime) {
if (current < new Date(UsedWaterform.value.startTime).getTime()) {
UsedWaterform.value.startTime = '';
ElMessage.warning('结束时间不能小于开始时间');
}
}
}
const UsedWaterInfo = ref({
count: '',
startTime: '',
@@ -334,6 +385,7 @@ const rules = {
startTime: [{ required: true, message: '请选择开始时间', trigger: 'blur' }],
endTime: [{ required: true, message: '请选择结束时间', trigger: 'blur' }]
};
// ! =======================================================================================
// ? 上传固件 ==============================================================================================
@@ -395,7 +447,19 @@ const EditHouseform = ref({
houseId: ''
});
// * 编辑房屋 ==============================================================================================
const deviceLastRecordformRef = ref(null);
const deviceLastRecordform = ref({
id: '',
deviceCode: '',
balance: '',
eleStatus: '',
readTime: '',
status: '',
totalWater: '',
type: ''
});
const imageRefs = ref([]);
/** 批量生成 条形码 */
function handleMarkqrcode() {
if (ids.value.length > 0) {
@@ -407,13 +471,33 @@ function handleMarkqrcode() {
ElMessage.warning('请选择设备');
}
}
function handleMarkQrcodeZip() {
if (ids.value.length > 0) {
const selectedIds = new Set(ids.value.map((item) => item.id));
const matchedList = waterDeviceList.value.filter((item) => {
return selectedIds.has(item.id) && item.url;
});
produceQRzip(matchedList);
} else {
ElMessage.warning('请选择设备');
}
}
function produceQRzip(vals: WaterDeviceVO[]) {
const arr = vals.map((item) => {
return {
name: item.deviceCode,
url: item.url
};
});
exportImagesToZip(arr);
}
/** 多选框选中数据 */
const handleSelectionChange = (selection: WaterDeviceVO[]) => {
ids.value = selection.map((item) => {
return {
id: item.id,
deviceCode: item.deviceCode
};
return item;
});
single.value = selection.length != 1;
multiple.value = !selection.length;
@@ -430,11 +514,14 @@ const handleQrCode = (row: WaterDeviceVO) => {
id: row.id,
deviceCode: row.deviceCode
}
]).then(() => {
ElMessage.success('生成成功');
loadingQRCode.value = loadingQRCode.value.filter((item) => item !== row.id);
getList();
});
])
.then(() => {
ElMessage.success('生成成功');
getList();
})
.finally(() => {
loadingQRCode.value = loadingQRCode.value.filter((item) => item !== row.id);
});
}, 1000);
};
// * house
@@ -446,26 +533,31 @@ function handleChange(val: CascaderValue) {
EditHouseform.value.houseId = val[2];
}
// * house
const dialogType = ref<'usedWater' | 'Upload' | 'UpdateHouse'>('usedWater');
const dialogType = ref<'usedWater' | 'Upload' | 'UpdateHouse' | 'deviceLastRecord'>('usedWater');
/** 用水量 更新固件 编辑房屋*/
const handleOpenDialog = (type: 'usedWater' | 'Upload' | 'UpdateHouse', row: WaterDeviceVO) => {
const handleOpenDialog = (type: 'usedWater' | 'Upload' | 'UpdateHouse' | 'deviceLastRecord', row?: WaterDeviceVO) => {
reset();
if (type === 'usedWater') {
UsedWaterform.value.deviceCode = row.deviceCode;
UsedWaterform.value.startTime = '';
UsedWaterform.value.endTime = '';
usedWaterInfo.value = true;
dialog.title = '用水量查询';
} else if (type === 'Upload') {
UploadFileform.value.deviceCodes = [row.deviceCode];
dialog.title = '固件上传';
} else if (type === 'UpdateHouse') {
EditHouseform.value.id = row.id;
EditHouseform.value.deviceCode = row.deviceCode;
EditHouseform.value.houseId = '';
dialog.title = '编辑户号';
getTree();
} else if (type === 'deviceLastRecord') {
// 处理设备最后记录的逻辑
dialog.title = '设备最新抄表记录';
}
dialog.visible = true;
dialogType.value = type;
dialog.title = type === 'usedWater' ? '用水量查询' : type === 'UpdateHouse' ? '编辑户号' : '更新固件';
};
function getTree() {
@@ -479,6 +571,26 @@ function getTree() {
/** 水表 启停*/
const handleChangeWater = (val: string, row: WaterDeviceVO) => {};
function handleUpdate(id: string) {
latestRecord(id).then((res) => {
console.log('设备最新抄表记录', res);
deviceLastRecordform.value = {
id: '',
deviceCode: '',
balance: '',
eleStatus: '',
readTime: '',
status: '',
totalWater: '',
type: ''
};
deviceLastRecordform.value = {
...res.data
};
handleOpenDialog('deviceLastRecord');
});
}
/** 提交按钮 */
const submitForm = () => {
if (dialogType.value === 'usedWater') {