You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

134 lines
3.6 KiB
Vue

<template>
<div>
<el-form-item label="设备">
<el-select v-model="form.deviceId" placeholder="请选择" @change="setDeviceId">
<el-option
v-for="item in deviceList"
:key="item.deviceId"
:label="item.deviceName"
:value="item.deviceId">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="deviceModeId" v-show="false">
<el-input
v-model="form.deviceModeId">
</el-input>
</el-form-item>
<el-form-item label="设备属性">
<el-select v-model="form.functionIdentifier" placeholder="请选择">
<el-option
v-for="item in deviceFunList"
:key="item.functionIdentifier"
:label="item.functionName"
:value="item.functionIdentifier">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="数据间隔">
<el-select v-model="form.interval" placeholder="请选择" @change="changeInterval">
<el-option
v-for="item in intervalOption"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="时间周期">
<el-date-picker
@change="timeChange"
v-model="time"
type="datetimerange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker>
</el-form-item>
</div>
</template>
<script setup>
import { getDeviceFunctions, getDeviceList } from '@/api/configure/configuration/equipment';
import { queryGlobalCfg } from '@/api/configure/configuration/globalCfg.js';
const props = defineProps({
form: Object
});
const { form } = toRefs(props);
const time = ref([]);
const deviceList = ref([]);
const deviceFunList = ref([]);
const intervalOption = ref([
{
label: '时',
value: '1',
default: 1
},
{
label: '日',
value: '2',
default: 24
},
{
label: '周',
value: '3',
default: 7
},
{
label: '月',
value: '4',
default: 30
},
{
label: '年',
value: '5',
default: 12
}
]);
const $parseTime = inject('$parseTime');
onMounted(async () => {
getDeviceList().then(e => {
deviceList.value = e.rows;
});
});
const setDeviceId = (e) => {
let modelId = deviceList.value.find(v => v.deviceId === e).deviceModeId;
form.value['deviceModeId'] = modelId;
getDeviceFunctions(modelId).then(v => {
deviceFunList.value = v.data;
});
};
const timeChange = () => {
form.value['startTime'] = new Date(time.value[0]).getTime();
form.value['endTime'] = new Date(time.value[1]).getTime();
};
const changeInterval = (e) => {
let data = intervalOption.value.find(v => v.value === e);
form.value['intervalType'] = data.default;
if (e === '1') {
time.value = [$parseTime(new Date().getTime() - (1000 * 60 * 60 * 24)), $parseTime(new Date())];
}
if (e === '2') {
time.value = [$parseTime(new Date().getTime() - (1000 * 60 * 60 * 24)), $parseTime(new Date())];
}
if (e === '3') {
time.value = [$parseTime(new Date().getTime() - (1000 * 60 * 60 * 24 * 7)), $parseTime(new Date())];
}
if (e === '4') {
time.value = [$parseTime(new Date().getTime() - (1000 * 60 * 60 * 24 * 30)), $parseTime(new Date())];
}
if (e === '5') {
time.value = [$parseTime(new Date().getTime() - (1000 * 60 * 60 * 24 * 365)), $parseTime(new Date())];
}
form.value['startTime'] = new Date(time.value[0]).getTime();
form.value['endTime'] = new Date(time.value[1]).getTime();
};
</script>
<style>
</style>