|
|
@@ -85,15 +85,23 @@
|
|
|
<el-color-picker v-model="form.bgColor" />
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
- <!-- <el-col :span="12">
|
|
|
+ <el-col :span="12">
|
|
|
<el-form-item label="字体颜色">
|
|
|
<el-color-picker v-model="form.labelColor" />
|
|
|
</el-form-item>
|
|
|
- </el-col> -->
|
|
|
+ </el-col>
|
|
|
</el-row>
|
|
|
<el-form-item label="楼层标签">
|
|
|
<div class="label-list">
|
|
|
- <el-tag v-for="(tag, index) in form.labels" :key="index" closable type="info" class="label-tag" @close="handleRemoveLabel(index)">
|
|
|
+ <el-tag
|
|
|
+ v-for="(tag, index) in form.labels"
|
|
|
+ :key="index"
|
|
|
+ closable
|
|
|
+ type="info"
|
|
|
+ class="label-tag"
|
|
|
+ @close="handleRemoveLabel(index)"
|
|
|
+ @click="handleEditLabel(tag, index)"
|
|
|
+ >
|
|
|
{{ tag.labelName }}
|
|
|
</el-tag>
|
|
|
<el-button size="small" @click="handleAddLabel">添加标签</el-button>
|
|
|
@@ -107,7 +115,7 @@
|
|
|
</el-dialog>
|
|
|
|
|
|
<!-- 添加标签对话框 -->
|
|
|
- <el-dialog v-model="labelDialog.visible" title="添加标签" width="550px" append-to-body>
|
|
|
+ <el-dialog v-model="labelDialog.visible" :title="editingLabelIndex >= 0 ? '编辑标签' : '添加标签'" width="550px" append-to-body>
|
|
|
<el-form ref="labelFormRef" :model="labelForm" :rules="labelRules" label-width="80px">
|
|
|
<el-row :gutter="20">
|
|
|
<el-col :span="12">
|
|
|
@@ -281,12 +289,27 @@ const handleManage = (row: any) => {
|
|
|
});
|
|
|
};
|
|
|
|
|
|
+// 编辑中的标签索引,-1 表示新增
|
|
|
+const editingLabelIndex = ref(-1);
|
|
|
+
|
|
|
// 添加标签
|
|
|
const handleAddLabel = () => {
|
|
|
+ editingLabelIndex.value = -1;
|
|
|
labelForm.value = { labelName: '', labelLink: '', labelDescribe: '' };
|
|
|
labelDialog.visible = true;
|
|
|
};
|
|
|
|
|
|
+// 编辑标签
|
|
|
+const handleEditLabel = (tag: any, index: number) => {
|
|
|
+ editingLabelIndex.value = index;
|
|
|
+ labelForm.value = {
|
|
|
+ labelName: tag.labelName || '',
|
|
|
+ labelLink: tag.labelLink || '',
|
|
|
+ labelDescribe: tag.labelDescribe || ''
|
|
|
+ };
|
|
|
+ labelDialog.visible = true;
|
|
|
+};
|
|
|
+
|
|
|
// 移除标签
|
|
|
const handleRemoveLabel = async (index: number) => {
|
|
|
const label = form.value.labels[index];
|
|
|
@@ -303,22 +326,30 @@ const handleRemoveLabel = async (index: number) => {
|
|
|
form.value.labels.splice(index, 1);
|
|
|
};
|
|
|
|
|
|
-// 确认添加标签
|
|
|
+// 确认添加/编辑标签
|
|
|
const confirmAddLabel = async () => {
|
|
|
await labelFormRef.value?.validate();
|
|
|
|
|
|
- // 如果是编辑模式且有楼层编号,直接调用接口保存
|
|
|
+ const isEdit = editingLabelIndex.value >= 0;
|
|
|
+
|
|
|
if (currentFloorNo.value) {
|
|
|
try {
|
|
|
+ // 编辑模式下先删除旧标签
|
|
|
+ if (isEdit) {
|
|
|
+ const oldLabel = form.value.labels[editingLabelIndex.value];
|
|
|
+ if (oldLabel?.id) {
|
|
|
+ await delFloorLabel(oldLabel.id);
|
|
|
+ }
|
|
|
+ }
|
|
|
await addFloorLabel({
|
|
|
floorNo: currentFloorNo.value,
|
|
|
labelName: labelForm.value.labelName,
|
|
|
labelLink: labelForm.value.labelLink,
|
|
|
labelDescribe: labelForm.value.labelDescribe,
|
|
|
- position: 1, // 1表示楼层顶部标签
|
|
|
+ position: 1,
|
|
|
isShow: '1'
|
|
|
});
|
|
|
- ElMessage.success('添加成功');
|
|
|
+ ElMessage.success(isEdit ? '修改成功' : '添加成功');
|
|
|
// 重新获取标签列表
|
|
|
const labelRes = await listFloorLabel({ floorNo: currentFloorNo.value, position: 1, pageSize: 100 });
|
|
|
form.value.labels = (labelRes.rows || []).map((item: any) => ({
|
|
|
@@ -328,12 +359,17 @@ const confirmAddLabel = async () => {
|
|
|
labelDescribe: item.labelDescribe
|
|
|
}));
|
|
|
} catch (e) {
|
|
|
- ElMessage.error('添加失败');
|
|
|
+ ElMessage.error(isEdit ? '修改失败' : '添加失败');
|
|
|
return;
|
|
|
}
|
|
|
} else {
|
|
|
- // 新增楼层时,先临时存储,等楼层保存后再处理
|
|
|
- form.value.labels.push({ ...labelForm.value });
|
|
|
+ if (isEdit) {
|
|
|
+ // 新增楼层时编辑,直接替换内存中的标签
|
|
|
+ form.value.labels[editingLabelIndex.value] = { ...labelForm.value };
|
|
|
+ } else {
|
|
|
+ // 新增楼层时,先临时存储,等楼层保存后再处理
|
|
|
+ form.value.labels.push({ ...labelForm.value });
|
|
|
+ }
|
|
|
}
|
|
|
labelDialog.visible = false;
|
|
|
};
|