xuziqiang/SaaS-lib
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

add:照明系统接口与逻辑补充

Browse Source
This commit is contained in:
chenpingsen
2024-07-26 15:15:32 +08:00
parent 744aae1bba
commit e14bd35fac
3 changed files with 140 additions and 118 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
hx-ai-intelligent/src/api/index.ts
View File

@@ -40,7 +40,7 @@ export const dict = async ({
};
/**
* 获取所有枚举(无需传参)
* 获取所有枚举(参数为数组，可以不传参)
*/
export const getAllEnum = async ({
api = `${BASE_URL}/operation/enum/getAllEnum`,

9
hx-ai-intelligent/src/view/equipmentControl/lightingManage/dialogStyle.less
View File

@@ -3,7 +3,7 @@
right: 496px;
width: 500px;
height: 100%;
z-index: 99;
z-index: 0;
top: 0;
bottom: 0;
margin: auto;
@@ -44,6 +44,9 @@
border-radius: 12px;
border: 2px solid transparent;
border-image: linear-gradient(to bottom, #0077ff, #00f6ff, #000000) 1;
.title-img {
padding-top: 6px;
}
}
.imgText {
display: flex;
@@ -68,6 +71,7 @@
rgba(255, 112, 3, 1) 91.21%,
rgba(255, 129, 3, 1) 100%
);
cursor: pointer;
}
}
.btn-box {
@@ -97,6 +101,9 @@
width: 140px;
height: 35px;
line-height: 35px;
:first-child {
color: white;
}
span {
vertical-align: middle;
}

235
hx-ai-intelligent/src/view/equipmentControl/lightingManage/tabs1.vue
View File

@@ -121,6 +121,9 @@
<div class="control-scene-area" v-show="thisButton2.mode.value == 3">
<div class="control-scene-tab"></div>
<span class="control-scene-text"> 控制场景 </span>
<div v-if="!singleSelection" style="flex: 1; color: red; text-align: right"
>多选模式下会修改当前选中的所有回路</div
>
</div>
<!-- 控制场景按钮部分 -->
<div class="control-scene-btn-area" v-show="thisButton2.mode.value == 3">
@@ -135,15 +138,20 @@
</div>
<!-- 底部按钮区 -->
<div class="bottom">
<a-badge :offset="[-10, 2]" :count="changeList.length">
<a-popconfirm
title="刷新将会取消已作出的修改"
ok-text="确定"
cancel-text="取消"
@confirm="changeConfirm"
@confirm="refresh"
@cancel="changeCancel">
<button class="flushed">刷新</button>
</a-popconfirm>
</a-badge>
<a-spin :spinning="buttonLoading">
<button class="execute" @click="showModal">执行</button>
</a-spin>
</div>
<!-- 点击执行时的弹出框 -->
@@ -153,7 +161,7 @@
<div class="div-operation"></div>
<span class="text-operation">变更内容 </span>
</div>
<div class="j-box" v-for="item in cxList" :key="item.id">
<div class="j-box" v-for="(item, index) in diffList" :key="item.id">
<div class="journal" style="margin-top: 20px">
<div class="imgText">
<div class="zjzm">
@@ -161,10 +169,17 @@
<span
class="title-text"
style="font-size: 20px; font-weight: 500; color: rgba(255, 255, 255, 1)"
>{{ item.name }}</span
>{{ item.regionName + ' > ' + item.deviceGroupName }}</span
>
</div>
<button class="cxbtn" @click="delBtn(item.id)">撤销</button>
<a-popconfirm
title="此操作将会撤销修改"
ok-text="确定"
cancel-text="取消"
@confirm="delBtn(item)"
@cancel="changeCancel">
<button class="cxbtn">撤销</button>
</a-popconfirm>
</div>
<div class="btn-box">
<div class="btn-item">
@@ -178,25 +193,38 @@
<div class="btn-item">
<div class="left"> 亮度 </div>
<div class="right">
<span>100lux</span>
<!-- 由于数字0也会被判为false，故只判断undefined 和 null -->
<span>{{
item?.stateBefore?.brightness != undefined ? item.stateBefore.brightness : '--'
}}</span>
<img src="/asset/image/bulbLogo/22406.png" alt="" />
<span>30lux</span>
<span>{{
item?.stateAfter?.brightness != undefined ? item.stateAfter.brightness : '--'
}}</span>
</div>
</div>
<div class="btn-item">
<div class="left"> 控制场景 </div>
<div class="right">
<span>手动</span>
<span>{{
item?.stateBefore?.scene?.label ? item.stateBefore.scene.label : '--'
}}</span>
<img src="/asset/image/bulbLogo/22406.png" alt="" />
<span>自动</span>
<span>{{
item?.stateAfter?.scene?.label ? item.stateAfter.scene.label : '--'
}}</span>
</div>
</div>
<div class="btn-item">
<div class="left"> 色温 </div>
<div class="right">
<span>4000k</span>
<span>{{
item?.stateBefore?.color != undefined ? item.stateBefore.color : '--'
}}</span>
<img src="/asset/image/bulbLogo/22406.png" alt="" />
<span>3800k</span>
<span>
{{ item?.stateAfter?.color != undefined ? item.stateAfter.color : '--' }}
</span>
</div>
</div>
</div>
@@ -206,7 +234,7 @@
<div style="width: 100%; height: 60px"></div>
<div class="button-box">
<button class="cancel" @click="executeVisible = false">取消</button>
<button class="execute">执行</button>
<button class="execute" @click="submitChangeList">执行</button>
</div>
</div>
</a-spin>
@@ -239,7 +267,7 @@
controlScene.value = data.IlluminationScene;
});
};
// 以 1-1 作为默认线路
// 以 1-1 作为默认回路
const setArea = () => {
const data = props.treeData[0];
buttons2.value = data.childList;
@@ -272,14 +300,14 @@
// 按钮区展开与收起状态
const showAllButtonsArea = ref(false);
// 被选中的分区 默认为1
// 被选中的分区 默认为1 用于选中样式渲染
const selectedButton = ref<string | undefined>('1');
// 分区切换
const changeArea = (button: any) => {
// 当前选中按钮
selectedButton.value = button.id;
// 设置当前选中的线路
// 设置当前选中的回路
buttons2.value = button.childList;
// 重置按钮状态
emit('reset');
@@ -287,7 +315,7 @@
button.selected = true;
// 改变俯视图样式
emit('changeArea', button.id);
// 当前选中线路 - 置空
// 当前选中回路 - 置空
resetMode();
// 最近交互过的按钮 - 置空
handleButton.value = '';
@@ -299,7 +327,6 @@
// 最近交互过的按钮id，用于禁用和启用
const handleButton = ref('');
// 面板启用/禁用状态
const isPlanEnabled2 = ref(true);
// 面板启用/禁用切换事件
@@ -309,7 +336,7 @@
return message.info('请选择照明回路');
}
// 获取最近交互过的按钮
const btn: any = buttons2.value.find((button) => button.id === handleButton.value);
const btn: any = buttons2.value.find((button: any) => button.id === handleButton.value);
let panel = +!btn.ctrlStatus;
isLoading.value = true;
http
@@ -334,11 +361,12 @@
// 多选与单选切换事件
const selectAll = () => {
selectAllCheckbox.value = false;
buttons2.value.forEach((button) => {
// 切换时清空当前所有选项
buttons2.value.forEach((button: any) => {
button.selected = false;
});
singleSelection.value = !singleSelection.value;
// 当前选中线路 - 置空
// 当前选中回路 - 置空
resetMode();
// 改变俯视图样式
emit('changeArea', [selectedButton.value]);
@@ -351,8 +379,8 @@
let arr = [selectedButton.value];
// 全选
if (selectAllCheckbox.value) {
buttons2.value.forEach((item, index) => {
// 全选时，默认展示第一条线路的模式-场景按钮
buttons2.value.forEach((item: any, index: number) => {
// 全选时，默认展示第一条回路的模式-场景按钮
if (index == 0) {
thisButton2.value = item;
}
@@ -361,7 +389,7 @@
});
// 全不选
} else {
buttons2.value.forEach((item) => {
buttons2.value.forEach((item: any) => {
item.selected = false;
});
// 全不选时，隐藏模式-场景按钮
@@ -370,9 +398,11 @@
emit('changeArea', arr);
};
// 储存当前选中的线路
// 储存当前选中的回路
const thisButton2 = ref({
code: '',
name: '',
pcode: '',
mode: {
value: -1,
},
@@ -390,13 +420,12 @@
} else {
isPlanEnabled2.value = false;
}
// 选择时反控俯视图
let level1 = selectedButton.value;
let level2 = button.id;
// 单选模式，需将所有其他按钮设为false
if (singleSelection.value) {
buttons2.value.forEach((item) => {
buttons2.value.forEach((item: any) => {
item.selected = false;
});
button.selected = !button.selected;
@@ -405,7 +434,7 @@
// 多选模式传值
button.selected = !button.selected;
const arr = [level1];
buttons2.value.forEach((item) => {
buttons2.value.forEach((item: any) => {
if (item.selected) {
arr.push(item.id);
}
@@ -433,7 +462,7 @@
// 控制模式业务 ====================================================================
// 控制模式 - 按钮切换
const selectButton3 = (button3) => {
const selectButton3 = (button3: any) => {
let checked = thisButton2.value.mode;
console.log(button3.value, '---', checked.value);
// 如果点击了相同的按钮，则未作出修改
@@ -449,11 +478,9 @@
const controlMode = ref([]);
// 场景枚举
const controlScene = ref([]);
// 控制场景 - 当前选择按钮
const selectedButton4 = ref(null);
// 控制场景 - 按钮切换
const selectButton4 = (button4) => {
// 当前选中的线路数据
// 当前选中的回路数据
const data = thisButton2.value;
// 修改前的数据
let before = data.scene.value;
@@ -461,12 +488,12 @@
let after = button4.value;
// 如果没有产生实质性的修改（修改前后相同，则跳出）
if (before === after) {
return;
return message.info('未产生实际修改');
// 产生了修改
} else {
thisButton2.value.scene.value = after;
// 查询之前是否修改过
const result = changeList.value.find((item, index) => {
const result = changeList.value.find((item: any, index: number) => {
item.index = index;
return item.deviceGroup == data.code;
});
@@ -484,7 +511,7 @@
// 如果未产生过修改
} else {
changeList.value.push({
// 线路
// 回路
deviceGroup: data.code,
deviceGroupName: data.name,
// 分区
@@ -498,112 +525,100 @@
}
console.log(changeList.value, 'changeList');
}
thisButton2.value.scene.value = after;
console.log(thisButton2, '222222');
console.log(button4, '44444');
};
// 内侧弹窗 ========================================================================
// 需要修改的内容
const changeList: any = ref([]);
// 需要向后端提交的修改内容
const submitList = ref([]);
const cxList = ref([
{
id: '1',
name: '站厅照明 1区',
manual: '手动',
automatic: '自动',
brightness: '100lux',
brightness2: '30lux',
manual2: '手动',
automatic2: '自动',
brightness3: '4000k',
brightness4: '3800k',
},
{
id: '2',
name: '站厅照明 2区',
manual: '手动',
automatic: '自动',
brightness: '100lux',
brightness2: '30lux',
manual2: '手动',
automatic2: '自动',
brightness3: '4000k',
brightness4: '3800k',
},
{
id: '3',
name: '站厅照明 3区',
manual: '手动',
automatic: '自动',
brightness: '100lux',
brightness2: '30lux',
manual2: '手动',
automatic2: '自动',
brightness3: '4000k',
brightness4: '3800k',
},
]);
//撤销
const delBtn = () => {
cxList.value.pop();
console.log(cxList.value.length);
if (cxList.value.length === 0) {
executeVisible.value = false;
}
};
// 其他业务 ========================================================================
// 底部按钮区 ======================================================================
const isLoading = ref(false);
// 执行按钮loading
const buttonLoading = ref(false);
// 刷新
const refresh = () => {
// 关闭执行弹窗
executeVisible.value = false;
// 设置当前选中的序列
selectedButton.value = '1';
// 重置选中样式 和 按钮选中状态
emit('changeArea', ['1']);
emit('reset');
// 默认选择第一个楼层
let data = props.treeData[0];
// 清空保存的修改
changeList.value = [];
// 默认选中
data.selected = true;
// 默认选中 1-1 分区 回路
buttons2.value = data.childList;
selectedButton4.value = null;
resetMode();
};
// 执行确认
const executeVisible = ref<boolean>(false);
// 右下角的执行事件
const showModal = () => {
if (!changeList.value.length) {
return message.info('未产生任何修改');
}
buttonLoading.value = true;
http
.post(lightingManage.getChangeList, { infoList: changeList.value, projectId: 'HLlmTZp8' })
.then((res) => {
if (res.msg === 'success') {
isLoading.value = true;
console.log(res);
} else {
isLoading.value = false;
}
});
diffList.value = res.data;
executeVisible.value = true;
} else {
message.warning('获取修改内容失败');
}
buttonLoading.value = false;
})
.catch(() => {
buttonLoading.value = false;
});
};
// 确定
const changeConfirm = () => {
refresh();
};
// 取消
// 通用取消
const changeCancel = () => {};
// 将当前选择的线路置空
// 内侧弹窗 ========================================================================
// 内侧弹窗显隐
const executeVisible = ref<boolean>(false);
// 修改模式 需要向后端提交的内容
const changeList: any = ref([]);
// 展示修改前后差异的内容
const diffList = ref([]);
//撤销
const delBtn = (obj: any) => {
console.log(obj, '当前选择的修改内容');
// 将treeData对应回路的数据改回，数据以后端为准
const area = props.treeData.find((item: any) => {
return item.code == obj.region;
});
const line = area.childList.find((item: any) => {
return item.code == obj.deviceGroup;
});
line.scene.value = obj.stateBefore.scene.value;
// 将 changeList 与 diffList 中记录的修改移除 (排除极端情况)
changeList.value = changeList.value.filter((item: any) => {
return item.deviceGroup !== obj.deviceGroup;
});
diffList.value = diffList.value.filter((item: any) => {
return item.deviceGroup !== obj.deviceGroup;
});
console.log(changeList, 'changeList');
console.log(diffList, 'diffList');
// 如果移除后不再有修改内容，则隐藏弹出框
if (changeList.value.length == 0) {
executeVisible.value = false;
}
};
const submitChangeList = () => {};
// 其他业务 ========================================================================
// 将当前选择的回路置空
const resetMode = () => {
thisButton2.value = {
code: '',
name: '',
pcode: '',
mode: {
value: -1,
},
@@ -613,11 +628,11 @@
};
};
// 暴露
// 向外暴露方法
defineExpose({
// 分区切换
changeArea,
// 线路切换
// 回路切换
changeLine,
});
</script>