diff --git a/src/views/goods/appCategory/index.vue b/src/views/goods/appCategory/index.vue
index 05be915..c8cd792 100644
--- a/src/views/goods/appCategory/index.vue
+++ b/src/views/goods/appCategory/index.vue
@@ -27,14 +27,12 @@
size="small"
class="w-40"
@keyup.enter="handleInputConfirm(data)"
- @blur="handleInputCancel(node, data)"
+ @blur="treeRef.remove(node)"
/>
编辑
添加
-
- 删除
-
+ 删除
@@ -86,14 +84,6 @@ const handleInputConfirm = async (data: any) => {
curId.value = NaN
}
-// 失焦
-const handleInputCancel = (node: Node, data: Data) => {
- if (data.id === Infinity) {
- remove(node, data)
- }
- curId.value = NaN
-}
-
// 增加类目
const append = async (data: Data) => {
const node = treeRef.value.getNode(data.id)
@@ -116,16 +106,21 @@ const append = async (data: Data) => {
treeRef.value.append(newChild, data)
node.expanded = true
nextTick(() => {
- inputRef.value.focus()
+ const timer = setTimeout(() => {
+ clearTimeout(timer)
+ inputRef.value.focus()
+ }, 500)
})
}
// 删除类目
-const remove = (node: Node, data: Data) => {
- const parent = node.parent
- const children: Tree[] = parent?.data.children || parent?.data
- const index = children.findIndex((d) => d.id === data.id)
- children.splice(index, 1)
+const onDelete = async (node: Node) => {
+ await api.commodity.updateAppCategory.post!({
+ id: node.data.id,
+ isDelete: 1
+ })
+ treeRef.value.remove(node)
+ ElMessage.success('删除成功')
}
const defaultProps = {
diff --git a/src/views/goods/category/index.vue b/src/views/goods/category/index.vue
index a83df88..cf60bca 100644
--- a/src/views/goods/category/index.vue
+++ b/src/views/goods/category/index.vue
@@ -27,83 +27,84 @@
size="small"
class="w-40"
@keyup.enter="handleInputConfirm(data)"
- @blur="handleInputCancel(node, data)"
+ @blur="treeRef.remove(node)"
/>
+
+
+ 新增属性
+
- {{ data.categoryPropertyName }}:
-
+
{{ child.categoryPropertyValue }}
-
+ 新增属性值
-
- 新增属性值
-
-
-
-
-
- 新增属性
-
-
-
删除属性
-
@@ -156,12 +157,14 @@ const handleInputConfirm = async (data: any) => {
curId.value = NaN
}
-// 失焦
-const handleInputCancel = (node: Node, data: Data) => {
- if (data.id === Infinity) {
- remove(node, data)
- }
- curId.value = NaN
+// 删除类目
+const onDelete = async (node: Node) => {
+ await api.commodity.updateCategory.post!({
+ id: node.data.id,
+ isDelete: 1
+ })
+ treeRef.value.remove(node)
+ ElMessage.success('删除成功')
}
// 增加类目
@@ -170,7 +173,7 @@ const append = async (data: Data) => {
curId.value = Infinity
curParentId.value = data.id
const newChild = { id: curId.value, name: '', label2: 'test', hasChild: false }
- if (!node.expanded) {
+ if (!node.childNodes.length) {
await api.commodity.getCategoryList.post!({ parentId: data.id || 0 }).then((res) => {
res.data.forEach((item: any) => {
treeRef.value.append(
@@ -186,18 +189,13 @@ const append = async (data: Data) => {
treeRef.value.append(newChild, data)
node.expanded = true
nextTick(() => {
- inputRef.value.focus()
+ const timer = setTimeout(() => {
+ clearTimeout(timer)
+ inputRef.value.focus()
+ }, 500)
})
}
-// 删除类目
-const remove = (node: Node, data: Data) => {
- const parent = node.parent
- const children: Tree[] = parent?.data.children || parent?.data
- const index = children.findIndex((d) => d.id === data.id)
- children.splice(index, 1)
-}
-
const defaultProps = {
label: 'name',
children: 'children',
@@ -222,6 +220,8 @@ const handleLoadNode = (node, resolve) => {
resolve(
res.data.map((item: any) => ({
...item,
+ vvCategoryPropertyDTOList: item.vvCategoryPropertyDTOList || [],
+ hasOriginChild: item.hasChild,
hasChild: item.hasChild || !!item.vvCategoryPropertyDTOList?.length,
children: item.hasChild ? [] : undefined
}))
@@ -230,12 +230,12 @@ const handleLoadNode = (node, resolve) => {
}
}
-const visibleProperty = ref>({})
+const visiblePropertyValue = ref>({})
const inputPropertyValue = ref('')
const visiblePropertyType = ref>({})
const inputPropertyTypeValue = ref('')
-// 删除类目的属性
+// 删除类目的属性值
const onClosePropertyValue = async (id: number, data: any) => {
const i = data.vvPropertyValueList.findIndex((item: any) => item.id === id)
await api.commodity.deleteCategoryPropertyValue.post!({ id })
@@ -250,27 +250,40 @@ const onAddPropertyValue = async (data: any = {}) => {
categoryPropertyId: data.id,
categoryPropertyValue: inputPropertyValue.value
})
- // testzc 将新增的数据返回到页面中
data.vvPropertyValueList.push(res.data)
}
- visibleProperty.value[data.id] = false
+ visiblePropertyValue.value[data.id] = false
inputPropertyValue.value = ''
ElMessage.success('新增成功')
}
// 新增属性类型
const onAddPropertyType = async (data: any = {}) => {
- console.warn('----- my data is data111: ', data)
+ const node = treeRef.value.getNode(data.id)
if (inputPropertyTypeValue.value) {
- const res = await api.commodity.updateCategoryProperty.post!({
- categoryId: data.categoryId,
- categoryName: data.categoryName,
+ const res = await api.commodity.updateCategoryProperty.post!<{
+ id: number
+ categoryPropertyName: string
+ }>({
+ categoryId: data.id,
+ categoryName: data.name,
categoryPropertyName: inputPropertyTypeValue.value
})
- console.warn('----- my data is data.id: ', data.id)
- res.data.vvPropertyValueList = []
- const newData = res.data
- // testzc把新的数据塞到树里去
+ const newData = {
+ ...res.data,
+ hasChild: 0,
+ isProperty: 1,
+ vvPropertyValueList: []
+ }
+ data.vvCategoryPropertyDTOList.push(newData)
+ if (!node.childNodes.length) {
+ data.vvCategoryPropertyDTOList.forEach((item: any) => {
+ treeRef.value.append({ ...item, hasChild: 0, isProperty: 1 }, data)
+ })
+ } else {
+ treeRef.value.append(newData, data)
+ }
+ node.expanded = true
visiblePropertyType.value[data.id] = false
inputPropertyTypeValue.value = ''
ElMessage.success('新增成功')
@@ -278,15 +291,54 @@ const onAddPropertyType = async (data: any = {}) => {
}
// 删除属性
-const onDeleteProperty = async (id: number) => {
+const onDeleteProperty = async (node: Node, id: number) => {
handleMessageBox({
msg: `是否删除属性?`,
success: api.commodity.deleteCategoryProperty.post!,
data: { id }
}).then(() => {
- // testzc 删除成功后,删除树中的数据
+ treeRef.value.remove(node)
})
}
+
+const propertyTypeInputRef = ref()
+const onClickPropertyTypeBtn = (data: any) => {
+ visiblePropertyType.value[data.id] = true
+ nextTick(() => {
+ propertyTypeInputRef.value.input!.focus()
+ })
+}
+const propertyValueInputRef = ref()
+const onClickPropertyBtn = (data: any) => {
+ visiblePropertyValue.value[data.id] = true
+ nextTick(() => {
+ propertyValueInputRef.value.input!.focus()
+ })
+}
+
+const curPropertyValueId = ref(NaN)
+const inputEditPropertyValue = ref('')
+const editPropertyValueInputRef = ref()
+const onClickPropertyValue = (data: any) => {
+ curPropertyValueId.value = data.id
+ inputEditPropertyValue.value = data.categoryPropertyValue
+ nextTick(() => {
+ const timer = setTimeout(() => {
+ clearTimeout(timer)
+ editPropertyValueInputRef.value[0].input!.focus()
+ }, 500)
+ })
+}
+const onEditPropertyValue = async (data: any) => {
+ await api.commodity.updateCategoryPropertyValue.post!({
+ id: data.id,
+ categoryPropertyValue: inputEditPropertyValue.value
+ })
+ ElMessage.success('编辑成功')
+ data.categoryPropertyValue = inputEditPropertyValue.value
+ curPropertyValueId.value = NaN
+ inputEditPropertyValue.value = ''
+}