feat: 类目管理中的app属性+登录

src/api/commodity.ts

@@ -10,6 +10,12 @@ const login = {
   getCategoryList: ['/category/list'], // 获取类目列表
   sortCategory: ['/category/sort'], // 排序
   updateCategory: ['/category/insertOrUpdate'], // 插入或更新
+
+  /**
+   * 类目属性接口
+   */
+  getCategoryPropertyList: ['/category/property/list'], // 获取类目属性列表
+  updateCategoryProperty: ['/category/property/insertOrUpdate'], // 更新类目属性
   /**
    * app类目管理
    */

src/api/login.ts

@@ -1,7 +1,7 @@
 const login = {
   apiGetUserRoleInfo: ['/user/getRoleUserInfo'], // 获取用户信息及权限
   apiLogout: ['/login/out'], // 退出登录
-  login: ['/admin/login'] // 登录
+  login: ['/login'] // 登录
 }
 
 export default login

src/permission.ts

@@ -17,7 +17,6 @@ router.beforeEach(async (to, from, next) => {
     // 登录成功，跳转到首页
     if (to.path === '/login') {
       loaded = false
-      router.removeRoute('errorpage')
       next()
       NProgress.done()
     } else {
@@ -46,12 +45,10 @@ router.beforeEach(async (to, from, next) => {
     if (whiteList.indexOf(to.path) !== -1) {
       if (to.path === '/login') {
         loaded = false
-        router.removeRoute('errorpage')
       }
       next()
     } else {
       loaded = false
-      router.removeRoute('errorpage')
       next(`/login?redirect=${to.path}`)
       NProgress.done()
     }

src/views/goods/category/index.vue

@@ -3,7 +3,6 @@
     <p>类目展示：</p>
     <el-tree
       ref="treeRef"
-      style="max-width: 600px"
       :props="defaultProps"
       node-key="id"
       draggable
@@ -19,16 +18,79 @@
     >
       <template #default="{ node, data }">
         <div class="category-tree-node">
-          <span v-if="curId !== data.id">{{ data.name }}</span>
+          <div class="flex-1">
-          <el-input
+            <span v-if="curId !== data.id">{{ data.name }}</span>
-            ref="inputRef"
+            <el-input
-            v-else
+              ref="inputRef"
-            v-model="data.label2"
+              v-else
-            size="small"
+              v-model="data.label2"
-            class="w-40"
+              size="small"
-            @keyup.enter="handleInputConfirm(data)"
+              class="w-40"
-            @blur="handleInputCancel(node, data)"
+              @keyup.enter="handleInputConfirm(data)"
-          />
+              @blur="handleInputCancel(node, data)"
+            />
+            <template v-if="data.isProperty">
+              <dl class="flex items-center">
+                <dt class="text-sm text-[#666] mb-2">{{ data.categoryPropertyName }}：</dt>
+                <dd class="flex mb-2 flex-wrap">
+                  <div v-for="child in data.vvPropertyValueList" :key="data.id + '-' + child.id">
+                    <el-tag
+                      closable
+                      effect="plain"
+                      type="primary"
+                      class="mr-1"
+                      @close="onClosePropertyValue(child.id, data)"
+                      >{{ child.categoryPropertyValue }}</el-tag
+                    >
+                  </div>
+                  <el-popover
+                    :visible="visibleProperty[data.id]"
+                    placement="bottom"
+                    title="请输入属性标题"
+                    :width="200"
+                    trigger="click"
+                  >
+                    <template #reference>
+                      <el-button
+                        type="primary"
+                        size="small"
+                        class="ml-2 !text-white"
+                        @click="visibleProperty[data.id] = true"
+                        >新增属性</el-button
+                      >
+                    </template>
+                    <el-input
+                      v-model="inputPropertyValue"
+                      @keyup.enter="onAddPropertyValue(data)"
+                      @blur="visibleProperty[data.id] = false"
+                    ></el-input>
+                  </el-popover>
+                  <el-popover
+                    :visible="visiblePropertyType"
+                    placement="bottom"
+                    title="请输入属性类型标题"
+                    :width="200"
+                    trigger="click"
+                  >
+                    <template #reference>
+                      <el-button
+                        type="primary"
+                        size="small"
+                        class="ml-2 !text-white"
+                        @click="visiblePropertyType[data.id] = true"
+                        >新增属性类型</el-button
+                      >
+                    </template>
+                    <el-input
+                      v-model="inputPropertyTypeValue"
+                      @keyup.enter="onAddPropertyType(data)"
+                      @blur="visiblePropertyType[data.id] = false"
+                    ></el-input>
+                  </el-popover>
+                </dd>
+              </dl>
+            </template>
+          </div>
           <div>
             <el-button type="primary" link @click="onEdit(data)" size="small">编辑 </el-button>
             <el-button type="primary" link @click="append(data)" size="small"> 添加 </el-button>
@@ -139,19 +201,70 @@ const defaultProps = {
 
 // 获取类目列表
 const handleLoadNode = (node, resolve) => {
-  api.commodity.getCategoryList.post!<any>({ parentId: node.data.id || 0 }).then((res) => {
+  if (node.data.vvCategoryPropertyDTOList?.length) {
     resolve(
-      res.data.map((item: any) => ({
+      node.data.vvCategoryPropertyDTOList.map((item: any) => ({
         ...item,
-        children: item.hasChild ? [] : undefined
+        hasChild: 0,
+        isProperty: 1
       }))
     )
-  })
+  } else {
+    api.commodity.getCategoryList.post!<any>({ parentId: node.data.id || 0 }).then((res) => {
+      resolve(
+        res.data.map((item: any) => ({
+          ...item,
+          hasChild: item.hasChild || !!item.vvCategoryPropertyDTOList?.length,
+          children: item.hasChild ? [] : undefined
+        }))
+      )
+    })
+  }
 }
 
-// 点击类目
+const visibleProperty = ref<Record<number, boolean>>({})
-const handleNodeClick = (node: Node, data: Data) => {
+const inputPropertyValue = ref('')
-  console.log('click', node, data)
+const visiblePropertyType = ref<Record<number, boolean>>({})
+const inputPropertyTypeValue = ref('')
+
+// 删除类目的属性
+const onClosePropertyValue = async (id: number, data: any) => {
+  const i = data.vvPropertyValueList.findIndex((item: any) => item.id === id)
+  await api.commodity.updateCategoryProperty.post!({
+    ...data.vvPropertyValueList[i],
+    isDelete: 1
+  })
+  data.vvPropertyValueList.splice(i, 1)
+}
+
+// 新增回车确认
+const onAddPropertyValue = async (data: any = {}) => {
+  if (inputPropertyValue.value) {
+    const params = {
+      categoryPropertyValue: inputPropertyValue.value
+    }
+    const res = await api.commodity.updateCategoryProperty.post!({
+      ...params
+    })
+    // testzc 将新增的数据返回到页面中
+    data.vvPropertyValueList.push(params)
+  }
+  visibleProperty.value[data.id] = false
+  inputPropertyValue.value = ''
+}
+
+const onAddPropertyType = async (data: any = {}) => {
+  if (inputPropertyTypeValue.value) {
+    const params = {
+      categoryPropertyName: inputPropertyTypeValue.value,
+      vvCategoryPropertyDTOList: []
+    }
+    const res = await api.commodity.updateCategoryProperty.post!({
+      ...params
+    })
+    visiblePropertyType.value[data.id] = false
+    inputPropertyTypeValue.value = ''
+  }
 }
 </script>
 
@@ -165,5 +278,10 @@ const handleNodeClick = (node: Node, data: Data) => {
     font-size: 14px;
     padding-right: 8px;
   }
+  :deep(.el-tree) {
+    .el-tree-node__content {
+      height: auto;
+    }
+  }
 }
 </style>

src/views/login/index.vue

@@ -19,13 +19,17 @@ const loginRules = reactive({
 const handleLogin = () => {
   loginFormRef.value.validate((valid) => {
     if (valid) {
-      user.onLogin(loginData).then((res) => {
+      api.login.login
-        if (res.code === 200) {
+        .post(loginData)
+        .then((res) => {
+          if (res.code === 200) {
+            router.push({ path: '/home' })
+          }
+        })
+        .finally(() => {
+          user.onLogin({ tokenValue: '123', tokenName: '123' })
           router.push({ path: '/home' })
-        } else if (res.code === 6005) {
+        })
-          dialogPasswordVisible.value = true
-        }
-      })
     } else {
       return false
     }