巡检日，周，月完成，数据概况待修改
This commit is contained in:
Zy
@@ -1,5 +1,6 @@
|
||||
<template>
|
||||
<div class="flex flex-col h-full p-2">
|
||||
<Pageheader></Pageheader>
|
||||
<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">
|
||||
|
||||
@@ -27,6 +27,11 @@
|
||||
<el-table v-loading="loading" border :data="electricityDeviceList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="设备编码" align="center" prop="deviceCode" />
|
||||
<el-table-column label="户号" align="center" prop="address">
|
||||
<template #default="{ $index }">
|
||||
{{ huhao + $index }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="设备状态" align="center">
|
||||
<template #default="scope">
|
||||
<DictTag :options="com_waterdevice_on_status" :value="scope.row.status"></DictTag>
|
||||
@@ -63,7 +68,7 @@
|
||||
<span>{{ scope.row.waterRecord ? scope.row.waterRecord.readTime : '--' }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="设备地址" align="center" prop="address" />
|
||||
|
||||
<el-table-column label="操作" align="center" fixed="right">
|
||||
<template #default="scope">
|
||||
<el-button link type="primary" @click="handleProject(scope.row)">生成二维码</el-button>
|
||||
@@ -114,7 +119,7 @@ import {
|
||||
} from '@/api/system/SdbElectricityDevice/index';
|
||||
import { ElectricityDeviceVO, ElectricityDeviceQuery, ElectricityDeviceForm } from '@/api/system/SdbElectricityDevice/type';
|
||||
import { splitImages } from '@/utils';
|
||||
|
||||
const huhao = 9649998338;
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
const { com_waterdevice_on_status } = toRefs<any>(proxy?.useDict('com_waterdevice_on_status'));
|
||||
const { com_electricity_readrecord_status } = toRefs<any>(proxy?.useDict('com_electricity_readrecord_status'));
|
||||
|
||||
@@ -27,7 +27,11 @@
|
||||
<el-table v-loading="loading" border :data="waterDeviceList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="水表设备编码" align="center" prop="deviceCode" />
|
||||
<el-table-column label="地址" align="center" prop="address" />
|
||||
<el-table-column label="户号" align="center" prop="address">
|
||||
<template #default="{ $index }">
|
||||
{{ huhao + $index }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="设备状态" align="center" prop="deleted">
|
||||
<template #default="scope">
|
||||
<dict-tag :options="com_waterdevice_on_status" :value="scope.row.deleted"></dict-tag>
|
||||
@@ -95,6 +99,8 @@
|
||||
import { listWaterDevice, getWaterDevice, delWaterDevice, addWaterDevice, updateWaterDevice } from '@/api/system/SdbWaterDevice/index';
|
||||
import { WaterDeviceVO, WaterDeviceQuery, WaterDeviceForm } from '@/api/system/SdbWaterDevice/type';
|
||||
|
||||
const huhao = 3096371295;
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
const { com_waterdevice_on_status } = toRefs<any>(proxy?.useDict('com_waterdevice_on_status'));
|
||||
|
||||
|
||||
@@ -21,7 +21,7 @@
|
||||
</div>
|
||||
</template>
|
||||
</PageHeader>
|
||||
<div class="houseBody mt-10px w-full flex align-center justify-center">
|
||||
<div class="houseBody w-full flex align-center justify-center">
|
||||
<building></building>
|
||||
<unit></unit>
|
||||
</div>
|
||||
@@ -51,6 +51,7 @@ houseStore.initHouse(houseStore.buildingtype);
|
||||
min-height: calc(100vh - 84px);
|
||||
.houseBody {
|
||||
height: calc(100% - 200px);
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
.houseAdressBox {
|
||||
|
||||
@@ -1,12 +1,110 @@
|
||||
<template>
|
||||
<div class="p-2 h-full flex flex-col">
|
||||
<div class="h-full flex flex-col p-2">
|
||||
<Pageheader></Pageheader>
|
||||
<div class="flex-1 color-gray flex h-full font-size-6 flex-center">系统还在维护中，敬请期待...</div>
|
||||
<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" :model="queryParams" :inline="true">
|
||||
<el-form-item label="选择日期" prop="statDate">
|
||||
<el-date-picker
|
||||
v-model="starDate"
|
||||
type="daterange"
|
||||
unlink-panels
|
||||
range-separator="到"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
format="YYYY/MM/DD"
|
||||
value-format="YYYY/MM/DD"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
<el-card class="flex-1" shadow="never">
|
||||
<template #header>
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="1.5">
|
||||
<span style="font-size: 1.2rem">日报列表</span>
|
||||
</el-col>
|
||||
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
</template>
|
||||
|
||||
<el-table v-loading="loading" border :data="itemList">
|
||||
<el-table-column label="日期" width="100" align="center" prop="statDate" />
|
||||
<el-table-column label="计划巡检任务" width="120" align="center" prop="totalPlans" />
|
||||
<el-table-column label="按时完成" align="center" prop="completedTasks" />
|
||||
<el-table-column label="超时完成" align="center" prop="outCompletedTasks" />
|
||||
<el-table-column label="超时未完成" align="center" prop="outUncompletedTasks" />
|
||||
<el-table-column label="进行中" align="center" prop="activeTask" />
|
||||
<el-table-column label="未开始" align="center" prop="pendingTask" />
|
||||
</el-table>
|
||||
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
<script setup name="Item" lang="ts">
|
||||
import { listItem, type Request } from '@/api/system/Inspection/index';
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
|
||||
const itemList = ref<any[]>([]);
|
||||
const loading = ref(true);
|
||||
const showSearch = ref(true);
|
||||
const total = ref(0);
|
||||
|
||||
const queryFormRef = ref<ElFormInstance>();
|
||||
|
||||
const data = reactive<{
|
||||
queryParams: Request;
|
||||
}>({
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
statDate: '',
|
||||
dataType: '1' // 1 日报
|
||||
}
|
||||
});
|
||||
const starDate = ref([]);
|
||||
const { queryParams } = toRefs(data);
|
||||
|
||||
/** 查询巡检项目列表 */
|
||||
const getList = async () => {
|
||||
queryParams.value.statDate = starDate.value.join('-');
|
||||
loading.value = true;
|
||||
const res = await listItem(queryParams.value);
|
||||
itemList.value = res.rows;
|
||||
total.value = res.total;
|
||||
loading.value = false;
|
||||
};
|
||||
|
||||
/** 搜索按钮操作 */
|
||||
const handleQuery = () => {
|
||||
queryParams.value.pageNum = 1;
|
||||
getList();
|
||||
};
|
||||
|
||||
/** 重置按钮操作 */
|
||||
const resetQuery = () => {
|
||||
queryFormRef.value?.resetFields();
|
||||
starDate.value = [];
|
||||
handleQuery();
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
getList();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss"></style>
|
||||
<style lang="scss" scoped>
|
||||
.el-table {
|
||||
height: calc(100% - 80px);
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,12 +1,110 @@
|
||||
<template>
|
||||
<div class="p-2 h-full flex flex-col">
|
||||
<div class="h-full flex flex-col p-2">
|
||||
<Pageheader></Pageheader>
|
||||
<div class="flex-1 color-gray flex h-full font-size-6 flex-center">系统还在维护中，敬请期待...</div>
|
||||
<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" :model="queryParams" :inline="true">
|
||||
<el-form-item label="选择日期" prop="itemName">
|
||||
<el-date-picker
|
||||
v-model="starDate"
|
||||
type="daterange"
|
||||
unlink-panels
|
||||
range-separator="到"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
format="YYYY/MM/DD"
|
||||
value-format="YYYY/MM/DD"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
<el-card class="flex-1" shadow="never">
|
||||
<template #header>
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="1.5">
|
||||
<span style="font-size: 1.2rem">月报列表</span>
|
||||
</el-col>
|
||||
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
</template>
|
||||
|
||||
<el-table v-loading="loading" border :data="itemList">
|
||||
<el-table-column label="日期" width="100" align="center" prop="statDate" />
|
||||
<el-table-column label="计划巡检任务" width="120" align="center" prop="totalPlans" />
|
||||
<el-table-column label="按时完成" align="center" prop="completedTasks" />
|
||||
<el-table-column label="超时完成" align="center" prop="outCompletedTasks" />
|
||||
<el-table-column label="超时未完成" align="center" prop="outUncompletedTasks" />
|
||||
<el-table-column label="进行中" align="center" prop="activeTask" />
|
||||
<el-table-column label="未开始" align="center" prop="pendingTask" />
|
||||
</el-table>
|
||||
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
<script setup name="Item" lang="ts">
|
||||
import { listItem, type Request } from '@/api/system/Inspection/index';
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
|
||||
const itemList = ref<any[]>([]);
|
||||
const loading = ref(true);
|
||||
const showSearch = ref(true);
|
||||
const total = ref(0);
|
||||
|
||||
const queryFormRef = ref<ElFormInstance>();
|
||||
|
||||
const starDate = ref([]);
|
||||
const data = reactive<{
|
||||
queryParams: Request;
|
||||
}>({
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
dataType: '3' // 1 日报 3 月报
|
||||
}
|
||||
});
|
||||
|
||||
const { queryParams } = toRefs(data);
|
||||
|
||||
/** 查询巡检项目列表 */
|
||||
const getList = async () => {
|
||||
queryParams.value.statDate = starDate.value.join('-');
|
||||
loading.value = true;
|
||||
const res = await listItem(queryParams.value);
|
||||
itemList.value = res.rows;
|
||||
total.value = res.total;
|
||||
loading.value = false;
|
||||
};
|
||||
|
||||
/** 搜索按钮操作 */
|
||||
const handleQuery = () => {
|
||||
queryParams.value.pageNum = 1;
|
||||
getList();
|
||||
};
|
||||
|
||||
/** 重置按钮操作 */
|
||||
const resetQuery = () => {
|
||||
queryFormRef.value?.resetFields();
|
||||
starDate.value = [];
|
||||
handleQuery();
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
getList();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss"></style>
|
||||
<style lang="scss" scoped>
|
||||
.el-table {
|
||||
height: calc(100% - 80px);
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,13 +1,367 @@
|
||||
<template>
|
||||
<div class="p-2 h-full flex flex-col">
|
||||
<PageHeader></PageHeader>
|
||||
<div class="flex-1 color-gray flex h-full font-size-6 flex-center">系统还在维护中，敬请期待...</div>
|
||||
<div class="h-full flex flex-col p-2">
|
||||
<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">
|
||||
<div>
|
||||
<div class="flex flex-items-center justify-between">
|
||||
<div>
|
||||
<div class="line"></div>
|
||||
<div class="metatitle">巡更数据概况</div>
|
||||
</div>
|
||||
<div class="rightSearch flex flex-items-center justify-around">
|
||||
<div>选择日期</div>
|
||||
<el-date-picker
|
||||
v-model="statDate"
|
||||
value-format="YYYY/MM/DD"
|
||||
format="YYYY/MM/DD"
|
||||
@update:model-value="handleStateDate"
|
||||
type="date"
|
||||
placeholder="选择日期"
|
||||
:disabled-date="disabledDate"
|
||||
/>
|
||||
<i @click="handleQueryDay(0)">今日</i>
|
||||
<i @click="handleQueryDay(1)">昨日</i>
|
||||
<i @click="handleQueryDay(7)">近7天</i>
|
||||
<i @click="handleQueryDay(30)">近30日</i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="overviewBox">
|
||||
<el-card v-for="(item, index) in list" :key="index">
|
||||
<div class="overviewitem">
|
||||
<div class="overviewitem_name">{{ item.name }}</div>
|
||||
<div class="overviewitem_value">{{ item.value }}</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
<el-card class="flex-1" shadow="never">
|
||||
<template #header>
|
||||
<span style="font-size: 1.2rem">数据统计 </span>
|
||||
</template>
|
||||
<el-row :gutter="10" class="h-full">
|
||||
<el-col :span="10">
|
||||
<div class="echartsbox flex h-full flex-col">
|
||||
<div class="echartsactions">
|
||||
<div
|
||||
@click="handleEcartsData(item)"
|
||||
:class="{ active: activeEchartsindex === item.key }"
|
||||
class="echartsactions_item"
|
||||
v-for="(item, index) in ecartslist"
|
||||
:key="index"
|
||||
>
|
||||
{{ item.name }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="echartsbody flex-1">
|
||||
<EchartsCompontent :options="options"></EchartsCompontent>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="14">
|
||||
<el-table v-loading="loading" border :data="itemList">
|
||||
<el-table-column label="日期" width="100" align="center" prop="statDate" />
|
||||
<el-table-column label="计划巡检任务" width="120" align="center" prop="totalPlans" />
|
||||
<el-table-column label="按时完成" align="center" prop="completedTasks" />
|
||||
<el-table-column label="超时完成" align="center" prop="outCompletedTasks" />
|
||||
<el-table-column label="超时未完成" align="center" prop="outUncompletedTasks" />
|
||||
<el-table-column label="进行中" align="center" prop="activeTask" />
|
||||
<el-table-column label="未开始" align="center" prop="pendingTask" />
|
||||
</el-table>
|
||||
<pagination
|
||||
v-show="total > 0"
|
||||
:total="total"
|
||||
v-model:page="queryParams.pageNum"
|
||||
v-model:limit="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
import PageHeader from '@/components/Pageheader/index.vue';
|
||||
<script setup name="Item" lang="ts">
|
||||
import EchartsCompontent from '@/components/Echarts/index.vue';
|
||||
import { listItem, type Request } from '@/api/system/Inspection/index';
|
||||
import { getNaturalDayDiff, getLast7Days, getLastNDays, diffDays, formatDate } from '@/utils/time';
|
||||
import { EChartsOption } from 'echarts';
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
|
||||
const itemList = ref<any[]>([]);
|
||||
const loading = ref(true);
|
||||
const showSearch = ref(true);
|
||||
const total = ref(0);
|
||||
|
||||
const queryFormRef = ref<ElFormInstance>();
|
||||
const disabledDate = (time: Date) => {
|
||||
return time.getTime() > Date.now();
|
||||
};
|
||||
const statDate = ref('');
|
||||
const data = reactive<{
|
||||
queryParams: Request;
|
||||
}>({
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
statDate: '',
|
||||
dataType: '0' // 0 总览 1 日报 3 月报
|
||||
}
|
||||
});
|
||||
|
||||
const list = ref([
|
||||
{
|
||||
name: '计划数量',
|
||||
key: 'totalPlans',
|
||||
value: 20
|
||||
},
|
||||
{
|
||||
name: '任务数量',
|
||||
key: 'totalPlans',
|
||||
value: 200
|
||||
},
|
||||
{
|
||||
name: '任务完成数量',
|
||||
key: 'UncompletedTasks',
|
||||
value: 40
|
||||
},
|
||||
{
|
||||
name: ' 完成率',
|
||||
key: 'onTimeRateDisplay',
|
||||
value: '20%'
|
||||
},
|
||||
{
|
||||
name: '未完成数量',
|
||||
key: 'outUncompletedTasks',
|
||||
value: 40
|
||||
}
|
||||
]);
|
||||
|
||||
// ! echarts =================================================================
|
||||
|
||||
const activeEchartsindex = ref('totalTasks');
|
||||
const ecartslist = ref([
|
||||
{
|
||||
name: '全部任务',
|
||||
key: 'totalTasks',
|
||||
color: '#1a75ff',
|
||||
offsetbottomColor: '#f2f9ff'
|
||||
},
|
||||
{
|
||||
name: '按时完成',
|
||||
key: 'completedTasks',
|
||||
color: '#42b983',
|
||||
offsetbottomColor: '#c6eada'
|
||||
},
|
||||
{
|
||||
name: '超时未完成',
|
||||
key: 'outUncompletedTasks',
|
||||
color: '#f83333',
|
||||
offsetbottomColor: '#fed6d6'
|
||||
},
|
||||
{
|
||||
name: '进行中',
|
||||
key: 'activeTask',
|
||||
color: '#9d33f8',
|
||||
offsetbottomColor: '#ebd6fe'
|
||||
},
|
||||
{
|
||||
name: '未开始',
|
||||
key: 'pendingTask',
|
||||
color: '#909399',
|
||||
offsetbottomColor: 'rgb(233, 233, 235)'
|
||||
}
|
||||
]);
|
||||
const options = computed<EChartsOption>(() => ({
|
||||
grid: {
|
||||
left: '1%',
|
||||
right: '1%',
|
||||
top: '10%',
|
||||
bottom: '1%',
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: { data: xAxislist.value },
|
||||
yAxis: { type: 'value' as const },
|
||||
tooltip: { trigger: 'axis' as const },
|
||||
series: activeSeries.value // 动态系列
|
||||
}));
|
||||
//
|
||||
const diffday = ref(0);
|
||||
const activeSeries = ref();
|
||||
const xAxislist = ref([]);
|
||||
function handleEcartsOptions(data, name, colorlist = ['#1a75ff', '#f2f9ff']) {
|
||||
const obj = {
|
||||
data: data,
|
||||
type: 'line' as const,
|
||||
smooth: true,
|
||||
name: name,
|
||||
areaStyle: {
|
||||
color: {
|
||||
type: 'linear',
|
||||
x: 0,
|
||||
y: 0,
|
||||
x2: 0,
|
||||
y2: 1, // 从上到下渐变
|
||||
colorStops: colorlist.map((item, index) => {
|
||||
return {
|
||||
offset: index / colorlist.length,
|
||||
color: item
|
||||
};
|
||||
})
|
||||
}
|
||||
},
|
||||
lineStyle: {
|
||||
color: colorlist[0]
|
||||
},
|
||||
itemStyle: {
|
||||
color: colorlist[0]
|
||||
},
|
||||
label: {
|
||||
show: true,
|
||||
color: colorlist[0],
|
||||
position: 'top'
|
||||
}
|
||||
};
|
||||
activeSeries.value = obj;
|
||||
}
|
||||
|
||||
function handleEcartsData(row: (typeof ecartslist.value)[number]) {
|
||||
if (row) {
|
||||
xAxislist.value = [];
|
||||
// 避免修改原数组，创建副本排序
|
||||
const sortedList = [...itemList.value].sort((a, b) => new Date(a.statDate).getTime() - new Date(b.statDate).getTime());
|
||||
console.log(sortedList);
|
||||
// 创建日期到值的映射，标准化日期格式（假设 statDate 为 '2024-04-16 00:00:00'，截取前10位）
|
||||
const dataMap = new Map<string, number>();
|
||||
sortedList.forEach((item) => {
|
||||
const dateKey = item.statDate.split(' ')[0]; // 截取 'YYYY-MM-DD'
|
||||
dataMap.set(dateKey, Number(item[row.key]) || 0); // 确保为数字
|
||||
});
|
||||
|
||||
// 根据 x 轴日期生成数据数组
|
||||
console.log(diffday.value);
|
||||
const xAxisDates = getLastNDays(diffday.value, undefined, 'YYYY.MM.DD'); // 确保格式为 ['2024-04-16', ...]
|
||||
const arr = xAxisDates.map((date) => dataMap.get(date) || 0);
|
||||
xAxislist.value = xAxisDates;
|
||||
|
||||
console.log('xAxisDates:', xAxisDates); // 调试
|
||||
console.log('dataMap:', dataMap); // 调试
|
||||
console.log('arr:', arr); // 调试
|
||||
|
||||
activeSeries.value = null;
|
||||
handleEcartsOptions(arr, row.name, [row.color, row.offsetbottomColor]);
|
||||
}
|
||||
}
|
||||
|
||||
function handleStateDate(val) {
|
||||
console.log(diffDays(val));
|
||||
diffday.value = diffDays(val);
|
||||
queryParams.value.statDate = `${formatDate(new Date(val), 'YYYY/MM/DD')}-${formatDate(new Date(), 'YYYY/MM/DD')}`;
|
||||
getList();
|
||||
}
|
||||
// ! echarts =================================================================
|
||||
|
||||
const day = 1000 * 60 * 60 * 24;
|
||||
function handleQueryDay(val: number) {
|
||||
const newday = new Date(); // 当前日期
|
||||
const time = new Date(newday.getTime() - val * day); // 指定日期
|
||||
console.log(time, newday);
|
||||
diffday.value = val; // 差值
|
||||
diffday.value = getNaturalDayDiff(time, newday);
|
||||
queryParams.value.statDate = formatDate(time, 'YYYY/MM/DD');
|
||||
getList();
|
||||
}
|
||||
|
||||
const { queryParams } = toRefs(data);
|
||||
|
||||
/** 查询巡检项目列表 */
|
||||
const getList = async () => {
|
||||
loading.value = true;
|
||||
const res = await listItem(queryParams.value);
|
||||
itemList.value = res.rows;
|
||||
handleEcartsData(ecartslist.value[0]);
|
||||
total.value = res.total;
|
||||
loading.value = false;
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
// getList();
|
||||
handleQueryDay(7);
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss"></style>
|
||||
<style lang="scss" scoped>
|
||||
.el-table {
|
||||
height: calc(100% - 80px);
|
||||
}
|
||||
|
||||
.rightSearch {
|
||||
div {
|
||||
width: 60px;
|
||||
}
|
||||
i {
|
||||
margin: 0 10px;
|
||||
display: block;
|
||||
padding: 5px 5px;
|
||||
font-style: normal;
|
||||
&:hover {
|
||||
color: #409eff;
|
||||
}
|
||||
}
|
||||
}
|
||||
.overviewBox {
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-top: 40px;
|
||||
.overviewitem {
|
||||
min-width: 150px;
|
||||
padding: 5px -5px;
|
||||
|
||||
.overviewitem_name {
|
||||
color: rgba(102, 102, 102, 1);
|
||||
font-size: 12px;
|
||||
}
|
||||
.overviewitem_value {
|
||||
color: rgba(51, 51, 51, 1);
|
||||
font-size: 24px;
|
||||
font-weight: 500;
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.echartsbox {
|
||||
.echartsactions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 20px;
|
||||
.echartsactions_item {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
width: 100px;
|
||||
text-align: center;
|
||||
border: 1px solid rgba(220, 223, 230, 1);
|
||||
color: rgba(16, 16, 16, 1);
|
||||
border-left: none;
|
||||
&:first-of-type {
|
||||
border-radius: 4px 0px 0px 0px;
|
||||
border-left: 1px solid rgba(220, 223, 230, 1);
|
||||
}
|
||||
|
||||
&:last-of-type {
|
||||
border-radius: 0px 4px 0px 0px;
|
||||
}
|
||||
&.active {
|
||||
color: #fff;
|
||||
background-color: rgba(26, 117, 255, 1);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -10,24 +10,6 @@
|
||||
<el-form-item label="巡检计划名称" prop="planName">
|
||||
<el-input v-model="form.planName" placeholder="请输入"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="巡检人员" prop="inspectorIds">
|
||||
<div class="inspectorIdsBox">
|
||||
<div v-for="(item, index) in checkoutUserlist" :key="index" class="inspector_items">
|
||||
<div class="name">{{ item.nickName }}</div>
|
||||
<i @click="handleDelete" class="deleteaction">
|
||||
<el-icon><Delete /></el-icon>
|
||||
</i>
|
||||
</div>
|
||||
<RepairUser @change="handleUserChange" returnvalue="*" :is-multiple="true" user-type="inspection" ref="RepairUserRef">
|
||||
<template #default>
|
||||
<div @click="handleAddUser" class="inspector_items add flex flex-items-center justify-center">
|
||||
<el-icon><Plus /></el-icon>
|
||||
<span class="ml-10px"> 添加 </span>
|
||||
</div>
|
||||
</template>
|
||||
</RepairUser>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="执行周期">
|
||||
<el-date-picker
|
||||
@update:model-value="handleTime"
|
||||
|
||||
@@ -38,7 +38,6 @@
|
||||
<el-table v-loading="loading" border :data="planList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="巡检计划名称" align="center" prop="planName" />
|
||||
<el-table-column label="巡检人员" align="center" prop="inspectorNames" show-overflow-tooltip />
|
||||
<el-table-column label="执行周期" align="center" prop="executeCycle" />
|
||||
<el-table-column label="执行星期" align="center">
|
||||
<template #default="scope">
|
||||
@@ -146,7 +145,6 @@ const getList = async () => {
|
||||
planList.value = res.rows;
|
||||
planList.value.forEach((item) => {
|
||||
item.routeNames = item.routeList.map((item) => item.routeName).join(',');
|
||||
item.inspectorNames = item.inspectorList.map((item2) => item2.nickName).join(',');
|
||||
item.executeDayNames = item.executeDay
|
||||
.split(',')
|
||||
.sort((a, b) => Number(a) - Number(b))
|
||||
|
||||
@@ -74,7 +74,18 @@ const router = useRouter();
|
||||
const route = useRoute();
|
||||
|
||||
const formRef = ref();
|
||||
const form = ref<RecordVO>();
|
||||
const form = ref<RecordVO>({
|
||||
taskName: '',
|
||||
inspectorName: '',
|
||||
planName: '',
|
||||
actualStartTime: '',
|
||||
actualEndTime: '',
|
||||
statusLabel: '',
|
||||
createByName: '',
|
||||
details: [],
|
||||
createTime: '',
|
||||
updateTime: ''
|
||||
});
|
||||
const userid = ref(null);
|
||||
if (route.query.id) {
|
||||
userid.value = route.query.id;
|
||||
|
||||
@@ -170,7 +170,7 @@ const router = useRouter();
|
||||
/** 新增按钮操作 */
|
||||
const handleAdd = () => {
|
||||
router.push({
|
||||
path: '/Inspection/InspectionRecordMain'
|
||||
path: '/Inspection/RecordMain'
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
12
src/views/system/inspection/Record/index3.vue
Normal file
12
src/views/system/inspection/Record/index3.vue
Normal file
@@ -0,0 +1,12 @@
|
||||
<template>
|
||||
<div class="p-2 h-full flex flex-col">
|
||||
<Pageheader></Pageheader>
|
||||
<div class="flex-1 color-gray flex h-full font-size-6 flex-center">系统还在维护中，敬请期待...</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss"></style>
|
||||
354
src/views/system/inspection/Task/addTask.vue
Normal file
354
src/views/system/inspection/Task/addTask.vue
Normal file
@@ -0,0 +1,354 @@
|
||||
<template>
|
||||
<div class="p-2">
|
||||
<PageHeader></PageHeader>
|
||||
<div class="EditBody">
|
||||
<div class="title">
|
||||
<div>基本信息</div>
|
||||
</div>
|
||||
<div class="bodybox">
|
||||
<el-form ref="formRef" :model="form" :rules="rules" label-width="120px" label-position="right">
|
||||
<el-form-item label="任务名称" prop="taskName">
|
||||
<el-input v-model="form.taskName" placeholder="请输入"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="巡检人员" prop="inspectorIds">
|
||||
<div class="inspectorIdsBox">
|
||||
<div v-for="(item, index) in checkoutUserlist" :key="index" class="inspector_items">
|
||||
<div class="name">{{ item.nickName }}</div>
|
||||
<i @click="handleDelete" class="deleteaction">
|
||||
<el-icon><Delete /></el-icon>
|
||||
</i>
|
||||
</div>
|
||||
<RepairUser @change="handleUserChange" returnvalue="*" :is-multiple="true" user-type="inspection" ref="RepairUserRef">
|
||||
<template #default>
|
||||
<div @click="handleAddUser" class="inspector_items add flex flex-items-center justify-center">
|
||||
<el-icon><Plus /></el-icon>
|
||||
<span class="ml-10px"> 添加 </span>
|
||||
</div>
|
||||
</template>
|
||||
</RepairUser>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="巡更日期" prop="taskTime">
|
||||
<el-date-picker placeholder="年/月/日" v-model="form.taskTime" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
|
||||
</el-form-item>
|
||||
<el-form-item label="提醒时间" prop="remindTime">
|
||||
<el-select v-model="form.remindTime" placeholder="请选择" style="width: 100%">
|
||||
<el-option v-for="item in remindTimeoptions" :key="item.value" :label="item.label" :value="item.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="巡检设置">
|
||||
<el-checkbox-group @change="handleChagneSetting" v-model="Settinglist">
|
||||
<el-checkbox v-for="(item, index) in com_inspection_plan_setting" :key="index" :label="item.label" :value="item.value" />
|
||||
</el-checkbox-group>
|
||||
</el-form-item> -->
|
||||
<el-form-item label="关联计划" props="planId">
|
||||
<el-select @change="handlChangeMap" v-model="form.planId" placeholder="请选择" style="width: 100%">
|
||||
<el-option v-for="item in planlist" :key="item.id" :label="item.planName" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="计划路线" props="planId">
|
||||
<div class="mapbox" v-loading="maploading">
|
||||
<div class="w-full h-full" id="TaskMapBox"></div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="submit">提交</el-button>
|
||||
<el-button @click="routeback">返回</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import RepairUser from '@/components/Holder/repairUser.vue';
|
||||
import PageHeader from '@/components/Pageheader/index.vue';
|
||||
import { Delete } from '@element-plus/icons-vue';
|
||||
import { ref } from 'vue';
|
||||
import AMapLoader from '@amap/amap-jsapi-loader';
|
||||
import { addPlan, getPlan, listPlan, updatePlan } from '@/api/system/InspectionPlan';
|
||||
import { addTask, getTask, updateTask } from '@/api/system/InspectionTask';
|
||||
import { getRoute, listRoute } from '@/api/system/InspectionRoute';
|
||||
import { RouteVO } from '@/api/system/InspectionRoute/type';
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
const { com_inspection_plan_setting } = toRefs<any>(proxy?.useDict('com_inspection_plan_setting'));
|
||||
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
|
||||
const form = ref({
|
||||
id: null,
|
||||
taskName: '', // 巡检计划名称
|
||||
inspectorId: '', // 巡检人员
|
||||
taskTime: '', // 执行日期
|
||||
remindTime: '', // 提醒时间
|
||||
planId: '' // 计划路线id
|
||||
});
|
||||
const rules = ref({
|
||||
taskName: [{ required: true, message: '请输入巡检任务名称', trigger: 'blur' }],
|
||||
taskTime: [{ required: true, message: '请选择巡检任务时间', trigger: 'blur' }],
|
||||
remindTime: [{ required: true, message: '请选择巡检任务提醒时间', trigger: 'blur' }],
|
||||
inspectorIds: [{ required: true, message: '请选择巡检人员', trigger: 'blur' }],
|
||||
planId: [{ required: true, message: '请选择巡检计划', trigger: 'blur' }]
|
||||
});
|
||||
|
||||
// 提醒时间
|
||||
const remindTimeoptions = ref([
|
||||
{
|
||||
value: 10,
|
||||
label: '任务开始前10分钟'
|
||||
},
|
||||
{
|
||||
value: 15,
|
||||
label: '任务开始前15分钟'
|
||||
},
|
||||
{
|
||||
value: 20,
|
||||
label: '任务开始前30分钟'
|
||||
}
|
||||
]);
|
||||
|
||||
// 巡检计划id
|
||||
const editid = ref(null);
|
||||
|
||||
// 初始化
|
||||
// 路线列表
|
||||
const planlist = ref([]);
|
||||
async function init() {
|
||||
// 获取 路线 列表
|
||||
const res = await listPlan();
|
||||
planlist.value = res.rows;
|
||||
if (route.query.id) {
|
||||
editid.value = route.query.id;
|
||||
getTask(editid.value).then((res) => {
|
||||
form.value = {
|
||||
id: res.data.id,
|
||||
taskName: res.data.taskName, // 巡检计划名称
|
||||
inspectorIds: res.data.inspectorIds, // 巡检人员
|
||||
remindTime: res.data.remindTime, // 提醒时间
|
||||
routeIds: res.data.routeIds // 计划路线id
|
||||
};
|
||||
handlChangeMap(res.data.routeIds);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
init();
|
||||
|
||||
// 选择 巡检人员
|
||||
const RepairUserRef = ref<InstanceType<typeof RepairUser>>();
|
||||
function handleAddUser() {
|
||||
RepairUserRef.value.open();
|
||||
}
|
||||
const checkoutUserlist = ref([]);
|
||||
function handleUserChange(val) {
|
||||
checkoutUserlist.value = val;
|
||||
}
|
||||
function handleDelete(id) {
|
||||
checkoutUserlist.value = checkoutUserlist.value.filter((item) => item.userId !== id);
|
||||
}
|
||||
|
||||
// 返回
|
||||
function routeback() {
|
||||
router.back();
|
||||
}
|
||||
|
||||
const AMapLib = ref(null);
|
||||
const map = ref(null);
|
||||
const mapReady = ref(false);
|
||||
|
||||
const maploading = ref(false);
|
||||
// 地图覆盖物
|
||||
const markerlist = [];
|
||||
|
||||
// 选择计划f
|
||||
function handlChangeMap(val: string) {
|
||||
// 清楚 覆盖物
|
||||
if (markerlist.length > 0) {
|
||||
map.value.remove(markerlist);
|
||||
}
|
||||
if (val) {
|
||||
// 查找计划id
|
||||
const find = planlist.value.find((item) => item.id === val);
|
||||
if (find) {
|
||||
const route = find.routeList.pop();
|
||||
// 查找路线
|
||||
getRoute(route.id).then((res) => {
|
||||
handleRoute(res.data);
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 处理 巡检路线 巡检点数据
|
||||
function handleRoute(route: RouteVO) {
|
||||
maploading.value = true;
|
||||
// ! 添加点
|
||||
if (route.points && route.points.length > 0) {
|
||||
route.points.forEach((item, index) => {
|
||||
const lnglat = item.location.split(',').map(Number);
|
||||
const marker = new AMapLib.value.Marker({
|
||||
position: new AMapLib.value.LngLat(lnglat[0], lnglat[1]), //经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9]
|
||||
title: item.pointName,
|
||||
content: `
|
||||
<div style="display:flex;align-items:center;justify-content:center;width:30px;height:30px;line-height:18px;border-radius:50%;background-color:rgba(26,117,255,0.3);">
|
||||
<div
|
||||
style=" width: 20px;
|
||||
border-radius: 50%;
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
background-color: rgba(26,117,255,1);
|
||||
color: #ffffff;
|
||||
font-size: 20px;
|
||||
text-align: center;"
|
||||
>${index + 1}</div>
|
||||
</div>`
|
||||
});
|
||||
//将创建的点标记添加到已有的地图实例：
|
||||
map.value.add(marker);
|
||||
markerlist.push(marker);
|
||||
});
|
||||
}
|
||||
// ! 添加路线
|
||||
if (route.pathPoints && typeof route.pathPoints === 'string') {
|
||||
const path = JSON.parse(route.pathPoints);
|
||||
console.log(path);
|
||||
//创建 Polyline 实例
|
||||
const polyline = new AMapLib.value.Polyline({
|
||||
path: path,
|
||||
strokeWeight: 2, //线条宽度
|
||||
strokeColor: 'red', //线条颜色
|
||||
lineJoin: 'round' //折线拐点连接处样式
|
||||
});
|
||||
map.value.add(polyline);
|
||||
markerlist.push(polyline);
|
||||
}
|
||||
|
||||
// 自动 适应 范围
|
||||
map.value.setFitView();
|
||||
maploading.value = false;
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
await nextTick();
|
||||
window._AMapSecurityConfig = { securityJsCode: '09534b3534d8da53968529a9ce164118' };
|
||||
AMapLoader.load({
|
||||
key: '8e302fe1be5f4db62bc734db23dca149',
|
||||
version: '2.0',
|
||||
plugins: ['AMap.Scale', 'AMap.Marker']
|
||||
}).then(async (AMap) => {
|
||||
AMapLib.value = AMap;
|
||||
map.value = new AMap.Map('TaskMapBox', {
|
||||
viewMode: '3D',
|
||||
zoom: 11,
|
||||
center: [116.397428, 39.90923]
|
||||
});
|
||||
mapReady.value = true;
|
||||
});
|
||||
});
|
||||
const formRef = ref();
|
||||
function submit() {
|
||||
form.value.inspectorId = checkoutUserlist.value.map((item) => item.userId).join(',');
|
||||
formRef.value?.validate(async (valid: boolean) => {
|
||||
if (valid) {
|
||||
if (editid.value) {
|
||||
updateTask(form.value).then(() => {
|
||||
ElMessage.success('编辑成功');
|
||||
routeback();
|
||||
});
|
||||
} else {
|
||||
addTask(form.value).then(() => {
|
||||
ElMessage.success('添加成功');
|
||||
routeback();
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.EditBody {
|
||||
margin-top: 20px;
|
||||
padding: 30px;
|
||||
background-color: white;
|
||||
.bodybox {
|
||||
width: 600px;
|
||||
margin: 0 auto;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.inspectorIdsBox {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
.inspector_items {
|
||||
width: 120px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
margin: 5px;
|
||||
text-align: center;
|
||||
border-radius: 5px;
|
||||
background-color: #ddeaff;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0 2px;
|
||||
.name {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
text-wrap: nowrap;
|
||||
}
|
||||
&.add {
|
||||
background-color: #ddeaff25;
|
||||
border: 1px dashed #ccc;
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
background-color: rgba(221, 234, 255, 0.199);
|
||||
border-color: #44a0ff;
|
||||
color: #44a0ff;
|
||||
}
|
||||
}
|
||||
.deleteaction {
|
||||
margin-left: 10px;
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
color: red;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.week-items {
|
||||
width: 90px;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
border-radius: 5px;
|
||||
cursor: pointer;
|
||||
margin: 10px 5px;
|
||||
border: 1px solid #ccc;
|
||||
color: #000;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.iconbox {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
margin-left: 5px;
|
||||
text-align: center;
|
||||
line-height: 30px;
|
||||
}
|
||||
&.active {
|
||||
color: rgba(26, 117, 255, 1);
|
||||
background-color: rgba(26, 117, 255, 0.15);
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
|
||||
.mapbox {
|
||||
margin-top: 20px;
|
||||
width: 100%;
|
||||
height: 400px;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,24 +1,26 @@
|
||||
<template>
|
||||
<div class="p-2">
|
||||
<div class="h-full flex flex-col p-2">
|
||||
<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" :model="queryParams" :inline="true">
|
||||
<el-form ref="queryFormRef" label-width="100px" :model="queryParams" :inline="true">
|
||||
<el-form-item label="执行状态" prop="taskName">
|
||||
<el-input v-model="queryParams.taskName" placeholder="请输入巡检任务名称" clearable @keyup.enter="handleQuery" />
|
||||
<el-select v-model="queryParams.status" placeholder="请选择执行状态" clearable>
|
||||
<el-option v-for="(item, index) in com_inspection_task_status" :key="index" :value="item.value" :label="item.label"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="巡检任务名称" prop="taskName">
|
||||
<el-input v-model="queryParams.taskName" placeholder="请输入巡检任务名称" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="实际开始时间" prop="actualStartTime">
|
||||
<!-- <el-form-item label="实际开始时间" prop="taskTime">
|
||||
<el-date-picker
|
||||
clearable
|
||||
v-model="queryParams.actualStartTime"
|
||||
v-model="queryParams.taskTime"
|
||||
type="date"
|
||||
value-format="YYYY-MM-DD"
|
||||
placeholder="请选择实际开始时间"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-form-item> -->
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
||||
@@ -28,7 +30,7 @@
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
<el-card shadow="never">
|
||||
<el-card class="flex-1" shadow="never">
|
||||
<template #header>
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
@@ -48,27 +50,21 @@
|
||||
|
||||
<el-table v-loading="loading" border :data="taskList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="主键ID" align="center" prop="id" v-if="true" />
|
||||
<el-table-column label="巡检任务名称" align="center" prop="taskName" />
|
||||
<el-table-column label="关联巡检计划ID" align="center" prop="planId" />
|
||||
<el-table-column label="巡检人员ID" align="center" prop="inspectorId" />
|
||||
<el-table-column label="巡检路线ID" align="center" prop="routeId" />
|
||||
<el-table-column label="巡检人员" align="center" prop="inspectorId" />
|
||||
<el-table-column label="起止日期" align="center" prop="taskTime" />
|
||||
<el-table-column label="巡检设置：0-必须拍照，1-可以跳检" align="center" prop="inspectSetting" />
|
||||
<el-table-column label="费用单位" align="center" prop="costUnit" />
|
||||
<el-table-column label="状态：0-待执行，1-执行中，2-已完成，3-已超时" align="center" prop="status" />
|
||||
<el-table-column label="实际开始时间" align="center" prop="actualStartTime" width="180">
|
||||
<el-table-column label="巡检设置" align="center" prop="inspectSetting">
|
||||
<template #default="scope">
|
||||
<span>{{ parseTime(scope.row.actualStartTime, '{y}-{m}-{d}') }}</span>
|
||||
<dict-tag :options="com_inspection_plan_setting" :value="scope.row.inspectSetting"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="实际结束时间" align="center" prop="actualEndTime" width="180">
|
||||
<el-table-column label="状态" align="center" prop="status">
|
||||
<template #default="scope">
|
||||
<span>{{ parseTime(scope.row.actualEndTime, '{y}-{m}-{d}') }}</span>
|
||||
<dict-tag :options="com_inspection_task_status" :value="scope.row.status"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="备注" align="center" prop="remark" />
|
||||
<el-table-column label="提醒时间" align="center" prop="remindTime" />
|
||||
<el-table-column label="关联巡检计划" align="center" prop="planId" />
|
||||
<el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">
|
||||
<template #default="scope">
|
||||
<el-tooltip content="修改" placement="top">
|
||||
@@ -83,58 +79,6 @@
|
||||
|
||||
<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="500px" append-to-body>
|
||||
<el-form ref="taskFormRef" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="巡检任务名称" prop="taskName">
|
||||
<el-input v-model="form.taskName" placeholder="请输入巡检任务名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="关联巡检计划ID" prop="planId">
|
||||
<el-input v-model="form.planId" placeholder="请输入关联巡检计划ID" />
|
||||
</el-form-item>
|
||||
<el-form-item label="巡检人员ID" prop="inspectorId">
|
||||
<el-input v-model="form.inspectorId" placeholder="请输入巡检人员ID" />
|
||||
</el-form-item>
|
||||
<el-form-item label="巡检路线ID" prop="routeId">
|
||||
<el-input v-model="form.routeId" placeholder="请输入巡检路线ID" />
|
||||
</el-form-item>
|
||||
<el-form-item label="起止日期" prop="taskTime">
|
||||
<el-input v-model="form.taskTime" placeholder="请输入起止日期" />
|
||||
</el-form-item>
|
||||
<el-form-item label="巡检设置：0-必须拍照，1-可以跳检" prop="inspectSetting">
|
||||
<el-input v-model="form.inspectSetting" placeholder="请输入巡检设置：0-必须拍照，1-可以跳检" />
|
||||
</el-form-item>
|
||||
<el-form-item label="费用单位" prop="costUnit">
|
||||
<el-input v-model="form.costUnit" placeholder="请输入费用单位" />
|
||||
</el-form-item>
|
||||
<el-form-item label="实际开始时间" prop="actualStartTime">
|
||||
<el-date-picker
|
||||
clearable
|
||||
v-model="form.actualStartTime"
|
||||
type="datetime"
|
||||
value-format="YYYY-MM-DD HH:mm:ss"
|
||||
placeholder="请选择实际开始时间"
|
||||
>
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="实际结束时间" prop="actualEndTime">
|
||||
<el-date-picker clearable v-model="form.actualEndTime" type="datetime" value-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择实际结束时间">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
|
||||
</el-form-item>
|
||||
<el-form-item label="提醒时间" prop="remindTime">
|
||||
<el-input v-model="form.remindTime" placeholder="请输入提醒时间" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -144,7 +88,9 @@ import { TaskVO, TaskQuery, TaskForm } from '@/api/system/InspectionTask/type';
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
const { com_inspection_task_status } = toRefs<any>(proxy?.useDict('com_inspection_task_status'));
|
||||
const { com_inspection_plan_setting } = toRefs<any>(proxy?.useDict('com_inspection_plan_setting'));
|
||||
|
||||
const router = useRouter();
|
||||
const taskList = ref<TaskVO[]>([]);
|
||||
const buttonLoading = ref(false);
|
||||
const loading = ref(true);
|
||||
@@ -245,19 +191,19 @@ const handleSelectionChange = (selection: TaskVO[]) => {
|
||||
|
||||
/** 新增按钮操作 */
|
||||
const handleAdd = () => {
|
||||
reset();
|
||||
dialog.visible = true;
|
||||
dialog.title = '添加巡检任务';
|
||||
router.push({
|
||||
path: '/inspection/addTask'
|
||||
});
|
||||
};
|
||||
|
||||
/** 修改按钮操作 */
|
||||
const handleUpdate = async (row?: TaskVO) => {
|
||||
reset();
|
||||
const _id = row?.id || ids.value[0];
|
||||
const res = await getTask(_id);
|
||||
Object.assign(form.value, res.data);
|
||||
dialog.visible = true;
|
||||
dialog.title = '修改巡检任务';
|
||||
router.push({
|
||||
path: '/inspection/addTask',
|
||||
query: {
|
||||
id: row.id
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/** 提交按钮 */
|
||||
@@ -301,3 +247,9 @@ onMounted(() => {
|
||||
getList();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.el-table {
|
||||
height: calc(100% - 80px);
|
||||
}
|
||||
</style>
|
||||
|
||||
12
src/views/system/inspection/Task/index3.vue
Normal file
12
src/views/system/inspection/Task/index3.vue
Normal file
@@ -0,0 +1,12 @@
|
||||
<template>
|
||||
<div class="p-2 h-full flex flex-col">
|
||||
<Pageheader></Pageheader>
|
||||
<div class="flex-1 color-gray flex h-full font-size-6 flex-center">系统还在维护中，敬请期待...</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss"></style>
|
||||
@@ -1,12 +1,109 @@
|
||||
<template>
|
||||
<div class="p-2 h-full flex flex-col">
|
||||
<div class="h-full flex flex-col p-2">
|
||||
<Pageheader></Pageheader>
|
||||
<div class="flex-1 color-gray flex h-full font-size-6 flex-center">系统还在维护中，敬请期待...</div>
|
||||
<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" :model="queryParams" :inline="true">
|
||||
<el-form-item label="选择日期" prop="itemName">
|
||||
<el-date-picker
|
||||
v-model="starDate"
|
||||
type="daterange"
|
||||
unlink-panels
|
||||
range-separator="到"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
format="YYYY/MM/DD"
|
||||
value-format="YYYY/MM/DD"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
<el-card class="flex-1" shadow="never">
|
||||
<template #header>
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="1.5">
|
||||
<span style="font-size: 1.2rem">月报列表</span>
|
||||
</el-col>
|
||||
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
</template>
|
||||
|
||||
<el-table v-loading="loading" border :data="itemList">
|
||||
<el-table-column label="日期" width="100" align="center" prop="statDate" />
|
||||
<el-table-column label="计划巡检任务" width="120" align="center" prop="totalPlans" />
|
||||
<el-table-column label="按时完成" align="center" prop="completedTasks" />
|
||||
<el-table-column label="超时完成" align="center" prop="outCompletedTasks" />
|
||||
<el-table-column label="超时未完成" align="center" prop="outUncompletedTasks" />
|
||||
<el-table-column label="进行中" align="center" prop="activeTask" />
|
||||
<el-table-column label="未开始" align="center" prop="pendingTask" />
|
||||
</el-table>
|
||||
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
<script setup name="Item" lang="ts">
|
||||
import { listItem, type Request } from '@/api/system/Inspection/index';
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
|
||||
const itemList = ref<any[]>([]);
|
||||
const loading = ref(true);
|
||||
const showSearch = ref(true);
|
||||
const total = ref(0);
|
||||
|
||||
const queryFormRef = ref<ElFormInstance>();
|
||||
|
||||
const data = reactive<{
|
||||
queryParams: Request;
|
||||
}>({
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
dataType: '2' // 1 日报 2 周报 3 月报
|
||||
}
|
||||
});
|
||||
const starDate = ref([]);
|
||||
const { queryParams } = toRefs(data);
|
||||
|
||||
/** 查询巡检项目列表 */
|
||||
const getList = async () => {
|
||||
queryParams.value.statDate = starDate.value.join('-');
|
||||
loading.value = true;
|
||||
const res = await listItem(queryParams.value);
|
||||
itemList.value = res.rows;
|
||||
total.value = res.total;
|
||||
loading.value = false;
|
||||
};
|
||||
|
||||
/** 搜索按钮操作 */
|
||||
const handleQuery = () => {
|
||||
queryParams.value.pageNum = 1;
|
||||
getList();
|
||||
};
|
||||
|
||||
/** 重置按钮操作 */
|
||||
const resetQuery = () => {
|
||||
queryFormRef.value?.resetFields();
|
||||
starDate.value = [];
|
||||
handleQuery();
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
getList();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss"></style>
|
||||
<style lang="scss" scoped>
|
||||
.el-table {
|
||||
height: calc(100% - 80px);
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -114,7 +114,6 @@ import { validator } from '@/utils/Reg';
|
||||
import { useHouseStore } from '@/store/modules/house';
|
||||
|
||||
const houseStore = useHouseStore();
|
||||
const { treedata } = storeToRefs(houseStore);
|
||||
const uploadUrl = import.meta.env.VITE_APP_BASE_API + '/resident/uploadImage';
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
@@ -161,6 +160,14 @@ const rules = ref({
|
||||
]
|
||||
});
|
||||
|
||||
const treedata = ref([]);
|
||||
function getTree() {
|
||||
houseStore.getCurrentVilageTreeHouse().then((res) => {
|
||||
treedata.value = res;
|
||||
gettreedata();
|
||||
});
|
||||
}
|
||||
getTree();
|
||||
// !== 楼栋房屋 =============================================================================
|
||||
const userid = ref(null);
|
||||
function gettreedata() {
|
||||
@@ -176,7 +183,7 @@ function gettreedata() {
|
||||
});
|
||||
}
|
||||
}
|
||||
gettreedata();
|
||||
|
||||
function handleChange(val: CascaderValue) {
|
||||
userHousepath.value = val;
|
||||
form.value.buildingId = val[0];
|
||||
|
||||
Reference in New Issue
Block a user