|
|
|
@ -5,12 +5,6 @@ |
|
|
|
<div class="light-area"> |
|
|
|
<div class="light-area-tab"></div> |
|
|
|
<span class="light-area-text"> 照明区域 </span> |
|
|
|
<button |
|
|
|
class="plan" |
|
|
|
:class="{ enabled: isPlanEnabled, disabled: !isPlanEnabled }" |
|
|
|
@click="togglePlan"> |
|
|
|
{{ isPlanEnabled ? '计划启用' : '计划禁用' }} |
|
|
|
</button> |
|
|
|
</div> |
|
|
|
<!-- 照明区域按钮部分 --> |
|
|
|
<div class="area"> |
|
|
|
@ -142,7 +136,7 @@ |
|
|
|
title="刷新将会取消已作出的修改" |
|
|
|
ok-text="确定" |
|
|
|
cancel-text="取消" |
|
|
|
@confirm="refresh" |
|
|
|
@confirm="refresh(false)" |
|
|
|
@cancel="changeCancel"> |
|
|
|
<button class="flushed">刷新</button> |
|
|
|
</a-popconfirm> |
|
|
|
@ -233,7 +227,14 @@ |
|
|
|
<div style="width: 100%; height: 60px"></div> |
|
|
|
<div class="button-box"> |
|
|
|
<button class="cancel" @click="executeVisible = false">取消</button> |
|
|
|
<button class="execute" @click="submitChangeList">执行</button> |
|
|
|
<a-popconfirm |
|
|
|
title="此操作将提交以上修改内容" |
|
|
|
ok-text="确定" |
|
|
|
cancel-text="取消" |
|
|
|
@confirm="submitChangeList" |
|
|
|
@cancel="changeCancel"> |
|
|
|
<button class="execute">执行</button> |
|
|
|
</a-popconfirm> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</a-spin> |
|
|
|
@ -277,18 +278,12 @@ |
|
|
|
/** 向上传递方法 |
|
|
|
* @method changeArea 用于控制俯视图的选中状态 |
|
|
|
* @method reset 用于重置按钮区 |
|
|
|
* @method reload 用于刷新一次页面 |
|
|
|
*/ |
|
|
|
const emit = defineEmits(['changeArea', 'reset']); |
|
|
|
const emit = defineEmits(['changeArea', 'reset', 'reload']); |
|
|
|
|
|
|
|
// 照明区域业务 ======================================================================= |
|
|
|
|
|
|
|
// 计划启用状态 |
|
|
|
const isPlanEnabled = ref(false); |
|
|
|
// 计划启用切换事件 |
|
|
|
const togglePlan = () => { |
|
|
|
isPlanEnabled.value = !isPlanEnabled.value; |
|
|
|
}; |
|
|
|
|
|
|
|
// 按钮区展开与收起状态 |
|
|
|
const showAllButtonsArea = ref(false); |
|
|
|
// 被选中的分区 默认为1 用于选中样式渲染 |
|
|
|
@ -396,15 +391,9 @@ |
|
|
|
|
|
|
|
// 储存当前选中的回路 |
|
|
|
const thisButton2 = ref({ |
|
|
|
code: '', |
|
|
|
dataCode: '', |
|
|
|
name: '', |
|
|
|
pcode: '', |
|
|
|
mode: { |
|
|
|
value: -1, |
|
|
|
}, |
|
|
|
scene: { |
|
|
|
value: -1, |
|
|
|
}, |
|
|
|
treePid: '', |
|
|
|
childList: [], |
|
|
|
}); |
|
|
|
// 照明回路的按钮切换 |
|
|
|
@ -443,11 +432,15 @@ |
|
|
|
// 发生了选中事件 |
|
|
|
thisButton2.value = button; |
|
|
|
// 获得启动模式 |
|
|
|
thisButton3.value = button.childList.find((item: any) => { |
|
|
|
if (item.selectAble) { |
|
|
|
return item.childList ? item.childList : []; |
|
|
|
} |
|
|
|
}); |
|
|
|
if (button.childList) { |
|
|
|
thisButton3.value = button.childList.find((item: any) => { |
|
|
|
if (item.selectAble) { |
|
|
|
return item.childList ? item.childList : []; |
|
|
|
} |
|
|
|
}); |
|
|
|
} else { |
|
|
|
thisButton3.value = { childList: [] }; |
|
|
|
} |
|
|
|
} else { |
|
|
|
// 未发生选中 或 多选的其中一个按钮被取消 |
|
|
|
resetMode(); |
|
|
|
@ -479,52 +472,113 @@ |
|
|
|
// 控制场景业务 ===================================================================== |
|
|
|
|
|
|
|
// 控制场景 - 按钮切换 |
|
|
|
const selectButton4 = (button4) => { |
|
|
|
// 当前选中的回路数据 |
|
|
|
const data = thisButton2.value; |
|
|
|
// 修改前的数据 |
|
|
|
let before = data.scene.value; |
|
|
|
// 修改后的数据 |
|
|
|
let after = button4.value; |
|
|
|
const selectButton4 = (button4: any) => { |
|
|
|
const after = button4.dataCode; |
|
|
|
let before = ''; |
|
|
|
// 如果是多选模式 |
|
|
|
if (!singleSelection.value) { |
|
|
|
// 操作线路总数 |
|
|
|
let sum = 0; |
|
|
|
// 没有这个选项的线路 |
|
|
|
// let nofind = 0; |
|
|
|
// 修改无效的数量 |
|
|
|
let checked = 0; |
|
|
|
// 可修改的数量 |
|
|
|
let changed = 0; |
|
|
|
buttons2.value.forEach((item: any) => { |
|
|
|
// 取出当前选中的值 before |
|
|
|
if (item.childList) { |
|
|
|
let mode = item.childList.find((lv3: any) => { |
|
|
|
return lv3.selectAble; |
|
|
|
}); |
|
|
|
if (mode.childList) { |
|
|
|
mode.childList.forEach((mode: any) => { |
|
|
|
// 取出当前选中的模式 |
|
|
|
if (mode.executeStatus.value == 1) { |
|
|
|
before = mode.dataCode; |
|
|
|
} |
|
|
|
}); |
|
|
|
} |
|
|
|
} |
|
|
|
// 查看当前回路，哪些被选中 |
|
|
|
if (item.selected) { |
|
|
|
changeScene(item, item.scene.value, after); |
|
|
|
item.scene.value = after; |
|
|
|
item.childList.forEach((v: any) => { |
|
|
|
if (v.childList) { |
|
|
|
v.childList.forEach((v1: any) => { |
|
|
|
// 查看是否包含当前要修改的值 |
|
|
|
if (v1.dataCode == after) { |
|
|
|
sum += 1; |
|
|
|
// 已经被选中，无需修改的内容 |
|
|
|
if (before == after) { |
|
|
|
return (checked += 1); |
|
|
|
// 修改 |
|
|
|
} else { |
|
|
|
changed += 1; |
|
|
|
changeScene(v1, before, after, item); |
|
|
|
v1.executeStatus.value = 1; |
|
|
|
} |
|
|
|
// 不符合条件的全部重置 |
|
|
|
} else { |
|
|
|
v1.executeStatus.value = 0; |
|
|
|
} |
|
|
|
}); |
|
|
|
} |
|
|
|
}); |
|
|
|
} |
|
|
|
}); |
|
|
|
thisButton2.value.scene.value = after; |
|
|
|
return message.info('已修改X项'); |
|
|
|
message.info(`共修改${sum}条数据，其中${checked}条无需修改，${changed}条修改有效`); |
|
|
|
// 如果是单选模式 |
|
|
|
} else { |
|
|
|
// 如果没有产生实质性的修改（修改前后相同，则跳出） |
|
|
|
if (before === after) { |
|
|
|
// 如果按钮已经被选择 |
|
|
|
if (button4.executeStatus.value == 1) { |
|
|
|
return message.info('未产生实际修改'); |
|
|
|
// 产生了修改 |
|
|
|
} else { |
|
|
|
changeScene(data, before, after); |
|
|
|
// 获得线路当前的场景 |
|
|
|
let before; |
|
|
|
thisButton2.value.childList.find((item: any) => { |
|
|
|
if (item.childList) { |
|
|
|
item.childList.forEach((i: any) => { |
|
|
|
if (i.executeStatus.value == 1) { |
|
|
|
return (before = i.dataCode); |
|
|
|
} |
|
|
|
}); |
|
|
|
} |
|
|
|
}); |
|
|
|
// 移除选中场景 |
|
|
|
resetScene(thisButton2.value.childList); |
|
|
|
changeScene(button4, before, after); |
|
|
|
} |
|
|
|
} |
|
|
|
}; |
|
|
|
// 切换场景前，需要把其他场景移除 |
|
|
|
const resetScene = (list: any) => { |
|
|
|
list.forEach((item: any) => { |
|
|
|
if (item.childList) { |
|
|
|
item.childList.forEach((i: any) => { |
|
|
|
i.executeStatus.value = 0; |
|
|
|
}); |
|
|
|
} |
|
|
|
}); |
|
|
|
}; |
|
|
|
|
|
|
|
/** 控制场景 - 按钮切换通用方法（单选 & 多选） |
|
|
|
* @param button 当前被选中的回路（单选 & 多选） |
|
|
|
* @param before 回路场景的初始值（撤回时需使用） |
|
|
|
* @param after 回路场景被修改后的值 |
|
|
|
* @param anyButton 多选时使用 |
|
|
|
*/ |
|
|
|
const changeScene = (button: any, before: number, after: number) => { |
|
|
|
// 查询之前是否修改过 |
|
|
|
const changeScene = (button: any, before: string | undefined, after: string, line = null) => { |
|
|
|
// 通过分组ID，查询之前是否修改过 |
|
|
|
const result = changeList.value.find((item: any, index: number) => { |
|
|
|
item.index = index; |
|
|
|
return item.deviceGroup == button.dataCode; |
|
|
|
return item.deviceGroup == button.treePid.split('_')[0]; |
|
|
|
}); |
|
|
|
// 如果已产生过修改 |
|
|
|
if (result) { |
|
|
|
// 改回了原有的值，则从数组中移除 |
|
|
|
if (after == result.before) { |
|
|
|
changeList.value.splice(result.index, 1); |
|
|
|
// 修改为新值，则只修改after |
|
|
|
// 修改为新值，则只修改场景 |
|
|
|
} else { |
|
|
|
result.scene = after; |
|
|
|
// 临时flag，用后移除 |
|
|
|
@ -532,20 +586,27 @@ |
|
|
|
} |
|
|
|
// 如果未产生过修改 |
|
|
|
} else { |
|
|
|
let nowButton; |
|
|
|
// 多选，则使用第四个参数 |
|
|
|
if (line) { |
|
|
|
nowButton = line; |
|
|
|
// 如果是单选，则使用thisbotton2 |
|
|
|
} else { |
|
|
|
nowButton = thisButton2.value; |
|
|
|
} |
|
|
|
changeList.value.push({ |
|
|
|
// 回路 |
|
|
|
deviceGroup: button.dataCode, |
|
|
|
deviceGroupName: button.name, |
|
|
|
deviceGroup: nowButton.dataCode, |
|
|
|
deviceGroupName: nowButton.name, |
|
|
|
// 分区 |
|
|
|
region: button.pcode, |
|
|
|
region: nowButton.treePid, |
|
|
|
regionName: '', |
|
|
|
// 修改前 |
|
|
|
before: before, |
|
|
|
// 修改后 |
|
|
|
before, |
|
|
|
scene: after, |
|
|
|
}); |
|
|
|
} |
|
|
|
thisButton2.value.scene.value = after; |
|
|
|
button.executeStatus.value = 1; |
|
|
|
}; |
|
|
|
|
|
|
|
// 底部按钮区 ====================================================================== |
|
|
|
@ -554,7 +615,7 @@ |
|
|
|
// 执行按钮loading |
|
|
|
const buttonLoading = ref(false); |
|
|
|
// 刷新 |
|
|
|
const refresh = () => { |
|
|
|
const refresh = (reload = false) => { |
|
|
|
// 关闭执行弹窗 |
|
|
|
executeVisible.value = false; |
|
|
|
// 设置当前选中的序列 |
|
|
|
@ -562,16 +623,51 @@ |
|
|
|
// 重置选中样式 和 按钮选中状态 |
|
|
|
emit('changeArea', ['1']); |
|
|
|
emit('reset'); |
|
|
|
// 如果是中途刷新，需要将所有修改改回 |
|
|
|
if (!reload) { |
|
|
|
changeList.value.forEach((item: any) => { |
|
|
|
resetChangeList(item); |
|
|
|
}); |
|
|
|
} |
|
|
|
changeList.value = []; |
|
|
|
// 默认选择第一个楼层 |
|
|
|
let data = props.treeData[0]; |
|
|
|
// 清空保存的修改 |
|
|
|
changeList.value = []; |
|
|
|
// 默认选中 |
|
|
|
data.selected = true; |
|
|
|
// 默认选中 1-1 分区 回路 |
|
|
|
buttons2.value = data.childList; |
|
|
|
resetMode(); |
|
|
|
}; |
|
|
|
// 刷新时，将已修改的值改回 |
|
|
|
const resetChangeList = (item: any) => { |
|
|
|
props.treeData.find((v: any) => { |
|
|
|
if (item.region == v.dataCode) { |
|
|
|
v.childList.find((v1: any) => { |
|
|
|
// 找到被修改过的线路 |
|
|
|
if (item.deviceGroup == v1.dataCode) { |
|
|
|
v1.childList.forEach((v2: any) => { |
|
|
|
if (v2.childList) { |
|
|
|
v2.childList.forEach((v3: any) => { |
|
|
|
// 将新值移除 |
|
|
|
if (item.scene == v3.dataCode) { |
|
|
|
v3.executeStatus.value = 0; |
|
|
|
} |
|
|
|
if (!item.before) { |
|
|
|
console.log(item, '没有这个选项'); |
|
|
|
v3.executeStatus.value = 0; |
|
|
|
} |
|
|
|
// 旧值选中 |
|
|
|
if (item.before == v3.dataCode) { |
|
|
|
v3.executeStatus.value = 1; |
|
|
|
} |
|
|
|
}); |
|
|
|
} |
|
|
|
}); |
|
|
|
} |
|
|
|
}); |
|
|
|
} |
|
|
|
}); |
|
|
|
}; |
|
|
|
// 右下角的执行事件 |
|
|
|
const showModal = () => { |
|
|
|
if (!changeList.value.length) { |
|
|
|
@ -580,7 +676,8 @@ |
|
|
|
buttonLoading.value = true; |
|
|
|
http |
|
|
|
.post(lightingManage.getChangeList, { |
|
|
|
infoList: changeList.value, |
|
|
|
sceneList: changeList.value, |
|
|
|
lockList: [], |
|
|
|
projectId: state.projectId, |
|
|
|
siteId: state.siteId, |
|
|
|
}) |
|
|
|
@ -612,13 +709,9 @@ |
|
|
|
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; |
|
|
|
obj.scene = obj.stateAfter.scene.value; |
|
|
|
obj.before = obj.stateBefore.scene.value; |
|
|
|
resetChangeList(obj); |
|
|
|
// 将 changeList 与 diffList 中记录的修改移除 (排除极端情况) |
|
|
|
changeList.value = changeList.value.filter((item: any) => { |
|
|
|
return item.deviceGroup !== obj.deviceGroup; |
|
|
|
@ -633,22 +726,29 @@ |
|
|
|
executeVisible.value = false; |
|
|
|
} |
|
|
|
}; |
|
|
|
const submitChangeList = () => {}; |
|
|
|
// 提交本次修改 |
|
|
|
const submitChangeList = () => { |
|
|
|
http |
|
|
|
.post(lightingManage.submitChangeList, { |
|
|
|
sceneList: changeList.value, |
|
|
|
lockList: [], |
|
|
|
projectId: state.projectId, |
|
|
|
siteId: state.siteId, |
|
|
|
}) |
|
|
|
.then(() => { |
|
|
|
emit('reload'); |
|
|
|
refresh(true); |
|
|
|
}); |
|
|
|
}; |
|
|
|
|
|
|
|
// 其他业务 ======================================================================== |
|
|
|
|
|
|
|
// 将当前选择的回路置空 |
|
|
|
const resetMode = () => { |
|
|
|
thisButton2.value = { |
|
|
|
code: '', |
|
|
|
dataCode: '', |
|
|
|
name: '', |
|
|
|
pcode: '', |
|
|
|
mode: { |
|
|
|
value: -1, |
|
|
|
}, |
|
|
|
scene: { |
|
|
|
value: -1, |
|
|
|
}, |
|
|
|
treePid: '', |
|
|
|
childList: [], |
|
|
|
}; |
|
|
|
}; |
|
|
|
|
zhaohy
4 months ago