产品分类页面

src/router/routerLXF.js

@@ -7,14 +7,29 @@ export function routesLXF() {
     },
     {
       path: "materialClassificationAdd",
-      name: "物料添加",
+      name: "物料分类添加",
       component: () => import("../views/product-material/material-classification/add.vue"),
     },
     {
       path: "materialClassificationEdit",
-      name: "物料编辑",
+      name: "物料分类编辑",
       component: () => import("../views/product-material/material-classification/edit.vue"),
     },
+    {
+        path: "productClassification",
+        name: "产品分类",
+        component: () => import("../views/product-material/product-classification/index.vue"),
+      },
+      {
+        path: "productClassificationAdd",
+        name: "产品分类添加",
+        component: () => import("../views/product-material/product-classification/add.vue"),
+      },
+      {
+        path: "productClassificationEdit",
+        name: "产品分类编辑",
+        component: () => import("../views/product-material/product-classification/edit.vue"),
+      },
   ];
   return routesLXF;
 }

src/views/product-material/product-classification/add.vue

@@ -0,0 +1,43 @@
+<template>
+  <div class="form">
+    <van-nav-bar title="产品分类添加" left-text="返回" left-arrow @click-left="onClickLeft"> </van-nav-bar>
+    <van-form @submit="onSubmit" label-align="top" style="margin-top: 20px">
+      <van-cell-group inset>
+        <van-field
+          v-model="formData.name"
+          name="节点名称"
+          label="节点名称"
+          placeholder="请填写节点名称"
+          :rules="[{ required: true, message: '节点名称不能为空' }]"
+          required />
+      </van-cell-group>
+      <div style="margin: 16px">
+        <van-button round block type="primary" native-type="submit"> 提交 </van-button>
+      </div>
+    </van-form>
+  </div>
+</template>
+
+<script setup>
+import { ref, getCurrentInstance } from "vue";
+import { showSuccessToast } from "vant";
+import { useRoute } from "vue-router";
+const proxy = getCurrentInstance().proxy;
+const route = useRoute();
+const formData = ref({ name: null });
+const onClickLeft = () => history.back();
+const onSubmit = () => {
+  proxy
+    .post("/productClassify/add", {
+      name: formData.value.name,
+      parentId: route.query.parentId,
+      definition: "1",
+    })
+    .then(() => {
+      showSuccessToast("添加成功");
+      setTimeout(() => {
+        history.back();
+      }, 500);
+    });
+};
+</script>

src/views/product-material/product-classification/edit.vue

@@ -0,0 +1,44 @@
+<template>
+    <div class="form">
+      <van-nav-bar title="产品分类编辑" left-text="返回" left-arrow @click-left="onClickLeft"> </van-nav-bar>
+      <van-form @submit="onSubmit" label-align="top" style="margin-top: 20px">
+        <van-cell-group inset>
+          <van-field
+            v-model="formData.name"
+            name="节点名称"
+            label="节点名称"
+            placeholder="请填写节点名称"
+            :rules="[{ required: true, message: '节点名称不能为空' }]"
+            required />
+        </van-cell-group>
+        <div style="margin: 16px">
+          <van-button round block type="primary" native-type="submit"> 提交 </van-button>
+        </div>
+      </van-form>
+    </div>
+  </template>
+  
+  <script setup>
+  import { ref, getCurrentInstance } from "vue";
+  import { showSuccessToast } from "vant";
+  import { useRoute } from "vue-router";
+  const proxy = getCurrentInstance().proxy;
+  const route = useRoute();
+  const formData = ref({ name: route.query.name });
+  const onClickLeft = () => history.back();
+  const onSubmit = () => {
+    proxy
+      .post("/productClassify/edit", {
+        name: formData.value.name,
+        id: route.query.id,
+        definition: "1",
+      })
+      .then(() => {
+        showSuccessToast("编辑成功");
+        setTimeout(() => {
+          history.back();
+        }, 500);
+      });
+  };
+  </script>
+  

src/views/product-material/product-classification/index.vue

@@ -0,0 +1,115 @@
+<template>
+  <div style="padding-bottom: 60px">
+    <van-nav-bar title="产品分类" left-text="" left-arrow @click-left="onClickLeft"> </van-nav-bar>
+    <van-pull-refresh v-model="loading" @refresh="onRefresh">
+      <div class="list">
+        <van-list v-model:loading="loading" :finished="finished" finished-text="" @load="onLoad" style="margin-bottom: 60px">
+          <commonList :data="[]" :config="listConfig"> </commonList>
+          <treeNav
+            :tree-data="listData"
+            @clickAdd="(item) => clickAdd(item)"
+            @clickUpdate="(item) => clickUpdate(item)"
+            @clickDelete="(item) => clickDelete(item)">
+          </treeNav>
+          <div style="margin: 16px">
+            <van-button round block type="primary" @click="clickAdd({ id: '' })">添加一级节点</van-button>
+          </div>
+        </van-list>
+      </div>
+    </van-pull-refresh>
+  </div>
+</template>
+<script setup>
+import { ref, getCurrentInstance } from "vue";
+import commonList from "@/components/common-list.vue";
+import treeNav from "@/components/tree-nav.vue";
+import { useRoute } from "vue-router";
+import { showConfirmDialog } from "vant";
+import { showSuccessToast } from "vant";
+
+const loading = ref(false);
+const router = useRoute();
+const req = ref({
+  pageNum: 1,
+  type: "1",
+  keyword: null,
+});
+const finished = ref(false);
+const proxy = getCurrentInstance().proxy;
+const listData = ref([]);
+const listConfig = ref([
+  {
+    label: "",
+    prop: "label",
+  },
+]);
+const onRefresh = () => {
+  finished.value = false;
+  getList("refresh");
+};
+const onLoad = () => {
+  getList();
+};
+const onClickLeft = () => proxy.$router.push("/main/working");
+const getList = (type) => {
+  loading.value = true;
+  proxy
+    .post("/productClassify/tree", { parentId: "", name: "", definition: "1" })
+    .then((res) => {
+      listData.value = res.data;
+      finished.value = true;
+      loading.value = false;
+    })
+    .catch((err) => {
+      loading.value = false;
+    });
+};
+const clickAdd = (row) => {
+  proxy.$router.push({
+    path: "/main/productClassificationAdd",
+    query: {
+      parentId: row.id,
+    },
+  });
+};
+const clickUpdate = (row) => {
+  proxy.$router.push({
+    path: "/main/productClassificationEdit",
+    query: {
+      id: row.id,
+      name: row.label,
+    },
+  });
+};
+const clickDelete = (row) => {
+  showConfirmDialog({
+    title: "标题",
+    message: "是否确认删除该分类",
+  })
+    .then(() => {
+      proxy
+        .post("/productClassify/delete", {
+          id: row.id,
+        })
+        .then((res) => {
+          showSuccessToast("删除成功");
+          getList();
+        });
+    })
+    .catch(() => {
+      // on cancel
+    });
+};
+getList();
+</script>
+
+<style lang="scss" scoped>
+.list {
+  min-height: 70vh;
+}
+::v-deep {
+  .van-collapse-item__content {
+    padding: 8px 0 8px 8px !important;
+  }
+}
+</style>