Merge branch 'liubiao-main'
This commit is contained in:
160
src/views/equipmentManagement/devices/Charge.vue
Normal file
160
src/views/equipmentManagement/devices/Charge.vue
Normal file
@ -0,0 +1,160 @@
|
||||
<template>
|
||||
<div class="content">
|
||||
<div class="topFilter">
|
||||
<el-form :inline="true" :model="filter" class="demo-form-inline">
|
||||
<el-form-item label="操作时间">
|
||||
<el-date-picker
|
||||
v-model="filter.Date"
|
||||
type="daterange"
|
||||
range-separator="-"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
value-format="YYYY-MM-DD"
|
||||
:size="'default'"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="getRecordList">查询</el-button>
|
||||
<el-button link type="primary" @click="filter.Date = []">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div class="grid" v-loading="Status.loading">
|
||||
<el-table ref="grid" v-loading="Status.loading" border :data="List" height="calc(100vh - 320px)">
|
||||
<el-table-column label="创建时间" align="center" prop="createTime" />
|
||||
<el-table-column label="设备名称" align="center" prop="deviceName" />
|
||||
<el-table-column label="数据来源" align="center" prop="dataSource" />
|
||||
<el-table-column label="内容" align="center" prop="content" />
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
v-show="pagin.total > 0"
|
||||
v-model:page="pagin.pageIndex"
|
||||
v-model:limit="pagin.pageSize"
|
||||
:total="pagin.total"
|
||||
@pagination="getRecordList"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import request from '@/utils/request';
|
||||
|
||||
const props = defineProps({
|
||||
data: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
acIndex: {
|
||||
type: Number,
|
||||
required: true
|
||||
}
|
||||
});
|
||||
var filter = ref({
|
||||
Date: []
|
||||
});
|
||||
var Status = ref({
|
||||
loading: false
|
||||
});
|
||||
|
||||
var data = ref({});
|
||||
var grid = ref(null);
|
||||
var List = ref([]);
|
||||
var pagin = ref({
|
||||
total: 0,
|
||||
pageIndex: 1,
|
||||
pageSize: 10
|
||||
});
|
||||
function getRecordList() {
|
||||
Status.value.loading = true;
|
||||
|
||||
|
||||
setTimeout(() => {
|
||||
initData(props.data,true);
|
||||
}, 0);
|
||||
}
|
||||
|
||||
var deviceid = null;
|
||||
function initData(item,Refresh) {
|
||||
if (deviceid == item.data.deviceId && !Refresh) {
|
||||
Status.value.loading = false;
|
||||
return;
|
||||
}
|
||||
List.value = [];
|
||||
deviceid = item.data.deviceId;
|
||||
|
||||
let params = {
|
||||
startTime: '',
|
||||
endTime: '',
|
||||
deviceId:deviceid,
|
||||
pageNum:pagin.value.pageIndex,
|
||||
pageSize:pagin.value.pageSize,
|
||||
orderByColumn:"updatedAt",
|
||||
isAsc:"descending"
|
||||
};
|
||||
if (filter.value.Date && filter.value.Date.length) {
|
||||
params.startTime = filter.value.Date[0];
|
||||
params.endTime = filter.value.Date.length > 1 ? filter.value.Date[1] : '';
|
||||
}
|
||||
|
||||
request({
|
||||
url: '/equipment/chargeDischarge/list' ,
|
||||
method: 'get',
|
||||
params: params
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.code == 200) {
|
||||
if (res.rows) {
|
||||
if (res.rows.length) {
|
||||
List.value = res.rows;
|
||||
}
|
||||
}
|
||||
pagin.value.total= res.total;
|
||||
}
|
||||
})
|
||||
.finally(() => {
|
||||
data.value = item.data;
|
||||
Status.value.loading = false;
|
||||
});
|
||||
}
|
||||
|
||||
watch(
|
||||
() => props.acIndex, // 监听的属性
|
||||
(newVal) => {
|
||||
|
||||
|
||||
if (newVal === 3) {
|
||||
// 确保参数有效
|
||||
debugger;
|
||||
console.log('newVal=', newVal);
|
||||
getRecordList(); // 调用回调
|
||||
}
|
||||
},
|
||||
{ immediate: true } // 关键：组件初始化时立即执行一次
|
||||
);
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.content {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 30px 12px 12px 12px;
|
||||
}
|
||||
|
||||
.pickerContent {
|
||||
box-sizing: border-box;
|
||||
border: 1px solid rgba(189, 198, 215, 0.8);
|
||||
border-radius: 2px;
|
||||
}
|
||||
.topFilter {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
align-content: center;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
}
|
||||
:deep .pickerContent .el-date-editor {
|
||||
border: none !important;
|
||||
}
|
||||
</style>
|
||||
161
src/views/equipmentManagement/devices/OpraRecored.vue
Normal file
161
src/views/equipmentManagement/devices/OpraRecored.vue
Normal file
@ -0,0 +1,161 @@
|
||||
<template>
|
||||
<div class="content">
|
||||
<div class="topFilter">
|
||||
<el-form :inline="true" :model="filter" class="demo-form-inline">
|
||||
<el-form-item label="操作时间">
|
||||
<el-date-picker
|
||||
v-model="filter.Date"
|
||||
type="daterange"
|
||||
range-separator="-"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
value-format="YYYY-MM-DD"
|
||||
:size="'default'"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="getRecordList">查询</el-button>
|
||||
<el-button link type="primary" @click="filter.Date = []">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div class="grid" v-loading="Status.loading">
|
||||
<el-table ref="grid" v-loading="Status.loading" border :data="List" height="calc(100vh - 320px)">
|
||||
<el-table-column label="创建时间" align="center" prop="createTime" />
|
||||
<el-table-column label="设备名称" align="center" prop="deviceName" />
|
||||
<el-table-column label="数据来源" align="center" prop="dataSource" />
|
||||
<el-table-column label="内容" align="center" prop="content" />
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
v-show="pagin.total > 0"
|
||||
v-model:page="pagin.pageIndex"
|
||||
v-model:limit="pagin.pageSize"
|
||||
:total="pagin.total"
|
||||
@pagination="getRecordList"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import request from '@/utils/request';
|
||||
|
||||
const props = defineProps({
|
||||
data: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
acIndex: {
|
||||
type: Number,
|
||||
required: true
|
||||
}
|
||||
});
|
||||
var filter = ref({
|
||||
Date: []
|
||||
});
|
||||
var Status = ref({
|
||||
loading: false
|
||||
});
|
||||
|
||||
var data = ref({});
|
||||
var grid = ref(null);
|
||||
var List = ref([]);
|
||||
var pagin = ref({
|
||||
total: 0,
|
||||
pageIndex: 1,
|
||||
pageSize: 10
|
||||
});
|
||||
function getRecordList() {
|
||||
Status.value.loading = true;
|
||||
|
||||
|
||||
setTimeout(() => {
|
||||
initData(props.data,true);
|
||||
}, 0);
|
||||
}
|
||||
|
||||
var deviceid = null;
|
||||
function initData(item,Refresh) {
|
||||
if (deviceid == item.data.deviceId && !Refresh) {
|
||||
Status.value.loading = false;
|
||||
return;
|
||||
}
|
||||
List.value = [];
|
||||
deviceid = item.data.deviceId;
|
||||
|
||||
|
||||
let params = {
|
||||
startTime: '',
|
||||
endTime: '',
|
||||
pageNum:pagin.value.pageIndex,
|
||||
pageSize:pagin.value.pageSize,
|
||||
orderByColumn:"updateTime",
|
||||
isAsc:"descending"
|
||||
};
|
||||
if (filter.value.Date && filter.value.Date.length) {
|
||||
params.startTime = filter.value.Date[0];
|
||||
params.endTime = filter.value.Date.length > 1 ? filter.value.Date[1] : '';
|
||||
}
|
||||
|
||||
request({
|
||||
url: '/api/device/getOperationRecord/' + item.data.deviceId,
|
||||
method: 'get',
|
||||
params: params
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.code == 200) {
|
||||
if (res.rows) {
|
||||
if (res.rows.length) {
|
||||
List.value = res.rows;
|
||||
}
|
||||
}
|
||||
|
||||
pagin.value.total= res.total;
|
||||
}
|
||||
})
|
||||
.finally(() => {
|
||||
data.value = item.data;
|
||||
Status.value.loading = false;
|
||||
});
|
||||
}
|
||||
|
||||
watch(
|
||||
() => props.acIndex, // 监听的属性
|
||||
(newVal) => {
|
||||
|
||||
|
||||
if (newVal === 3) {
|
||||
// 确保参数有效
|
||||
debugger;
|
||||
console.log('newVal=', newVal);
|
||||
getRecordList(); // 调用回调
|
||||
}
|
||||
},
|
||||
{ immediate: true } // 关键：组件初始化时立即执行一次
|
||||
);
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.content {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 30px 12px 12px 12px;
|
||||
}
|
||||
|
||||
.pickerContent {
|
||||
box-sizing: border-box;
|
||||
border: 1px solid rgba(189, 198, 215, 0.8);
|
||||
border-radius: 2px;
|
||||
}
|
||||
.topFilter {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
align-content: center;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
}
|
||||
:deep .pickerContent .el-date-editor {
|
||||
border: none !important;
|
||||
}
|
||||
</style>
|
||||
256
src/views/equipmentManagement/devices/Usr.vue
Normal file
256
src/views/equipmentManagement/devices/Usr.vue
Normal file
@ -0,0 +1,256 @@
|
||||
<template>
|
||||
<div class="content">
|
||||
<div class="row">
|
||||
<div class="item">
|
||||
<div class="lable">姓名<span>：</span></div>
|
||||
<div class="val">{{ lastData?.name }}</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="lable">单位名称<span>：</span></div>
|
||||
<div class="val">{{ lastData?.position }}</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="lable">职务<span>：</span></div>
|
||||
<div class="val">{{ lastData?.unitName }}</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="lable">ID号<span>：</span></div>
|
||||
<div class="val">{{ lastData?.code }}</div>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
<div class="clear divider"></div>
|
||||
<div class="listTitle">信息登记记录</div>
|
||||
<div class="list">
|
||||
<div class="item" v-for="(item, index) in detailData">
|
||||
<div class="time">
|
||||
<el-icon><Timer /></el-icon>{{ item.item }}
|
||||
</div>
|
||||
<div class="childContent">
|
||||
<div class="itemChild" :class="i === item.child.length - 1 ? '' : 'marginBottom'" v-for="(c, i) in item.child">
|
||||
<div class="itemRow">登记时间：{{ c.createTime }}</div>
|
||||
<div class="itemRow">姓 名：{{ c.name }}</div>
|
||||
<div class="itemRow">单位名称：{{ c.position }}</div>
|
||||
<div class="itemRow">职 务：{{ c.unitName }}</div>
|
||||
<div class="itemRow">ID 号：{{ c.code }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import request from '@/utils/request';
|
||||
|
||||
const props = defineProps({
|
||||
data: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
acIndex: {
|
||||
type: Number,
|
||||
required: true
|
||||
}
|
||||
});
|
||||
|
||||
var detailData = ref([]);
|
||||
var data = ref({});
|
||||
var deviceid = null;
|
||||
var lastData = ref({ name: '', position: '', unitName: '', code: '' });
|
||||
function processDataByDateGroup(originalData) {
|
||||
// 1. 深拷贝原始数据（避免修改原数据，保护源数据完整性）
|
||||
const data = JSON.parse(JSON.stringify(originalData));
|
||||
|
||||
// 边界处理：若data不存在或非数组，返回原结构+空sipledate
|
||||
if (!data?.data || !Array.isArray(data.data)) {
|
||||
return {
|
||||
code: data?.code ?? 400, // 若原code不存在，默认400（请求错误）
|
||||
msg: data?.msg ?? '数据格式错误',
|
||||
sipledate: []
|
||||
};
|
||||
}
|
||||
|
||||
// 2. 先按createTime逆序排序（子数据内部也保持“新->旧”顺序）
|
||||
const sortedData = data.data.sort((a, b) => {
|
||||
const timeA = new Date(a.createTime);
|
||||
const timeB = new Date(b.createTime);
|
||||
return timeB - timeA; // 逆序：后创建的排在前面
|
||||
});
|
||||
|
||||
// 3. 按日期分组（key：yyyy-MM-dd，value：该日期下的所有子数据）
|
||||
const dateGroupMap = sortedData.reduce((map, item) => {
|
||||
// 提取当前数据的“yyyy-MM-dd”格式日期
|
||||
const dateKey = item.createTime.slice(0, 10);
|
||||
// 若当前日期未在map中，初始化空数组；若已存在，直接push子数据
|
||||
if (!map.has(dateKey)) {
|
||||
map.set(dateKey, []);
|
||||
}
|
||||
map.get(dateKey).push(item);
|
||||
return map;
|
||||
}, new Map()); // 使用Map而非Object，确保日期顺序与排序后一致
|
||||
|
||||
// 4. 转换为需求格式的sipledate数组（每个元素含item和child）
|
||||
const sipledate = Array.from(dateGroupMap.entries()).map(([date, childData]) => ({
|
||||
item: date, // 日期标识（yyyy-MM-dd），原需求“item1/item2”统一为“item”（更语义化）
|
||||
child: childData // 该日期下的所有子数据（已按时间逆序）
|
||||
}));
|
||||
|
||||
// 5. 返回最终格式结果
|
||||
return {
|
||||
code: data.code,
|
||||
msg: data.msg,
|
||||
sipledate: sipledate
|
||||
};
|
||||
}
|
||||
|
||||
function initData(item) {
|
||||
if (deviceid == item.data.deviceId) {
|
||||
return;
|
||||
}
|
||||
deviceid = item.data.deviceId;
|
||||
request({
|
||||
url: '/api/device/getDeviceUser/' + item.data.deviceId,
|
||||
method: 'get'
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.code == 200) {
|
||||
if (res.data) {
|
||||
if (res.data.length) {
|
||||
lastData.value = res.data[0];
|
||||
let data = processDataByDateGroup(res);
|
||||
detailData.value = data.sipledate;
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
.finally(() => {
|
||||
data.value = item.data;
|
||||
});
|
||||
}
|
||||
|
||||
watch(
|
||||
() => props.acIndex, // 监听的属性
|
||||
(newVal) => {
|
||||
if (newVal === 2 && props.data) {
|
||||
// 确保参数有效
|
||||
initData(props.data); // 调用回调
|
||||
}
|
||||
},
|
||||
{ immediate: true } // 关键：组件初始化时立即执行一次
|
||||
);
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.content {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 30px 12px 12px 12px;
|
||||
}
|
||||
.row {
|
||||
width: 50%;
|
||||
}
|
||||
.row .item {
|
||||
width: 50%;
|
||||
float: left;
|
||||
height: 36px;
|
||||
line-height: 36px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
align-content: center;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
|
||||
color: rgba(56, 64, 79, 1);
|
||||
|
||||
font-family: Microsoft YaHei;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
line-height: 18px;
|
||||
letter-spacing: 0px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.row .item .lable {
|
||||
width: 100px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.divider {
|
||||
width: 100%;
|
||||
height: 0px;
|
||||
border-bottom: 1px solid rgba(235, 238, 248, 1);
|
||||
}
|
||||
|
||||
.listTitle {
|
||||
color: rgba(56, 64, 79, 1);
|
||||
|
||||
font-family: Microsoft YaHei;
|
||||
font-size: 14px;
|
||||
font-weight: 700;
|
||||
height: 56px;
|
||||
line-height: 56px;
|
||||
letter-spacing: 0px;
|
||||
text-align: left;
|
||||
}
|
||||
.list {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
height: calc(100% - 130px);
|
||||
padding: 15px 12px;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
.list .time {
|
||||
color: #027cfb;
|
||||
|
||||
font-family: Microsoft YaHei;
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
line-height: 21px;
|
||||
height: 21px;
|
||||
letter-spacing: 0px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
|
||||
.list .itemRow{
|
||||
color: rgba(56, 64, 79, 1);
|
||||
|
||||
font-family: Microsoft YaHei;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
line-height: 18px;
|
||||
letter-spacing: 0px;
|
||||
text-align: left;
|
||||
margin-bottom: 13px;
|
||||
}
|
||||
.itemChild.marginBottom {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
.list .childContent {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
border-left: 1px solid rgba(0, 198, 250, 0.2);
|
||||
box-sizing: border-box;
|
||||
padding: 6px 20px;
|
||||
}
|
||||
|
||||
.list .itemChild {
|
||||
border-radius: 4px;
|
||||
background: rgba(247, 248, 252, 1);
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.fleft {
|
||||
float: left;
|
||||
}
|
||||
.fright {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.clear {
|
||||
clear: both;
|
||||
}
|
||||
</style>
|
||||
181
src/views/equipmentManagement/devices/WarnRecord.vue
Normal file
181
src/views/equipmentManagement/devices/WarnRecord.vue
Normal file
@ -0,0 +1,181 @@
|
||||
<template>
|
||||
<div class="content">
|
||||
<div class="topFilter">
|
||||
<el-form :inline="true" :model="filter" class="demo-form-inline">
|
||||
<el-form-item label="操作时间">
|
||||
<el-date-picker
|
||||
v-model="filter.Date"
|
||||
type="daterange"
|
||||
range-separator="-"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
value-format="YYYY-MM-DD"
|
||||
:size="'default'"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="getRecordList">查询</el-button>
|
||||
<el-button link type="primary" @click="filter.Date = []">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div class="grid" v-loading="Status.loading">
|
||||
<el-table ref="grid" v-loading="Status.loading" border :data="List" height="calc(100vh - 320px)">
|
||||
<el-table-column prop="deviceAction" label="报警事项" align="center">
|
||||
<template #default="scope">
|
||||
<div>{{ dic.warType[scope.row.deviceAction] }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column label="报警开始时间" align="center" prop="startTime" />
|
||||
<el-table-column label="报警结束时间" align="center" prop="finishTime" />
|
||||
<el-table-column label="报警持续时间" align="center" prop="durationTime" />
|
||||
<el-table-column label="处理状态" align="center" prop="treatmentState">
|
||||
<template #default="scope">
|
||||
<div>{{ dic.treamt[scope.row.deviceAction] ? dic.treamt[scope.row.deviceAction] :'未处理' }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
v-show="pagin.total > 0"
|
||||
v-model:page="pagin.pageIndex"
|
||||
v-model:limit="pagin.pageSize"
|
||||
:total="pagin.total"
|
||||
@pagination="getRecordList"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import request from '@/utils/request';
|
||||
|
||||
const props = defineProps({
|
||||
data: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
acIndex: {
|
||||
type: Number,
|
||||
required: true
|
||||
}
|
||||
});
|
||||
|
||||
var dic = {
|
||||
warType: {
|
||||
0: '强制报警',
|
||||
1: '撞击闯入',
|
||||
2: '手动报警',
|
||||
3: '电子围栏告警',
|
||||
4: '强制告警'
|
||||
},
|
||||
treamt:{
|
||||
0:"已处理",
|
||||
1:"未处理"
|
||||
}
|
||||
};
|
||||
|
||||
var filter = ref({
|
||||
Date: []
|
||||
});
|
||||
var Status = ref({
|
||||
loading: false
|
||||
});
|
||||
|
||||
var data = ref({});
|
||||
var grid = ref(null);
|
||||
var List = ref([]);
|
||||
var pagin = ref({
|
||||
total: 0,
|
||||
pageIndex: 1,
|
||||
pageSize: 10
|
||||
});
|
||||
function getRecordList() {
|
||||
Status.value.loading = true;
|
||||
|
||||
setTimeout(() => {
|
||||
initData(props.data, true);
|
||||
}, 0);
|
||||
}
|
||||
|
||||
var deviceid = null;
|
||||
function initData(item, Refresh) {
|
||||
if (deviceid == item.data.deviceId && !Refresh) {
|
||||
Status.value.loading = false;
|
||||
return;
|
||||
}
|
||||
List.value = [];
|
||||
deviceid = item.data.deviceId;
|
||||
let params = {
|
||||
startTime: '',
|
||||
endTime: '',
|
||||
pageNum:pagin.value.pageIndex,
|
||||
pageSize:pagin.value.pageSize,
|
||||
orderByColumn:"updateTime",
|
||||
isAsc:"descending"
|
||||
};
|
||||
if (filter.value.Date && filter.value.Date.length) {
|
||||
params.startTime = filter.value.Date[0];
|
||||
params.endTime = filter.value.Date.length > 1 ? filter.value.Date[1] : '';
|
||||
}
|
||||
|
||||
request({
|
||||
url: '/api/device/getAlarmRecord/' + item.data.deviceId,
|
||||
method: 'get',
|
||||
params: params
|
||||
})
|
||||
.then((res) => {
|
||||
debugger;
|
||||
if (res.code == 200) {
|
||||
if (res.rows) {
|
||||
if (res.rows.length) {
|
||||
List.value = res.rows;
|
||||
}
|
||||
}
|
||||
pagin.value.total= res.total;
|
||||
}
|
||||
})
|
||||
.finally(() => {
|
||||
data.value = item.data;
|
||||
Status.value.loading = false;
|
||||
});
|
||||
}
|
||||
|
||||
watch(
|
||||
() => props.acIndex, // 监听的属性
|
||||
(newVal) => {
|
||||
if (newVal === 4) {
|
||||
// 确保参数有效
|
||||
|
||||
console.log('newVal=', newVal);
|
||||
getRecordList(); // 调用回调
|
||||
}
|
||||
},
|
||||
{ immediate: true } // 关键：组件初始化时立即执行一次
|
||||
);
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.content {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 30px 12px 12px 12px;
|
||||
}
|
||||
|
||||
.pickerContent {
|
||||
box-sizing: border-box;
|
||||
border: 1px solid rgba(189, 198, 215, 0.8);
|
||||
border-radius: 2px;
|
||||
}
|
||||
.topFilter {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
align-content: center;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
}
|
||||
:deep .pickerContent .el-date-editor {
|
||||
border: none !important;
|
||||
}
|
||||
</style>
|
||||
212
src/views/equipmentManagement/devices/eqDetail.vue
Normal file
212
src/views/equipmentManagement/devices/eqDetail.vue
Normal file
@ -0,0 +1,212 @@
|
||||
<template>
|
||||
<div class="content">
|
||||
<div class="leftImg fleft">
|
||||
<img class="img" :src="detailData?.devicePic" />
|
||||
</div>
|
||||
<div class="detail fleft">
|
||||
|
||||
<div class="row">
|
||||
|
||||
<div class="item">
|
||||
<div class="lable">设备名称<span>：</span></div>
|
||||
<div class="val">{{ detailData?.deviceName }}</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="lable">设备IMEI<span>：</span></div>
|
||||
<div class="val">{{ detailData?.deviceImei }}</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="lable">设备MAC<span>：</span></div>
|
||||
<div class="val">{{ detailData?.deviceMac }}</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="item">
|
||||
<div class="lable">通讯方式<span>：</span></div>
|
||||
<div class="val">{{ detailData?.communicationMode===1 ?'蓝牙':'4G' }}</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="lable">蓝牙名称<span>：</span></div>
|
||||
<div class="val">{{ detailData?.bluetoothName }}</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="lable">设备类型<span>：</span></div>
|
||||
<div class="val">{{ detailData?.typeName }}</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="item">
|
||||
<div class="lable">使用人员<span>：</span></div>
|
||||
<div class="val">{{ detailData?.personnelBy }}</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="lable">设备状态<span>：</span></div>
|
||||
<div class="val">{{ detailData?.deviceStatus===1 ?'正常':'失效' }}</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="lable">绑定时间<span>：</span></div>
|
||||
<div class="val">{{ detailData?.bindingTime }}</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="item">
|
||||
<div class="lable">在线状态<span>：</span></div>
|
||||
<div class="val">{{ detailData?.onlineStatus===1?'在线':'离线' }}</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="lable">电量<span>：</span></div>
|
||||
<div class="val">{{ detailData?.battery }}%</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="lable">告警状态<span>：</span></div>
|
||||
<div class="val">{{ detailData?.alarmStatus=='1'?'告警':'未告警' }}</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="item">
|
||||
<div class="lable">经度<span>：</span></div>
|
||||
<div class="val">{{ detailData?.latitude }}</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="lable">纬度<span>：</span></div>
|
||||
<div class="val">{{ detailData?.longitude }}</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="lable">分享用户数量<span>：</span></div>
|
||||
<div class="val">{{ detailData?.shareUsersNumber }}</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import request from "@/utils/request";
|
||||
import { number } from "vue-types";
|
||||
|
||||
const props = defineProps({
|
||||
data: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
acIndex:{
|
||||
type:Number,
|
||||
required: true
|
||||
}
|
||||
|
||||
})
|
||||
var data=ref({});
|
||||
var detailData = ref({});
|
||||
var deviceid=null;
|
||||
function initData(item) {
|
||||
if(deviceid==item.data.deviceId){
|
||||
return;
|
||||
}
|
||||
deviceid=item.data.deviceId
|
||||
|
||||
detailData.value={};
|
||||
request({
|
||||
url: "/api/device/pc/detail/" + item.data.deviceId,
|
||||
method: 'get'
|
||||
}).then(res => {
|
||||
if (res.code == 200) {
|
||||
if (res.data) {
|
||||
detailData.value = res.data;
|
||||
}
|
||||
}
|
||||
}).finally(() => {
|
||||
data.value=item.data;
|
||||
});
|
||||
|
||||
|
||||
}
|
||||
|
||||
watch(
|
||||
() => props.acIndex, // 监听的属性
|
||||
(newVal) => {
|
||||
if (newVal===1 && props.data) { // 确保参数有效
|
||||
initData(props.data) // 调用回调
|
||||
}
|
||||
},
|
||||
{ immediate: true } // 关键：组件初始化时立即执行一次
|
||||
)
|
||||
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.content {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 30px 12px 12px 12px;
|
||||
|
||||
}
|
||||
|
||||
.leftImg {
|
||||
width: 18%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.leftImg .img {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
object-fit: scale-down;
|
||||
border-radius: 4px;
|
||||
box-shadow: 0px 0px 4px 0px rgba(0, 27, 74, 0.15);
|
||||
background: rgba(247, 248, 252, 1);
|
||||
}
|
||||
|
||||
.detail {
|
||||
width: 82%;
|
||||
|
||||
}
|
||||
|
||||
.detail .row {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
}
|
||||
|
||||
.detail .row .item {
|
||||
width: calc(100% / 3);
|
||||
margin-bottom: 20px;
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
color: rgba(56, 64, 79, 1);
|
||||
|
||||
font-family: Microsoft YaHei;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
|
||||
letter-spacing: 0px;
|
||||
text-align: left;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.detail .row .lable {
|
||||
width: 100px;
|
||||
text-align: right;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.detail .row .val {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.fleft {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.fright {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.clear {
|
||||
clear: both;
|
||||
}
|
||||
</style>
|
||||
File diff suppressed because it is too large
Load Diff
566
src/views/equipmentManagement/devices/shareManage.vue
Normal file
566
src/views/equipmentManagement/devices/shareManage.vue
Normal file
@ -0,0 +1,566 @@
|
||||
<template>
|
||||
<div class="content" v-loading="Status.fullLoading">
|
||||
<div class="topFilter">
|
||||
<div>
|
||||
<el-button type="primary" @click="ShowEdit"
|
||||
><el-icon> <Plus /> </el-icon>添加分享</el-button
|
||||
>
|
||||
<el-button type="danger" @click="DelShare(null, true)" :disabled="selectRows.length === 0">批量删除</el-button>
|
||||
</div>
|
||||
|
||||
<el-form :inline="true" :model="filter" class="demo-form-inline">
|
||||
<el-form-item label="">
|
||||
<el-input v-model="filter.phonenumber" placeholder="查找分享用户" @input="Search">
|
||||
<template #append>
|
||||
<el-button :icon="'Search'" />
|
||||
</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="分享时间">
|
||||
<el-date-picker
|
||||
v-model="filter.Date"
|
||||
type="datetimerange"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
format="YYYY-MM-DD HH:mm:ss"
|
||||
date-format="YYYY/MM/DD ddd"
|
||||
time-format="A hh:mm:ss"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="getRecordList">查询</el-button>
|
||||
<el-button link type="primary" @click="filter.Date = []">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div class="grid" v-loading="Status.loading">
|
||||
<el-table ref="grid" v-loading="Status.loading" border :data="List" height="calc(100vh - 320px)" @selection-change="RowSelectionChange">
|
||||
<el-table-column type="selection" width="50" align="center" />
|
||||
<el-table-column label="分享用户" align="center" prop="phonenumber" />
|
||||
<el-table-column label="分享权限" align="center" prop="permission">
|
||||
<template #default="scope">
|
||||
<div>{{ getPower(scope.row) }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="分享时间" align="center" prop="createTime" />
|
||||
<el-table-column label="操作" align="center" fixed="right" width="280" class-name="small-padding fixed-width opt">
|
||||
<template #default="scope">
|
||||
<div class="center">
|
||||
<el-text class="mx-1 marginRight10" type="primary" @click.stop="powerSet(scope.row)">权限管理</el-text>
|
||||
|
||||
<el-text class="mx-1" type="danger" @click.stop="DelShare(scope.row, false)">移除</el-text>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
v-show="pagin.total > 0"
|
||||
v-model:page="pagin.pageIndex"
|
||||
v-model:limit="pagin.pageSize"
|
||||
:total="pagin.total"
|
||||
@pagination="getRecordList"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<!-- 修改权限弹窗 -->
|
||||
<el-dialog v-model="Status.ShowPowerSet" :title="'权限管理'" width="800" :draggable="true">
|
||||
<div class="form">
|
||||
<el-form :model="cEdit" ref="ruleFormRef" style="max-width: 750px">
|
||||
<el-form-item label="分享权限" label-position="right">
|
||||
<el-checkbox-group v-model="cEdit.permission">
|
||||
<el-checkbox :label="item.label" v-for="item in power" :value="item.value" />
|
||||
</el-checkbox-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="验证码" label-position="right">
|
||||
<el-input v-model="cEdit.smsCode" placeholder="验证码">
|
||||
<template #append
|
||||
><div class="btnSendSms" @click.stop="sendSms">{{ time > 0 ? time + '秒后重发' : '发送验证码' }}</div></template
|
||||
>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div class="center" style="margin-top: 10px">
|
||||
<el-button type="primary" @click="SaveFormData('update')"> 确定 </el-button>
|
||||
<el-button @click="CloseEdit"> 取消 </el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 编辑框 -->
|
||||
<el-dialog v-model="Status.ShowEditPop" :data-val="Status.ShowEditPop" :title="'添加分享'" width="800" :draggable="true">
|
||||
<div class="form">
|
||||
<el-form :model="cEdit" ref="ruleFormRef" style="max-width: 750px" :label-width="'75px'">
|
||||
<el-form-item label="分享用户" label-position="right">
|
||||
<el-select v-model="cEdit.phonenumber" filterable placeholder="输入以搜索">
|
||||
<el-option v-for="item in Usrs" :key="item.phonenumber" :label="item.userName" :value="item.phonenumber" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="分享权限" label-position="right">
|
||||
<el-checkbox-group v-model="cEdit.permission">
|
||||
<el-checkbox :label="item.label" v-for="item in power" :value="item.value" />
|
||||
</el-checkbox-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="验证码" label-position="right">
|
||||
<el-input v-model="cEdit.smsCode" placeholder="验证码">
|
||||
<template #append
|
||||
><div class="btnSendSms" @click.stop="sendSms">{{ time > 0 ? time + '秒后重发' : '发送验证码' }}</div></template
|
||||
>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" label-position="right">
|
||||
<el-input v-model="cEdit.remark" placeholder="请输入备注" type="textarea" show-word-limit :rows="5" maxlength="50" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div class="center" style="margin-top: 10px">
|
||||
<el-button type="primary" @click="SaveFormData('add')"> 确定 </el-button>
|
||||
<el-button @click="CloseEdit()"> 取消 </el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 提示框 -->
|
||||
<el-dialog :width="300" :draggable="true" v-model="Status.confirm.Visible" :title="Status.confirm.title" width="500" center>
|
||||
<span>
|
||||
{{ Status.confirm.text }}
|
||||
</span>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button type="primary" @click="Status.confirm.OkCallback"> 确定 </el-button>
|
||||
<el-button v-show="Status.confirm.showCancel" @click="Status.confirm.cancelCallback">取消</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import request from '@/utils/request';
|
||||
import common from '@/utils/common';
|
||||
import api from '@/api/equipmentManagement/device/shareManage';
|
||||
const props = defineProps({
|
||||
data: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
acIndex: {
|
||||
type: Number,
|
||||
required: true
|
||||
}
|
||||
});
|
||||
|
||||
var filter = ref({
|
||||
Date: [],
|
||||
phonenumber: ''
|
||||
});
|
||||
|
||||
var Status = reactive({
|
||||
loading: false,
|
||||
fullLoading: false,
|
||||
confirm: {
|
||||
//弹出框的配置
|
||||
Visible: false,
|
||||
title: '',
|
||||
text: '',
|
||||
cancelCallback: null,
|
||||
OkCallback: null,
|
||||
showCancel: true
|
||||
},
|
||||
ShowEditPop: false, //是否显示编辑弹窗
|
||||
ShowPowerSet: false //是否显示权限管理
|
||||
});
|
||||
|
||||
var deviceid = null;
|
||||
|
||||
var data = ref({});
|
||||
|
||||
var grid = ref(null);
|
||||
//主数据
|
||||
var List = ref([]);
|
||||
|
||||
//所有用户
|
||||
var Usrs = ref([]);
|
||||
|
||||
var pagin = ref({
|
||||
total: 0,
|
||||
pageIndex: 1,
|
||||
pageSize: 10
|
||||
});
|
||||
|
||||
//当前正在编辑的数据
|
||||
var cEdit = reactive({
|
||||
phonenumber: '',
|
||||
permission: [],
|
||||
remark: '',
|
||||
smsCode: ''
|
||||
});
|
||||
|
||||
//权限字典
|
||||
var dic = reactive({
|
||||
'1': '灯光模式',
|
||||
'2': '激光模式',
|
||||
'3': '开机画面',
|
||||
'4': '人员信息登记',
|
||||
'5': '发送信息',
|
||||
'6': '产品信息'
|
||||
});
|
||||
|
||||
var power = computed(() => {
|
||||
let arr = [];
|
||||
let keys = Object.keys(dic);
|
||||
keys.forEach((key) => {
|
||||
arr.push({ label: dic[key], value: key });
|
||||
});
|
||||
return arr;
|
||||
});
|
||||
//打开编辑
|
||||
function ShowEdit() {
|
||||
Status.ShowEditPop = true;
|
||||
getUsrs();
|
||||
}
|
||||
//关闭编辑
|
||||
function CloseEdit() {
|
||||
Status.ShowEditPop = false;
|
||||
Status.ShowPowerSet = false;
|
||||
}
|
||||
|
||||
//添加分享
|
||||
|
||||
//保存分享数据
|
||||
function SaveFormData(type) {
|
||||
let data = {
|
||||
'deviceId': deviceid,
|
||||
'phonenumber': cEdit.phonenumber,
|
||||
'permission': cEdit.permission.join(','),
|
||||
'shareUser': '',
|
||||
'remark': cEdit.remark,
|
||||
'smsCode': cEdit.smsCode
|
||||
};
|
||||
|
||||
Status.fullLoading = true;
|
||||
api
|
||||
.SaveShare(data, type)
|
||||
.then((res) => {
|
||||
if (res.code == 200) {
|
||||
getRecordList();
|
||||
CloseEdit();
|
||||
}
|
||||
alert(res.msg);
|
||||
})
|
||||
.catch((ex) => {
|
||||
console.log('出现异常', ex);
|
||||
})
|
||||
.finally(() => {
|
||||
Status.fullLoading = false;
|
||||
cEdit.phonenumber = '';
|
||||
cEdit.permission = [];
|
||||
cEdit.remark = '';
|
||||
cEdit.smsCode = '';
|
||||
});
|
||||
}
|
||||
|
||||
function getPower(item) {
|
||||
let str = [];
|
||||
if (item && item.permission) {
|
||||
let arr = item.permission.split(',');
|
||||
|
||||
arr.forEach((k) => {
|
||||
str.push(dic[k]);
|
||||
});
|
||||
}
|
||||
|
||||
return str.join(',');
|
||||
}
|
||||
//批量删除
|
||||
|
||||
var selectRows = computed(() => {
|
||||
let arr = getSelectionRows(grid);
|
||||
return arr;
|
||||
});
|
||||
|
||||
function DelShare(item, isBatch) {
|
||||
let arr = [];
|
||||
if (isBatch) {
|
||||
arr = getSelectionRows(grid);
|
||||
} else {
|
||||
arr = [item];
|
||||
}
|
||||
if (arr.length === 0) {
|
||||
alert('请选择需要删除的数据');
|
||||
return;
|
||||
}
|
||||
debugger;
|
||||
let OkDel = () => {
|
||||
hideConfirm();
|
||||
Status.fullLoading = true;
|
||||
setTimeout(() => {
|
||||
let ids = arr
|
||||
.map((v) => {
|
||||
return v.id;
|
||||
})
|
||||
.join(',');
|
||||
api
|
||||
.DelShare(ids)
|
||||
.then((res) => {
|
||||
if (res.code == 200) {
|
||||
getRecordList();
|
||||
}
|
||||
hideConfirm();
|
||||
alert(res.msg);
|
||||
})
|
||||
.catch((ex) => {
|
||||
console.log('ex=', ex);
|
||||
})
|
||||
.finally(() => {
|
||||
Status.fullLoading = false;
|
||||
});
|
||||
}, 0);
|
||||
};
|
||||
confirm('您确认删除选择的' + arr.length + '条数据吗?', OkDel, hideConfirm, '提示');
|
||||
}
|
||||
|
||||
let timeOut = null;
|
||||
let time = ref(0);
|
||||
let timeIntval = null;
|
||||
function sendSms() {
|
||||
if (time.value > 0) {
|
||||
return;
|
||||
}
|
||||
if (timeIntval) {
|
||||
return;
|
||||
}
|
||||
clearTimeout(timeOut);
|
||||
timeOut = setTimeout(() => {
|
||||
api
|
||||
.sendSms(cEdit.phonenumber)
|
||||
.then((res) => {
|
||||
if (res.code == 200) {
|
||||
console.log('res=', res);
|
||||
time.value = 60;
|
||||
timeIntval = setInterval(() => {
|
||||
time.value = time.value - 1;
|
||||
if (time.value == 0) {
|
||||
clearInterval(timeIntval);
|
||||
timeIntval = null;
|
||||
}
|
||||
}, 1000);
|
||||
}
|
||||
})
|
||||
.catch((ex) => {
|
||||
console.log('ex=', ex);
|
||||
})
|
||||
.finally(() => {});
|
||||
}, 500);
|
||||
}
|
||||
//权限设置
|
||||
function powerSet(item) {
|
||||
debugger;
|
||||
Status.ShowPowerSet = true;
|
||||
cEdit.permission = item.permission.split(',');
|
||||
cEdit.phonenumber = item.phonenumber;
|
||||
cEdit.remark = item.remark;
|
||||
cEdit.smsCode = '123456';
|
||||
}
|
||||
|
||||
function getUsrs() {
|
||||
if (Usrs.value && Usrs.value.length > 0) {
|
||||
return;
|
||||
}
|
||||
api.getUsrs().then((res) => {
|
||||
if (res.code == 200) {
|
||||
Usrs.value = res.rows;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function RowSelectionChange(row) {}
|
||||
var getSelectionRows = (gridInstance) => {
|
||||
if (gridInstance.value) {
|
||||
// 检查ref是否已正确引用组件实例
|
||||
var selectedRows = gridInstance.value.getSelectionRows(); // 获取选中行数据数组
|
||||
return selectedRows;
|
||||
}
|
||||
return [];
|
||||
};
|
||||
|
||||
let searchTime=null;
|
||||
function Search(){
|
||||
clearTimeout(searchTime);
|
||||
searchTime=setTimeout(()=>{
|
||||
getRecordList();
|
||||
},500);
|
||||
}
|
||||
|
||||
function getRecordList() {
|
||||
Status.loading = true;
|
||||
|
||||
setTimeout(() => {
|
||||
initData(props.data, true);
|
||||
}, 0);
|
||||
}
|
||||
|
||||
function initData(item, Refresh) {
|
||||
if (deviceid == item.data.deviceId && !Refresh) {
|
||||
Status.loading = false;
|
||||
return;
|
||||
}
|
||||
debugger;
|
||||
List.value = [];
|
||||
|
||||
deviceid = item.data.deviceId;
|
||||
let params = {
|
||||
deviceId: item.data.deviceId,
|
||||
shareStartTime: '',
|
||||
shareEndTime: '',
|
||||
phonenumber: filter.value.phonenumber,
|
||||
pageSize: pagin.value.pageSize,
|
||||
pageNum: pagin.value.pageIndex,
|
||||
orderByColumn: 'createTime',
|
||||
isAsc: 'descending'
|
||||
};
|
||||
|
||||
if (filter.value.Date && filter.value.Date.length) {
|
||||
params.shareStartTime = common.DateFormat(filter.value.Date[0], null);
|
||||
params.shareEndTime = common.DateFormat(filter.value.Date.length > 1 ? filter.value.Date[1] : '', null);
|
||||
}
|
||||
|
||||
api
|
||||
.searchShare(params)
|
||||
.then((res) => {
|
||||
if (res.code == 200) {
|
||||
if (res.rows) {
|
||||
if (res.rows.length) {
|
||||
List.value = res.rows;
|
||||
}
|
||||
}
|
||||
pagin.value.total = res.total;
|
||||
}
|
||||
})
|
||||
.finally(() => {
|
||||
data.value = item.data;
|
||||
Status.loading = false;
|
||||
});
|
||||
}
|
||||
|
||||
window.confirm = function (text, OK, cancel, title) {
|
||||
let Cfg = {
|
||||
Visible: true,
|
||||
title: title ? title : '提示',
|
||||
text: text ? text : '此操作不可逆，您确定这样做吗？',
|
||||
OkCallback: () => {
|
||||
Status.confirm.Visible = false;
|
||||
if (OK) {
|
||||
OK();
|
||||
}
|
||||
},
|
||||
showCancel: true,
|
||||
cancelCallback: () => {
|
||||
Status.confirm.Visible = false;
|
||||
if (cancel) {
|
||||
cancel();
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
Status.confirm = Cfg;
|
||||
};
|
||||
|
||||
window.alert = function (text, OK, title) {
|
||||
let Cfg = {
|
||||
Visible: true,
|
||||
title: title ? title : '提示',
|
||||
text: text ? text : '不符合规则',
|
||||
OkCallback: () => {
|
||||
Status.confirm.Visible = false;
|
||||
if (OK) {
|
||||
OK();
|
||||
}
|
||||
},
|
||||
showCancel: false,
|
||||
cancelCallback: null
|
||||
};
|
||||
|
||||
Status.confirm = Cfg;
|
||||
};
|
||||
|
||||
var hideConfirm = function () {
|
||||
let Cfg = {
|
||||
Visible: false,
|
||||
title: '提示',
|
||||
text: '',
|
||||
cancelCallback: null,
|
||||
OkCallback: null,
|
||||
showCancel: false
|
||||
};
|
||||
|
||||
Status.confirm = Cfg;
|
||||
};
|
||||
window.hideConfirm = hideConfirm;
|
||||
window.hideAlert = hideConfirm;
|
||||
|
||||
watch(
|
||||
() => props.acIndex, // 监听的属性
|
||||
(newVal) => {
|
||||
if (newVal === 5) {
|
||||
// 确保参数有效
|
||||
|
||||
console.log('newVal=', newVal);
|
||||
getRecordList(); // 调用回调
|
||||
}
|
||||
},
|
||||
{ immediate: true } // 关键：组件初始化时立即执行一次
|
||||
);
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.content {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 30px 12px 12px 12px;
|
||||
}
|
||||
.center {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
align-content: center;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.pickerContent {
|
||||
box-sizing: border-box;
|
||||
border: 1px solid rgba(189, 198, 215, 0.8);
|
||||
border-radius: 2px;
|
||||
}
|
||||
.topFilter {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
align-content: center;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
}
|
||||
:deep .pickerContent .el-date-editor {
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
.marginRight10 {
|
||||
margin-right: 10px;
|
||||
}
|
||||
.mx-1 {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.btnSendSms {
|
||||
background-color: #409eff;
|
||||
color: #ffffff;
|
||||
padding: 0px 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
:deep .el-overlay .el-input-group__append {
|
||||
padding: 0px !important;
|
||||
}
|
||||
|
||||
:deep .topFilter .el-input-group__append {
|
||||
padding: 0px 10px !important;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user