1073 lines
33 KiB
Vue
1073 lines
33 KiB
Vue
<template>
|
||
<view>
|
||
<view class="link_home">
|
||
<scroll-view :scroll-y="isScroll" :style="{ height: '100%' }">
|
||
<nut-config-provider :theme-vars="themeVars">
|
||
<view class="body">
|
||
<nut-row>
|
||
<view v-if="linkList.length > 0">
|
||
<nut-col
|
||
:span="24"
|
||
:style="{ marginBottom: '10px' }"
|
||
v-for="(item, index) in linkList"
|
||
:key="item.id"
|
||
>
|
||
<nut-cell class="link_body">
|
||
<nut-row>
|
||
<nut-col :span="24" class="view_f_between">
|
||
<view class="title">{{ item.name }}</view>
|
||
<view class="t_desc" @click="remove(item.name, item.id)"
|
||
>删除</view
|
||
>
|
||
</nut-col>
|
||
<nut-col :span="24">
|
||
<nut-cell-group>
|
||
<nut-cell title="开关选择" is-link @click="update(item)">
|
||
<template #desc>
|
||
<text
|
||
class="desc"
|
||
:style="{
|
||
width: '200px',
|
||
overflow: 'hidden',
|
||
textOverflow: 'ellipsis',
|
||
whiteSpace: 'nowrap',
|
||
}"
|
||
>{{ item.switchName }}</text
|
||
>
|
||
</template>
|
||
</nut-cell>
|
||
<nut-cell>
|
||
<nut-row>
|
||
<nut-col :span="13" class="nut-cell__title">
|
||
溶解氧上限
|
||
</nut-col>
|
||
<nut-col :span="11" class="view_f_between_end">
|
||
<view
|
||
:style="{ marginRight: '15rpx' }"
|
||
@click="upOxyU(item)"
|
||
>
|
||
<Edit size="12" />
|
||
</view>
|
||
<view
|
||
class="rjy"
|
||
:style="{ marginRight: '15rpx' }"
|
||
@click="upOxyU(item)"
|
||
>
|
||
{{ item.oxyUpperValue ? item.oxyUpperValue : "-" }}Mg/L
|
||
</view>
|
||
<view>
|
||
<nut-switch
|
||
v-model="item.oxyUpperOpen"
|
||
active-color="#04D98A"
|
||
@change="(value, event) => setUpSwitch({ value, event }, item)"
|
||
/>
|
||
</view>
|
||
</nut-col>
|
||
</nut-row>
|
||
</nut-cell>
|
||
<nut-cell>
|
||
<nut-row>
|
||
<nut-col :span="13" class="nut-cell__title">
|
||
溶解氧下限
|
||
</nut-col>
|
||
<nut-col :span="11" class="view_f_between_end">
|
||
<view
|
||
:style="{ marginRight: '15rpx' }"
|
||
@click="upOxyD(item)"
|
||
>
|
||
<Edit size="12" />
|
||
</view>
|
||
<view
|
||
class="rjy"
|
||
:style="{ marginRight: '15rpx' }"
|
||
@click="upOxyD(item)"
|
||
>
|
||
{{ item.oxyLowerValue ? item.oxyLowerValue : "-" }}Mg/L
|
||
</view>
|
||
<view>
|
||
<nut-switch
|
||
v-model="item.oxyLowerOpen"
|
||
active-color="#04D98A"
|
||
@change="(value, event) => setLoSwitch({ value, event }, item)"
|
||
/>
|
||
</view>
|
||
</nut-col>
|
||
</nut-row>
|
||
</nut-cell>
|
||
</nut-cell-group>
|
||
</nut-col>
|
||
<!-- <nut-col :span="24">
|
||
<nut-button
|
||
block
|
||
shape="square"
|
||
type="warning"
|
||
size="large"
|
||
class="f_weight"
|
||
:style="{
|
||
fontSize: '32rpx !important',
|
||
borderRadius: '10px',
|
||
}"
|
||
@click="update(item)"
|
||
>编辑</nut-button
|
||
>
|
||
</nut-col> -->
|
||
</nut-row>
|
||
</nut-cell>
|
||
</nut-col>
|
||
</view>
|
||
<view v-else>
|
||
<nut-cell>
|
||
<nut-col :span="24">
|
||
<nut-empty description="请新增联动控制">
|
||
<template #image>
|
||
<img :src="pond404" />
|
||
</template>
|
||
</nut-empty>
|
||
</nut-col>
|
||
</nut-cell>
|
||
</view>
|
||
<nut-col :span="24" :style="{ marginBottom: '20%' }">
|
||
<view class="d_desc">
|
||
1.当塘口溶解氧低于设置的溶解氧下限时，自动开启该塘口内选择的增氧机。
|
||
</view>
|
||
<view class="d_desc" :style="{ marginTop: '10px', marginBottom: '10px' }">
|
||
2.若同一个塘口有多个鱼测云测氧仪，则以其中最低测量值作为溶解氧是否到达上下限的判断标准。
|
||
</view>
|
||
</nut-col>
|
||
</nut-row>
|
||
</view>
|
||
</nut-config-provider>
|
||
</scroll-view>
|
||
<view class="btn" v-if="linkList.length < 3">
|
||
<nut-row>
|
||
<nut-col :span="24" :style="{ padding: '20rpx' }">
|
||
<nut-button
|
||
block
|
||
shape="square"
|
||
type="primary"
|
||
size="large"
|
||
:style="{
|
||
fontWeight: 'bold',
|
||
fontSize: '38rpx !important',
|
||
borderRadius: '10px',
|
||
}"
|
||
@click="addLinks2"
|
||
>新增联动控制</nut-button
|
||
>
|
||
</nut-col>
|
||
</nut-row>
|
||
</view>
|
||
<nut-config-provider :theme-vars="themeVars2">
|
||
<!-- 添加 -->
|
||
<nut-dialog v-model:visible="linkInfoShow" text-align="left" no-footer>
|
||
<view class="d_body" :style="{ paddingBottom: '0px' }">
|
||
<nut-row>
|
||
<nut-col :span="24">
|
||
<view class="d_title">联动控制</view>
|
||
</nut-col>
|
||
<!-- <nut-col :span="24" class="view_f">
|
||
<view :style="{ width: '40%' }" class="font_32 c_444">溶解氧上限</view>
|
||
<view :style="{ width: '60%' }">
|
||
<nut-input
|
||
type="digit"
|
||
@blur="upOxyValue"
|
||
v-model="params.oxyWarnUpper"
|
||
placeholder="范围1~20"
|
||
:border="false"
|
||
input-align="right"
|
||
max-length="5"
|
||
clearable
|
||
:cursor="String(params.oxyWarnUpper).length"
|
||
>
|
||
<template #right>
|
||
<text class="c_222">Mg/L</text>
|
||
</template>
|
||
</nut-input>
|
||
</view>
|
||
</nut-col>
|
||
<nut-col :span="24" class="view_f">
|
||
<view :style="{ width: '40%' }" class="font_32 c_444">溶解氧下限</view>
|
||
<view :style="{ width: '60%' }">
|
||
<nut-input
|
||
type="digit"
|
||
@blur="upOxyValue"
|
||
v-model="params.oxyWarnLower"
|
||
:cursor="String(params.oxyWarnLower).length"
|
||
placeholder="范围1~20"
|
||
:border="false"
|
||
input-align="right"
|
||
max-length="5"
|
||
clearable
|
||
>
|
||
<template #right>
|
||
<text class="c_222">Mg/L</text>
|
||
</template>
|
||
</nut-input>
|
||
</view>
|
||
</nut-col> -->
|
||
<nut-col :span="24">
|
||
<nut-divider class="divider" />
|
||
</nut-col>
|
||
<nut-col :span="24">
|
||
<view class="font_32 c_222 f_weight">开关选择</view>
|
||
</nut-col>
|
||
<nut-col :span="24">
|
||
<next-tree
|
||
ref="qiantree"
|
||
:selectParent="false"
|
||
labelKey="deviceName"
|
||
valueKey="id"
|
||
:multiple="true"
|
||
:treeData="switchList"
|
||
@confirm="onconfirm"
|
||
childrenKey="listSwitch"
|
||
border
|
||
@cancel="oncancel"
|
||
height="300rpx"
|
||
showChild
|
||
/>
|
||
</nut-col>
|
||
</nut-row>
|
||
</view>
|
||
</nut-dialog>
|
||
<!-- 编辑 -->
|
||
<nut-dialog v-model:visible="uplinkInfoShow" text-align="left" no-footer>
|
||
<view class="d_body" :style="{ paddingBottom: '0px' }">
|
||
<nut-row>
|
||
<nut-col :span="24">
|
||
<view class="d_title">联动控制</view>
|
||
</nut-col>
|
||
<!-- <nut-col :span="24" class="view_f">
|
||
<view :style="{ width: '40%' }" class="font_32 c_444">溶解氧上限</view>
|
||
<view :style="{ width: '60%' }">
|
||
<nut-input
|
||
type="digit"
|
||
@blur="upOxyValue"
|
||
@focus="onfocus"
|
||
v-model="params.oxyWarnUpper"
|
||
placeholder="范围1~10"
|
||
:border="false"
|
||
input-align="right"
|
||
max-length="5"
|
||
clearable
|
||
:cursor="String(params.oxyWarnUpper).length"
|
||
>
|
||
<template #right>
|
||
<text class="c_222">Mg/L</text>
|
||
</template>
|
||
</nut-input>
|
||
</view>
|
||
</nut-col>
|
||
<nut-col :span="24" class="view_f">
|
||
<view :style="{ width: '40%' }" class="font_32 c_444">溶解氧下限</view>
|
||
<view :style="{ width: '60%' }">
|
||
<nut-input
|
||
type="digit"
|
||
@blur="upOxyValue"
|
||
@focus="onfocus"
|
||
v-model="params.oxyWarnLower"
|
||
:cursor="String(params.oxyWarnLower).length"
|
||
placeholder="范围1~10"
|
||
:border="false"
|
||
input-align="right"
|
||
max-length="5"
|
||
clearable
|
||
>
|
||
<template #right>
|
||
<text class="c_222">Mg/L</text>
|
||
</template>
|
||
</nut-input>
|
||
</view>
|
||
</nut-col> -->
|
||
<nut-col :span="24">
|
||
<nut-divider class="divider" />
|
||
</nut-col>
|
||
<nut-col :span="24">
|
||
<view class="font_32 c_222 f_weight">开关选择</view>
|
||
</nut-col>
|
||
<nut-col :span="24">
|
||
<next-tree
|
||
ref="qiantree"
|
||
:selectParent="false"
|
||
labelKey="deviceName"
|
||
valueKey="id"
|
||
:multiple="true"
|
||
:treeData="switchList"
|
||
@confirm="onconfirmUp"
|
||
childrenKey="listSwitch"
|
||
border
|
||
@cancel="oncancelUp"
|
||
height="300rpx"
|
||
showChild
|
||
/>
|
||
</nut-col>
|
||
</nut-row>
|
||
</view>
|
||
</nut-dialog>
|
||
<!-- 风险提示 -->
|
||
<nut-dialog v-model:visible="openAlert" text-align="left" no-footer>
|
||
<view class="d_body" :style="{ paddingBottom: '0px' }">
|
||
<nut-row>
|
||
<nut-col :span="24">
|
||
<view class="d_title" :style="{ textAlign: 'center' }">风险提示</view>
|
||
</nut-col>
|
||
<nut-col :span="24">
|
||
<nut-divider class="divider" />
|
||
</nut-col>
|
||
<nut-col :span="24" class="font_30 c_666">
|
||
若打开此开关，当监测到的溶解氧高于设置的{{
|
||
switchParams.openType == 1 ? "上限" : "下限"
|
||
}}时，将自动关闭所选择的增氧机开关。
|
||
</nut-col>
|
||
<nut-col :span="24" class="font_30 c_E22323 m_t_20">
|
||
此操作存在较大生产安全风险，请务必知晓并谨慎操作!!!请确认是否打开?
|
||
</nut-col>
|
||
</nut-row>
|
||
</view>
|
||
<view class="d_btn">
|
||
<nut-row>
|
||
<nut-col
|
||
:span="12"
|
||
:style="{ border: '1px solid #eee', color: '#222' }"
|
||
@click="setSwitchOpenNone"
|
||
>
|
||
取消
|
||
</nut-col>
|
||
<nut-col
|
||
:span="12"
|
||
:style="{ border: '1px solid #eee', color: '#15BBC5' }"
|
||
@click="setSwitchOpenOk"
|
||
>
|
||
确定
|
||
</nut-col>
|
||
</nut-row>
|
||
</view>
|
||
</nut-dialog>
|
||
<!-- 溶解氧上限设置 -->
|
||
<nut-dialog v-model:visible="openOxyU" text-align="left" no-footer>
|
||
<view :style="{ height: '100%' }">
|
||
<view class="d_body">
|
||
<nut-row>
|
||
<nut-col :span="24">
|
||
<view class="d_title">溶解氧上限设置</view>
|
||
</nut-col>
|
||
<nut-col :span="24">
|
||
<nut-divider class="divider" />
|
||
</nut-col>
|
||
<nut-col :span="24" class="view_f">
|
||
<view :style="{ width: '40%' }" class="font_32 c_444">上限</view>
|
||
<view :style="{ width: '60%' }">
|
||
<nut-input
|
||
type="digit"
|
||
v-model="oxyU"
|
||
@blur="upOxyValue"
|
||
@focus="onfocus"
|
||
:border="false"
|
||
input-align="right"
|
||
clearable
|
||
max-length="5"
|
||
placeholder="范围1~20"
|
||
:cursor="String(oxyU).length"
|
||
>
|
||
<template #right> Mg/L </template>
|
||
</nut-input>
|
||
</view>
|
||
</nut-col>
|
||
<nut-col :span="24">
|
||
<nut-divider class="divider" />
|
||
</nut-col>
|
||
</nut-row>
|
||
</view>
|
||
<view class="d_btn">
|
||
<nut-row>
|
||
<nut-col
|
||
:span="12"
|
||
:style="{ border: '1px solid #eee', color: '#222' }"
|
||
@click="openOxyU = false"
|
||
>
|
||
取消
|
||
</nut-col>
|
||
<nut-col
|
||
:span="12"
|
||
:style="{ border: '1px solid #eee', color: '#15BBC5' }"
|
||
@click="setOxyEventU"
|
||
>
|
||
确定
|
||
</nut-col>
|
||
</nut-row>
|
||
</view>
|
||
</view>
|
||
</nut-dialog>
|
||
<!-- 溶解氧下限设置 -->
|
||
<nut-dialog v-model:visible="openOxyD" text-align="left" no-footer>
|
||
<view :style="{ height: '100%' }">
|
||
<view class="d_body">
|
||
<nut-row>
|
||
<nut-col :span="24">
|
||
<view class="d_title">溶解氧下限设置</view>
|
||
</nut-col>
|
||
<nut-col :span="24">
|
||
<nut-divider class="divider" />
|
||
</nut-col>
|
||
<nut-col :span="24" class="view_f">
|
||
<view :style="{ width: '40%' }" class="font_32 c_444">下限</view>
|
||
<view :style="{ width: '60%' }">
|
||
<nut-input
|
||
type="digit"
|
||
v-model="oxyD"
|
||
@blur="upOxyValue"
|
||
@focus="onfocus"
|
||
:border="false"
|
||
input-align="right"
|
||
clearable
|
||
max-length="5"
|
||
placeholder="范围1~20"
|
||
:cursor="String(oxyD).length"
|
||
>
|
||
<template #right> Mg/L </template>
|
||
</nut-input>
|
||
</view>
|
||
</nut-col>
|
||
<nut-col :span="24">
|
||
<nut-divider class="divider" />
|
||
</nut-col>
|
||
</nut-row>
|
||
</view>
|
||
<view class="d_btn">
|
||
<nut-row>
|
||
<nut-col
|
||
:span="12"
|
||
:style="{ border: '1px solid #eee', color: '#222' }"
|
||
@click="openOxyD = false"
|
||
>
|
||
取消
|
||
</nut-col>
|
||
<nut-col
|
||
:span="12"
|
||
:style="{ border: '1px solid #eee', color: '#15BBC5' }"
|
||
@click="setOxyEventD"
|
||
>
|
||
确定
|
||
</nut-col>
|
||
</nut-row>
|
||
</view>
|
||
</view>
|
||
</nut-dialog>
|
||
</nut-config-provider>
|
||
</view>
|
||
<!-- 弹出层提示 -->
|
||
<nut-toast :msg="state.msg" v-model:visible="state.show" :type="state.type" />
|
||
</view>
|
||
</template>
|
||
<script setup lang="ts">
|
||
import Taro from "@tarojs/taro";
|
||
import {
|
||
linkerCtrlList,
|
||
pondSwitchList,
|
||
addLinkerCtrl,
|
||
updateLinkerCtrl,
|
||
delLinkerCtrl,
|
||
setLinkOpen,
|
||
} from "@/api/device";
|
||
import { stateType } from "@/utils/types";
|
||
import nextTree from "@/components/tree/index";
|
||
import { imgUrl } from "@/utils/imgUrl";
|
||
import { IconFont, Edit } from "@nutui/icons-vue-taro";
|
||
definePageConfig({
|
||
navigationBarTitleText: "联动控制",
|
||
});
|
||
const pond404 = `${imgUrl}zanwurenwu.png`;
|
||
const instance = Taro.getCurrentInstance();
|
||
const id = instance.router.params.id;
|
||
const pondId = instance.router.params.pondId;
|
||
// const pondId = 12;
|
||
const themeVars = ref({
|
||
cellBorderRadius: "4px",
|
||
cellBoxShadow: "0px",
|
||
cellPadding: "26rpx 0px",
|
||
});
|
||
const themeVars2 = ref({
|
||
cellBoxShadow: "0px 0px 0px 0px",
|
||
cellPadding: "0",
|
||
cellColor: "#666666",
|
||
cellTitleFont: "32rpx",
|
||
cellTitleDescFont: "30rpx",
|
||
cellDescFont: "30rpx",
|
||
cellDescColor: "#222222",
|
||
popupBorderRadius: "10rpx",
|
||
checkboxLabelFontSize: "30rpx",
|
||
});
|
||
// 联动控制列表
|
||
const linkList = ref<any[]>([]);
|
||
// 开关列表
|
||
const switchList = ref<any[]>([]);
|
||
const openAlert = ref<boolean>(false);
|
||
const linkInfoShow = ref<boolean>(false);
|
||
const uplinkInfoShow = ref<boolean>(false);
|
||
const params = ref({
|
||
id: undefined,
|
||
deviceId: id,
|
||
// oxyWarnUpper: 20,
|
||
// oxyWarnLower: null,
|
||
listSwitchId: [],
|
||
});
|
||
const state: stateType = reactive({
|
||
msg: "",
|
||
type: "text",
|
||
center: true,
|
||
show: false,
|
||
});
|
||
const switchParams = ref({
|
||
id: undefined,
|
||
openType: 1,
|
||
isOpen: false,
|
||
});
|
||
const isScroll = ref(true);
|
||
const openOxyU = ref(false);
|
||
const openOxyD = ref(false);
|
||
const oxyU = ref(null);
|
||
const oxyD = ref(null);
|
||
const linkInfo = ref();
|
||
/** method satrt------------------- */
|
||
Taro.useDidShow(() => {
|
||
// 默认
|
||
getLinksList();
|
||
});
|
||
// 查询联动控制
|
||
function getLinksList() {
|
||
linkerCtrlList({ id }).then((res) => {
|
||
console.log('完整返回数据:', JSON.stringify(res, null, 2));
|
||
if (res.code == 200) {
|
||
if (res.data) {
|
||
res.data.forEach((item, index) => {
|
||
console.log(`联动控制${index + 1}完整数据:`, JSON.stringify(item, null, 2));
|
||
item.name = "联动控制" + (index + 1);
|
||
// 调试：查看原始数据
|
||
console.log('原始数据:', item.oxyUpperOpen, item.oxyLowerOpen, typeof item.oxyUpperOpen);
|
||
// 将后端返回的 0/1 转换为布尔类型 - 强制设置为 true 或 false
|
||
item.oxyUpperOpen = item.oxyUpperOpen === 1 ? true : false;
|
||
item.oxyLowerOpen = item.oxyLowerOpen === 1 ? true : false;
|
||
console.log('转换后:', item.oxyUpperOpen, item.oxyLowerOpen, typeof item.oxyUpperOpen);
|
||
const switchName: any = [];
|
||
if (item.listSwitch && item.listSwitch.length > 0) {
|
||
item.listSwitch.forEach((r: any) => {
|
||
switchName.push(r.switchName);
|
||
});
|
||
}
|
||
item.switchName = switchName.join(",");
|
||
});
|
||
}
|
||
linkList.value = res.data || [];
|
||
console.log('最终linkList:', JSON.stringify(linkList.value, null, 2));
|
||
}
|
||
});
|
||
}
|
||
// 开关列表
|
||
function getSwitchList(type = undefined,id=undefined) {
|
||
pondSwitchList({ id: pondId }).then((res) => {
|
||
if (res.code == 200) {
|
||
if (res.data.length > 0) {
|
||
res.data.forEach((r) => {
|
||
if (r.deviceType == 2) {
|
||
r.id = undefined;
|
||
}
|
||
if (r.listSwitch.length > 0) {
|
||
r.listSwitch.forEach((rr: any) => {
|
||
rr.checked = false;
|
||
rr.disabled = false;
|
||
// 判断选中的开关
|
||
if (type == 1) {
|
||
if (params.value.listSwitchId.includes(rr.id)) {
|
||
rr.checked = true;
|
||
}
|
||
}
|
||
if(rr.linkedCtrlId!=0){
|
||
if(rr.id!=r.id){
|
||
if(rr.linkedCtrlId==id){
|
||
rr.disabled = false;
|
||
rr.checked = true;
|
||
}else{
|
||
rr.disabled = true;
|
||
}
|
||
}else{
|
||
rr.checked = true;
|
||
}
|
||
}
|
||
rr.deviceName =
|
||
rr.switchName.split(r.deviceName).length > 0 &&
|
||
rr.switchName.split(r.deviceName)[1]
|
||
? rr.switchName.split(r.deviceName)[1]
|
||
: rr.switchName;
|
||
});
|
||
}
|
||
});
|
||
switchList.value = res.data;
|
||
if (switchList.value.length > 0) {
|
||
if (type == 1) {
|
||
uplinkInfoShow.value = true;
|
||
} else {
|
||
linkInfoShow.value = true;
|
||
}
|
||
} else {
|
||
if (type == 1) {
|
||
uplinkInfoShow.value = true;
|
||
} else {
|
||
linkInfoShow.value = true;
|
||
}
|
||
state.show = true;
|
||
state.msg = "塘口内未绑定开关设备";
|
||
return;
|
||
}
|
||
} else {
|
||
state.show = true;
|
||
state.msg = "暂无开关，请前往绑定";
|
||
}
|
||
}
|
||
});
|
||
}
|
||
// 新增联动控制弹框
|
||
function addLinks2() {
|
||
rest();
|
||
getSwitchList();
|
||
}
|
||
/** 删除 */
|
||
function remove(name, id) {
|
||
// 确定提示框
|
||
Taro.showModal({
|
||
title: "提示",
|
||
content: `确认删除 ${name}？`,
|
||
success: function (res) {
|
||
if (res.confirm) {
|
||
delLinkerCtrl({ id }).then((res) => {
|
||
if (res.code == 200) {
|
||
state.show = true;
|
||
state.msg = "删除成功";
|
||
getLinksList();
|
||
}
|
||
});
|
||
} else if (res.cancel) {
|
||
}
|
||
},
|
||
});
|
||
}
|
||
// 验证输入框内容
|
||
function upOxyValue() {
|
||
isScroll.value = false;
|
||
}
|
||
// 确定保存
|
||
function addHandler() {
|
||
// const u =
|
||
// params.value.oxyWarnUpper != null &&
|
||
// params.value.oxyWarnUpper != undefined &&
|
||
// params.value.oxyWarnUpper != ""
|
||
// ? Number(params.value.oxyWarnUpper)
|
||
// : null;
|
||
// const l =
|
||
// params.value.oxyWarnLower != null &&
|
||
// params.value.oxyWarnLower != undefined &&
|
||
// params.value.oxyWarnLower != ""
|
||
// ? Number(params.value.oxyWarnLower)
|
||
// : null;
|
||
// if (u == null || u == undefined || u == "") {
|
||
// state.show = true;
|
||
// state.msg = "请输入溶解氧上限";
|
||
// return;
|
||
// }
|
||
// if (l == null || l == undefined || l == "") {
|
||
// state.show = true;
|
||
// state.msg = "请输入溶解氧下限";
|
||
// return;
|
||
// }
|
||
// if (u && (Number(u) < 1 || Number(u) > 20)) {
|
||
// state.show = true;
|
||
// state.msg = "溶解氧上限范围1~20";
|
||
// return;
|
||
// }
|
||
// if (l && (Number(l) < 1 || Number(l) > 20)) {
|
||
// state.show = true;
|
||
// state.msg = "溶解氧下限范围1~20";
|
||
// return;
|
||
// }
|
||
// if (!u && !l) {
|
||
// state.show = true;
|
||
// state.msg = "请设置一个溶解氧上限或下限";
|
||
// return;
|
||
// }
|
||
// if (u && l) {
|
||
// if (Number(u) <= Number(l)) {
|
||
// state.show = true;
|
||
// state.msg = "溶解氧上限必须大于下限，且差值不能小于1Mg/L";
|
||
// return;
|
||
// } else {
|
||
// const c = Number(u) - Number(l);
|
||
// if (c < 1) {
|
||
// state.show = true;
|
||
// state.msg = "溶解氧上限必须大于下限，且差值不能小于1Mg/L";
|
||
// return;
|
||
// }
|
||
// }
|
||
// }
|
||
if (params.value.listSwitchId.length <= 0) {
|
||
state.show = true;
|
||
state.msg = "请选择开关";
|
||
return;
|
||
}
|
||
if (params.value.id) {
|
||
updateLinkerCtrl(params.value)
|
||
.then((res) => {
|
||
if (res.code == 200) {
|
||
state.show = true;
|
||
state.msg = "编辑成功";
|
||
getLinksList();
|
||
return;
|
||
}
|
||
})
|
||
.finally(() => {
|
||
oncancelUp();
|
||
});
|
||
} else {
|
||
addLinkerCtrl(params.value)
|
||
.then((res) => {
|
||
if (res.code == 200) {
|
||
state.show = true;
|
||
state.msg = "添加成功";
|
||
getLinksList();
|
||
return;
|
||
}
|
||
})
|
||
.finally(() => {
|
||
oncancel();
|
||
});
|
||
}
|
||
}
|
||
function rest() {
|
||
params.value.id = undefined;
|
||
params.value.deviceId = id;
|
||
params.value.oxyWarnUpper = 20;
|
||
params.value.oxyWarnLower = null;
|
||
params.value.listSwitchId = [];
|
||
}
|
||
function onconfirm(rows) {
|
||
if (rows.list.length > 0) {
|
||
const ids: any = [];
|
||
rows.list.forEach((res) => {
|
||
ids.push(res.source.id);
|
||
});
|
||
params.value.listSwitchId = ids;
|
||
addHandler();
|
||
} else {
|
||
state.show = true;
|
||
state.msg = "请选择开关";
|
||
return;
|
||
}
|
||
}
|
||
// 取消
|
||
function oncancel() {
|
||
rest();
|
||
linkInfoShow.value = false;
|
||
}
|
||
// 编辑
|
||
function update(item) {
|
||
params.value.id = item.id;
|
||
params.value.deviceId = item.deviceId;
|
||
params.value.oxyWarnUpper = item.oxyUpperValue;
|
||
params.value.oxyWarnLower = item.oxyLowerValue;
|
||
const ids: number[] = [];
|
||
if (item.listSwitch && item.listSwitch.length > 0) {
|
||
item.listSwitch.forEach((res: any) => {
|
||
ids.push(res.id);
|
||
});
|
||
}
|
||
params.value.listSwitchId = ids;
|
||
getSwitchList(1,item.id);
|
||
// uplinkInfoShow.value = true
|
||
}
|
||
// 取消编辑
|
||
function oncancelUp() {
|
||
rest();
|
||
uplinkInfoShow.value = false;
|
||
}
|
||
// 确定编辑
|
||
function onconfirmUp(rows) {
|
||
if (rows.list.length > 0) {
|
||
const ids: any = [];
|
||
rows.list.forEach((res) => {
|
||
ids.push(res.source.id);
|
||
});
|
||
params.value.listSwitchId = ids;
|
||
addHandler();
|
||
} else {
|
||
state.show = true;
|
||
state.msg = "请选择开关";
|
||
return;
|
||
}
|
||
}
|
||
// 上下限开关设置
|
||
function setUpSwitch({ value, event }, item: any) {
|
||
if (event) {
|
||
const data = {
|
||
id: item.id,
|
||
openType: 1,
|
||
isOpen: item.oxyUpperOpen ? 1 : 0, // 布尔转数字
|
||
};
|
||
switchParams.value = data;
|
||
if (item.oxyUpperOpen) {
|
||
openAlert.value = true;
|
||
return;
|
||
}
|
||
setSwitchOpen(data);
|
||
}
|
||
}
|
||
function setLoSwitch({ value, event }, item: any) {
|
||
if (event) {
|
||
const data = {
|
||
id: item.id,
|
||
openType: 2,
|
||
isOpen: item.oxyLowerOpen ? 1 : 0, // 布尔转数字
|
||
};
|
||
switchParams.value = data;
|
||
if (item.oxyLowerOpen) {
|
||
openAlert.value = true;
|
||
return;
|
||
}
|
||
setSwitchOpen(data);
|
||
}
|
||
}
|
||
// 开启开关
|
||
function setSwitchOpenOk() {
|
||
setSwitchOpen(switchParams.value);
|
||
}
|
||
// 取消开启操作
|
||
function setSwitchOpenNone() {
|
||
openAlert.value = false;
|
||
getLinksList();
|
||
}
|
||
function setSwitchOpen(data) {
|
||
setLinkOpen(data)
|
||
.then((res: any) => {
|
||
if (res.code == 200) {
|
||
state.show = true;
|
||
const tag = data.isOpen ? "开启" : "关闭";
|
||
state.msg = tag + "成功";
|
||
// 重新加载列表以同步状态
|
||
getLinksList();
|
||
} else {
|
||
// 失败时恢复开关状态
|
||
getLinksList();
|
||
}
|
||
})
|
||
.catch(() => {
|
||
// 错误时恢复开关状态
|
||
getLinksList();
|
||
})
|
||
.finally(() => {
|
||
openAlert.value = false;
|
||
});
|
||
}
|
||
function onfocus() {
|
||
isScroll.value = false;
|
||
}
|
||
function upOxyU(item) {
|
||
openOxyU.value = true;
|
||
oxyU.value = item.oxyUpperValue;
|
||
oxyD.value = item.oxyLowerValue;
|
||
linkInfo.value = item;
|
||
}
|
||
function upOxyD(item) {
|
||
openOxyD.value = true;
|
||
oxyU.value = item.oxyUpperValue;
|
||
oxyD.value = item.oxyLowerValue;
|
||
linkInfo.value = item;
|
||
}
|
||
function setOxyEventU() {
|
||
const u =
|
||
oxyU.value != null && oxyU.value != undefined && oxyU.value != ""
|
||
? Number(oxyU.value)
|
||
: null;
|
||
const l =
|
||
oxyD.value != null && oxyD.value != undefined && oxyD.value != ""
|
||
? Number(oxyD.value)
|
||
: null;
|
||
if (u == null || u == undefined || u == "") {
|
||
state.show = true;
|
||
state.msg = "请输入溶解氧上限";
|
||
return;
|
||
}
|
||
if (u && (Number(u) < 1 || Number(u) > 20)) {
|
||
state.show = true;
|
||
state.msg = "溶解氧上限范围1~20";
|
||
return;
|
||
}
|
||
if (u && l) {
|
||
if (Number(u) <= Number(l)) {
|
||
state.show = true;
|
||
state.msg = "溶解氧上限必须大于下限，且差值不能小于1Mg/L";
|
||
return;
|
||
} else {
|
||
const c = Number(u) - Number(l);
|
||
if (c < 1) {
|
||
state.show = true;
|
||
state.msg = "溶解氧上限必须大于下限，且差值不能小于1Mg/L";
|
||
return;
|
||
}
|
||
}
|
||
}
|
||
linkInfo.value.oxyUpperValue = u;
|
||
// linkInfo.value.oxyLowerValue = l
|
||
updateOxy(linkInfo.value);
|
||
}
|
||
function setOxyEventD() {
|
||
const u =
|
||
oxyU.value != null && oxyU.value != undefined && oxyU.value != ""
|
||
? Number(oxyU.value)
|
||
: null;
|
||
const l =
|
||
oxyD.value != null && oxyD.value != undefined && oxyD.value != ""
|
||
? Number(oxyD.value)
|
||
: null;
|
||
|
||
if (l == null || l == undefined || l == "") {
|
||
state.show = true;
|
||
state.msg = "请输入溶解氧下限";
|
||
return;
|
||
}
|
||
if (l && (Number(l) < 1 || Number(l) > 20)) {
|
||
state.show = true;
|
||
state.msg = "溶解氧下限范围1~20";
|
||
return;
|
||
}
|
||
if (u && l) {
|
||
if (Number(u) <= Number(l)) {
|
||
state.show = true;
|
||
state.msg = "溶解氧上限必须大于下限，且差值不能小于1Mg/L";
|
||
return;
|
||
} else {
|
||
const c = Number(u) - Number(l);
|
||
if (c < 1) {
|
||
state.show = true;
|
||
state.msg = "溶解氧上限必须大于下限，且差值不能小于1Mg/L";
|
||
return;
|
||
}
|
||
}
|
||
}
|
||
linkInfo.value.oxyLowerValue = l;
|
||
// linkInfo.value.oxyUpperValue = u
|
||
updateOxy(linkInfo.value);
|
||
}
|
||
function updateOxy(item) {
|
||
params.value.id = item.id;
|
||
params.value.deviceId = item.deviceId;
|
||
params.value.oxyWarnUpper = item.oxyUpperValue;
|
||
params.value.oxyWarnLower = item.oxyLowerValue;
|
||
const ids: number[] = [];
|
||
if (item.listSwitch && item.listSwitch.length > 0) {
|
||
item.listSwitch.forEach((res: any) => {
|
||
ids.push(res.id);
|
||
});
|
||
}
|
||
params.value.listSwitchId = ids;
|
||
upHandler();
|
||
}
|
||
function upHandler() {
|
||
updateLinkerCtrl(params.value)
|
||
.then((res) => {
|
||
if (res.code == 200) {
|
||
state.show = true;
|
||
state.msg = "编辑成功";
|
||
getLinksList();
|
||
return;
|
||
}
|
||
})
|
||
.finally(() => {
|
||
oncancelUp();
|
||
openOxyD.value = false;
|
||
openOxyU.value = false;
|
||
});
|
||
}
|
||
/** method end--------------------- */
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
.link_home {
|
||
width: 100%;
|
||
height: 100%;
|
||
background-image: url("https://www.yuceyun.cn/wechat/bg.jpg");
|
||
background-color: #e5ebed;
|
||
background-repeat: no-repeat;
|
||
background-size: 100% 100%;
|
||
position: fixed;
|
||
margin: 0;
|
||
|
||
font-size: 32px;
|
||
font-family: "PingFang SC";
|
||
font-weight: 400;
|
||
|
||
.body {
|
||
padding: 20px;
|
||
|
||
.title {
|
||
font-size: 36px;
|
||
font-weight: bold;
|
||
color: #222;
|
||
margin-bottom: 20px;
|
||
}
|
||
|
||
.t_desc {
|
||
font-size: 32px;
|
||
color: #e22323;
|
||
}
|
||
|
||
.t_desc_update {
|
||
font-size: 32px;
|
||
color: #17b4b2;
|
||
margin-right: 20px;
|
||
}
|
||
|
||
.link_body {
|
||
padding: 20px;
|
||
|
||
.nut-cell__title {
|
||
font-size: 32px;
|
||
color: #666;
|
||
}
|
||
|
||
.desc {
|
||
font-size: 30px;
|
||
color: #222;
|
||
font-weight: bold;
|
||
}
|
||
|
||
.rjy {
|
||
font-size: 32px;
|
||
color: #17b4b2;
|
||
}
|
||
}
|
||
|
||
.d_desc {
|
||
font-size: 32px;
|
||
color: #929a9b;
|
||
}
|
||
}
|
||
|
||
.nut-dialog {
|
||
padding: 0;
|
||
}
|
||
|
||
.nut-dialog__content {
|
||
margin: 0;
|
||
max-height: 100%;
|
||
}
|
||
|
||
.nut-input {
|
||
padding: 20rpx 0;
|
||
}
|
||
|
||
.btn {
|
||
width: 100%;
|
||
position: fixed;
|
||
bottom: 30px;
|
||
// padding: 20px;
|
||
}
|
||
}
|
||
</style>
|