仓库修改

web/.env.development

@@ -4,7 +4,10 @@ VITE_CLI_PORT = 8080
 VITE_SERVER_PORT = 8220
 VITE_BASE_API = /api
 VITE_FILE_API = /api
-VITE_BASE_PATH = http://127.0.0.1
+//VITE_BASE_PATH = http://192.168.110.218
+//VITE_BASE_PATH = http://192.168.110.214
+VITE_BASE_PATH = http://192.168.110.231
+//VITE_BASE_PATH = http://127.0.0.1
 VITE_POSITION = close
 VITE_EDITOR = webstorm
 

web/src/api/storehouse.js

@@ -8,12 +8,6 @@ export const querySupplierList = (data) => {
   })
 }
 
-export const queryAllSupplier = () => {
-  return service({
-    url: '/supplier/queryAllSupplier',
-    method: 'get'
-  })
-}
 
 export const createSupplier = (data) => {
   return service({
@@ -273,13 +267,6 @@ export const deletePlace = (data) => {
   })
 }
 
-export const queryAllGoods = () => {
-  return service({
-    url: '/goods/queryAllGoods',
-    method: 'get'
-  })
-}
-
 export const queryGoodsList = (data) => {
   return service({
     url: '/goods/queryGoodsList',
@@ -326,3 +313,70 @@ export const createOutboundManifest = (data) => {
     data
   })
 }
+
+// 查询所有货物
+export const queryAllGoods = () => {
+  return service({
+    url: '/goods/queryAllGoods',
+    method: 'get'
+  })
+}
+
+// 查询所有货品类型
+export const queryGoodsType = () => {
+  return service({
+    url: '/goodsGenre/queryAllGoodsGenres',
+    method: 'GET',
+  })
+}
+
+// 新增货物类型
+export const createGoodsType = (data) => {
+  return service({
+    url: '/goodsGenre/createGoodsGenre',
+    method: 'POST',
+    data
+  })
+}
+
+// 修改货物类型
+export const updateGoodsType = (data) => {
+  return service({
+    url: '/goodsGenre/updateGoodsGenre',
+    method: 'PUT',
+    data
+  })
+}
+
+// 删除货物类型
+export const deleteGoodsType = (id) => {
+  return service({
+    url: '/goodsGenre/deleteGoodsGenre?id=' + id,
+    method: 'DELETE'
+  })
+}
+
+//新增货物
+export const createGoods = () => {
+  return service({
+    url: '/goods/createGoods',
+    method: 'POST'
+  })
+}
+
+//修改货物
+export const updateGoods = () => {
+  return service({
+    url: '/goods/updateGoods',
+    method: 'PUT'
+  })
+}
+
+//删除货物
+export const deleteGoods = () => {
+  return service({
+    url: '/goods/deleteGoods',
+    method: 'DELETE'
+  })
+}
+

web/src/view/storehouse/commodity/commodity.vue

@@ -17,7 +17,7 @@
               />
             </el-form-item>
             <el-form-item>
-              <el-button @click="getData">搜索</el-button>
+              <el-button @click="getData" type="primary">搜索</el-button>
             </el-form-item>
           </el-form>
 
@@ -26,12 +26,12 @@
         <el-col :span="8">
           <el-button
             type="primary"
-            @click="isOpenCommodityAdd = true"
-          >商品新增</el-button>
+            @click="isOpenGoodsAdd = true"
+          >货品新增</el-button>
           <el-button
             type="primary"
             @click="isOpenCommodityGenre = true"
-          >商品类型</el-button>
+          >货品类型</el-button>
         </el-col>
       </el-row>
     </el-header>
@@ -42,7 +42,7 @@
       >
         <el-table-column
           prop="name"
-          label="商品名称"
+          label="货品名称"
           align="center"
         />
         <el-table-column
@@ -90,7 +90,7 @@
       <!--      修改-->
       <el-drawer
         v-model="isOpenCommodityEdit"
-        title="修改供应商信息"
+        title="修改货品信息"
         direction="rtl"
         size="30%"
       >
@@ -101,10 +101,10 @@
             label-width="auto"
             style="max-width: 400px"
           >
-            <el-form-item label="商品名称">
+            <el-form-item label="货品名称">
               <el-input v-model="commodityEditData.name" />
             </el-form-item>
-            <el-form-item label="商品类型">
+            <el-form-item label="货品类型">
               <el-select
                 v-model="commodityEditData.genre"
                 style="width: 240px"
@@ -117,19 +117,6 @@
                 />
               </el-select>
             </el-form-item>
-            <el-form-item label="供应商">
-              <el-select
-                v-model="commodityEditData.supplierId"
-                style="width: 240px"
-              >
-                <el-option
-                  v-for="item in supplierAllData"
-                  :key="item.ID"
-                  :label="item.name"
-                  :value="item.ID"
-                />
-              </el-select>
-            </el-form-item>
             <el-form-item label="单价">
               <el-input
                 v-model="commodityEditData.unitPrice"
@@ -153,73 +140,68 @@
         </div>
       </el-drawer>
       <el-drawer
-        v-model="isOpenCommodityAdd"
-        title="新增供应商信息"
+        v-model="isOpenGoodsAdd"
+        title="新增货品"
         direction="rtl"
         size="30%"
       >
         <div>
           <el-form
-            v-model="commodityAddData"
+            v-model="goodsAddDate"
             label-position="left"
             label-width="auto"
             style="max-width: 400px"
+            size="large"
           >
-            <el-form-item label="商品名称">
-              <el-input v-model="commodityAddData.name" />
+            <el-form-item label="货品名称">
+              <el-input v-model="goodsAddDate.name" />
             </el-form-item>
-            <el-form-item label="商品类型">
+            <el-form-item label="货品类型">
               <el-select
-                v-model="commodityAddData.genre"
+                v-model="goodsAddDate.goodsGenreId"
                 style="width: 240px"
               >
                 <el-option
-                  v-for="item in commodityGenreAllData"
+                  v-for="item in goodsTypeData"
                   :key="item.ID"
                   :label="item.name"
                   :value="item.ID"
                 />
               </el-select>
             </el-form-item>
-            <el-form-item label="供应商">
-              <el-select
-                v-model="commodityAddData.supplierId"
-                style="width: 240px"
-              >
-                <el-option
-                  v-for="item in supplierAllData"
-                  :key="item.ID"
-                  :label="item.name"
-                  :value="item.ID"
-                />
-              </el-select>
+            <el-form-item label="特性">
+              <el-input
+                v-model.number="goodsAddDate.characteristic"
+              />
             </el-form-item>
-            <el-form-item label="单价">
+            <el-form-item label="规格">
               <el-input
-                v-model.number="commodityAddData.unitPrice"
-                type="number"
+                  v-model="goodsAddDate.specifications"
               />
             </el-form-item>
             <el-form-item label="单位">
-              <el-input v-model="commodityAddData.unity" />
+              <el-input v-model="goodsAddDate.unit" />
             </el-form-item>
-            <el-form-item label="备注">
-              <el-input v-model="commodityAddData.remark" />
+            <el-form-item label="数量">
+              <el-input v-model="goodsAddDate.number" type="number"/>
+            </el-form-item>
+            <el-form-item label="位置">
+              <el-input v-model="goodsAddDate.position" />
             </el-form-item>
             <el-form-item>
               <el-button
-                type="primary"
-                @click="commodityAddSubmit"
+                  type="primary"
+                  @click="goodsAddSubmit"
+                  size="large"
               >提交</el-button>
-              <el-button @click="isOpenCommodityAdd = false">关闭</el-button>
             </el-form-item>
           </el-form>
         </div>
       </el-drawer>
-      <!--      商品类型-->
+      <!--      货品类型-->
       <el-drawer
         v-model="isOpenCommodityGenre"
-        title="商品类型"
+        title="货品类型"
         direction="rtl"
         size="50%"
       >
@@ -227,21 +209,25 @@
           <el-button
             type="primary"
             @click="isOpenAddGenre = true"
-          >新增商品类型</el-button>
+          >新增货品类型</el-button>
         </el-header>
+<!--        :data="filterTableData"-->
         <el-main>
-          <el-table :data="filterTableData">
+          <el-table :data="goodsTypeData"  row-key="ID">
             <el-table-column
               label="ID"
               prop="ID"
+              sortable
             />
             <el-table-column
               label="名称"
               prop="name"
+              sortable
             />
             <el-table-column
               label="备注"
               prop="remarks"
+              sortable
             />
             <el-table-column align="right">
               <template #header>
@@ -257,7 +243,7 @@
                 >编辑</el-button>
                 <el-button
                   type="danger"
-                  @click="commodityGenreDeleteSubmit(scope.row)"
+                  @click="omitGoodsType(scope.row)"
                 >删除</el-button>
               </template>
             </el-table-column>
@@ -266,61 +252,108 @@
         <!--        新增-->
         <el-dialog
           v-model="isOpenAddGenre"
-          title="新增商品类型"
-          width="300"
+          title="新增货品类型"
+          width="700"
           align-center
         >
           <template #footer>
-            <el-form>
-              <el-form-item label="名称">
-                <el-input
-                  v-model="commodityGenreAddData.name"
-                  style="width: 240px;"
+            <el-form size="large">
+              <el-form-item>
+                <el-alert
+                    show-icon
+                    title="注意：如果没有选择父级类型那么添加的类型就属于一级货品类型，否则属于二级货品类型"
+                    type="info"
                 />
               </el-form-item>
-              <el-form-item label="备注">
+              <el-form-item label="父级类型：">
+                <el-select
+                    placeholder="请选择父级类型"
+                    v-model="createGoodsTypeData.parentId"
+                    clearable
+                    @clear="createGoodsTypeData.parentId = ''"
+                >
+                  <el-option
+                      v-for="item in goodsTypeData"
+                      :key="item.ID"
+                      :label="item.name"
+                      :value="item.ID"
+                  />
+                </el-select>
+              </el-form-item>
+              <el-form-item label="类型名称：">
                 <el-input
-                  v-model="commodityGenreAddData.remarks"
-                  style="width: 240px;"
+                    placeholder="请输入货物类型名称"
+                    v-model="createGoodsTypeData.name"
+                    clearable
                 />
               </el-form-item>
-              <el-form-item>
-                <el-button
-                  type="primary"
-                  @click="commodityGenreAddSubmit"
-                >提交</el-button>
+              <el-form-item label="类型备注：">
+                <el-input
+                    placeholder="请输入备注"
+                    v-model="createGoodsTypeData.remarks"
+                    clearable
+                />
               </el-form-item>
             </el-form>
+            <div class="dialog-footer">
+              <el-button
+                  @click="isOpenAddGenre = false"
+                  size="large">
+                取消
+              </el-button>
+              <el-button type="primary" @click="increaseGoodsType" size="large">
+                确认
+              </el-button>
+            </div>
           </template>
         </el-dialog>
         <!--        编辑-->
         <el-dialog
           v-model="isOpenUpdateGenre"
-          title="编辑商品类型"
-          width="300"
+          title="编辑货品类型"
+          width="700"
           align-center
         >
           <template #footer>
-            <el-form>
-              <el-form-item label="名称">
+            <el-form size="large">
+              <el-form-item label="父级类型："  v-show="updateGoodsTypeData.parentId !== ''">
+                <el-select
+                    placeholder="请选择父级类型"
+                    v-model="updateGoodsTypeData.parentId"
+                >
+                  <el-option
+                      v-for="item in goodsTypeData"
+                      :key="item.ID"
+                      :label="item.name"
+                      :value="item.ID"
+                  />
+                </el-select>
+              </el-form-item>
+              <el-form-item label="类型名称：">
                 <el-input
-                  v-model="commodityGenreUpdateData.name"
-                  style="width: 240px;"
+                    placeholder="请输入货物类型名称"
+                    v-model="updateGoodsTypeData.name"
+                    clearable
                 />
               </el-form-item>
-              <el-form-item label="备注">
+              <el-form-item label="类型备注：">
                 <el-input
-                  v-model="commodityGenreUpdateData.remarks"
-                  style="width: 240px;"
+                    placeholder="请输入备注"
+                    v-model="updateGoodsTypeData.remarks"
+                    clearable
                 />
               </el-form-item>
-              <el-form-item>
-                <el-button
-                  type="primary"
-                  @click="commodityGenreUpdateSubmit"
-                >提交</el-button>
-              </el-form-item>
             </el-form>
+            <div class="dialog-footer">
+              <el-button
+                  @click="isOpenUpdateGenre = false"
+                  size="large">
+                取消
+              </el-button>
+              <el-button type="primary" @click="modifyGoodsType" size="large">
+                确认
+              </el-button>
+            </div>
           </template>
         </el-dialog>
       </el-drawer>
@@ -329,13 +362,18 @@
 </template>
 
 <script setup>
-import { ref, onMounted, computed } from 'vue'
+import { ref, onMounted, computed, reactive } from 'vue'
 import {
   createCommodity,
   createCommodityGenre, deleteCommodity,
   deleteCommodityGenre,
-  queryAllCommodityGenre, queryAllSupplier, queryCommodityList, updateCommodity,
-  updateCommodityGenre
+  queryAllCommodityGenre,
+  queryGoodsType, updateCommodity,deleteGoodsType,
+  updateCommodityGenre,
+  createGoodsType,
+  updateGoodsType,
+  queryAllGoods,
+  createGoods
 } from '@/api/storehouse'
 import { ElMessage, ElMessageBox } from 'element-plus'
 
@@ -352,6 +390,132 @@ const searchCommodity = ref({
 })
 
 const total = ref(0)
+// 货物类型
+const goodsTypeData = reactive([])
+// 新增货物类型
+const createGoodsTypeData = reactive({
+  name: "",
+  remarks: "",
+  parentId: ""
+})
+
+const increaseGoodsType = async () => {
+  let data = {}
+  data.name = createGoodsTypeData.name
+  data.remarks = createGoodsTypeData.remarks
+  if(createGoodsTypeData.parentId !== '') {
+    data.parentId = createGoodsTypeData.parentId
+  }
+  await createGoodsType(data).then(res => {
+    if (res.code === 0) {
+      ElMessage.success('添加成功')
+      createGoodsTypeData.name = ''
+      createGoodsTypeData.remarks = ''
+      createGoodsTypeData.parentId = ''
+      isOpenAddGenre.value = false
+      getData()
+    } else {
+      ElMessage.error(res.data.msg)
+    }
+  })
+}
+
+// 编辑货品类型
+const updateGoodsTypeData = reactive({
+  id: 0,
+  name: "",
+  remarks: "",
+  parentId: ""
+})
+
+const openUpdateGenre = (val) => {
+  isOpenUpdateGenre.value = true
+  updateGoodsTypeData.id = val.ID
+  updateGoodsTypeData.name = val.name
+  updateGoodsTypeData.remarks = val.remarks
+  val.children === null ? updateGoodsTypeData.parentId = val.parentId : updateGoodsTypeData.parentId = ''
+}
+
+const modifyGoodsType = async () => {
+  let data = {}
+  data.id = updateGoodsTypeData.id
+  data.name = updateGoodsTypeData.name
+  data.remarks = updateGoodsTypeData.remarks
+  if(updateGoodsTypeData.parentId !== '') {
+    data.parentId = updateGoodsTypeData.parentId
+  }
+  await updateGoodsType(data).then(res => {
+    if (res.code === 0) {
+      ElMessage.success('编辑成功')
+      isOpenUpdateGenre.value = false
+      getData()
+    } else {
+      ElMessage.error('编辑失败')
+    }
+  })
+}
+
+//删除货物类型
+const omitGoodsType = (val) => {
+  ElMessageBox.confirm(
+      '将永久删除该信息。是否继续？',
+      '删除',
+      {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      }
+  )
+      .then(async() => {
+        console.log('删除id', val.ID)
+        await deleteGoodsType(val.ID).then(res => {
+          console.log(res)
+          if (res.code === 0) {
+            ElMessage.success('删除成功')
+            getData()
+          } else {
+            ElMessage.error('删除失败')
+          }
+        })
+      })
+      .catch(() => {
+        ElMessage({
+          type: 'info',
+          message: '删除已取消',
+        })
+      })
+}
+
+// 新增
+const goodsAddDate = reactive({
+  name: '',
+  goodsGenreId: '',
+  characteristic: '',
+  specifications: '',
+  unit: '',
+  number: 0,
+  position: ''
+})
+const isOpenGoodsAdd = ref(false)
+
+const goodsAddSubmit = async() => {
+  for (let i in goodsAddDate) {
+    if (goodsAddDate[i] === '' || goodsAddDate[i] === 0) {
+      ElMessage.error('请将数据填写完整')
+      return
+    }
+  }
+  goodsAddDate.number = Number(goodsAddDate.number)
+  await createGoods(goodsAddDate).then(res => {
+    if (res.code === 0) {
+      ElMessage.success('新增成功')
+      getData()
+    } else {
+      ElMessage.error('新增失败')
+    }
+    isOpenGoodsAdd.value = false
+  })
+}
 
 // 分页
 const handleSizeChange = (val) => {
@@ -364,22 +528,29 @@ const handleCurrentChange = (val) => {
   getData()
 }
 
-const supplierAllData = ref()
+// 获取数据
 const getData = async() => {
-  await queryAllCommodityGenre().then(res => {
-    commodityGenreAllData.value = res.data
-  })
-  await queryCommodityList(searchCommodity.value).then(res => {
-    commodityListData.value = res.data.list
-    total.value = res.data.total
+  // await queryAllCommodityGenre().then(res => {
+  //   commodityGenreAllData.value = res.data
+  // })
+  // await queryCommodityList(searchCommodity.value).then(res => {
+  //   commodityListData.value = res.data.list
+  //   total.value = res.data.total
+  // })
+  await queryGoodsType().then(res => {
+    if (res.code === 0) {
+      goodsTypeData.length = 0
+      goodsTypeData.push(...res.data)
+    }
   })
-  await queryAllSupplier().then(res => {
-    console.log(res.data)
-    supplierAllData.value = res.data
+  await queryAllGoods().then(res => {
+    if (res.code === 0) {
+      console.log('所有货物', res.data)
+    }
   })
 }
 
-// 商品类型
+// 货品类型
 const isOpenCommodityGenre = ref(false)
 
 const searchCommodityGenre = ref()
@@ -392,80 +563,12 @@ const filterTableData = computed(() =>
   )
 )
 
-const commodityGenreAddData = ref({
-  name: '',
-})
 const isOpenAddGenre = ref(false)
 
-const commodityGenreAddSubmit = async() => {
-  if (!commodityGenreAddData.value.name) {
-    ElMessage.error('名称不能为空')
-    return
-  }
-  await createCommodityGenre(commodityGenreAddData.value).then(res => {
-    if (res.code === 0) {
-      ElMessage.success('新增成功')
-    } else {
-      ElMessage.error('新增失败')
-    }
-    isOpenAddGenre.value = false
-    getData()
-  })
-}
-
-const commodityGenreUpdateData = ref()
 const isOpenUpdateGenre = ref(false)
 
-const openUpdateGenre = (val) => {
-  isOpenUpdateGenre.value = true
-  commodityGenreUpdateData.value = val
-}
-
-const commodityGenreUpdateSubmit = async() => {
-  if (!commodityGenreUpdateData.value.name) {
-    ElMessage.error('名称不能为空')
-    return
-  }
-  await updateCommodityGenre(commodityGenreUpdateData.value).then(res => {
-    if (res.code === 0) {
-      ElMessage.success('编辑成功')
-    } else {
-      ElMessage.error('编辑失败')
-    }
-    isOpenUpdateGenre.value = false
-    getData()
-  })
-}
-
-const commodityGenreDeleteSubmit = (val) => {
-  ElMessageBox.confirm(
-    '将永久删除该信息。是否继续？',
-    '删除',
-    {
-      confirmButtonText: '确定',
-      cancelButtonText: '取消',
-      type: 'warning',
-    }
-  )
-    .then(async() => {
-      await deleteCommodityGenre(val).then(res => {
-        if (res.code === 0) {
-          ElMessage.success('删除成功')
-          getData()
-        } else {
-          ElMessage.error('删除失败')
-        }
-      })
-    })
-    .catch(() => {
-      ElMessage({
-        type: 'info',
-        message: '删除已取消',
-      })
-    })
-}
 
-// 商品
+// 货品
 const isOpenCommodityEdit = ref(false)
 const commodityEditData = ref()
 const openCommodityEdit = (val) => {
@@ -512,34 +615,6 @@ const commodityDelete = async(val) => {
     })
 }
 
-// 新增
-const commodityAddData = ref({
-  name: '',
-  genre: '',
-  supplierId: '',
-  unitPrice: 0,
-  unity: '',
-  remark: '',
-})
-const isOpenCommodityAdd = ref(false)
-
-const commodityAddSubmit = async() => {
-  if (!commodityAddData.value.name || !commodityAddData.value.genre || !commodityAddData.value.supplierId || commodityAddData.value.unitPrice === 0) {
-    ElMessage.error('数据不能为空')
-    return
-  }
-  console.log(commodityAddData.value)
-  await createCommodity(commodityAddData.value).then(res => {
-    if (res.code === 0) {
-      ElMessage.success('新增成功')
-    } else {
-      ElMessage.error('新增失败')
-    }
-    isOpenCommodityAdd.value = false
-    getData()
-  })
-}
-
 onMounted(() => {
   getData()
 })

web/src/view/storehouse/goods/component/goodsManage.vue

@@ -0,0 +1,608 @@
+<template>
+  <el-container>
+    <el-header
+        class="gva-search-box"
+        style="line-height: 60px"
+    >
+      <el-row>
+        <el-col :span="8">
+          <el-form
+              inline
+              style="margin-top: 10px"
+          >
+            <el-form-item label="名称">
+              <el-input
+                  v-model="searchCommodity.name"
+                  placeholder="请输入名称"
+              />
+            </el-form-item>
+            <el-form-item>
+              <el-button @click="getData" type="primary">搜索</el-button>
+            </el-form-item>
+          </el-form>
+
+        </el-col>
+        <el-col :span="8" />
+        <el-col :span="8">
+          <el-button
+              type="primary"
+              @click="isOpenCommodityAdd = true"
+          >商品新增</el-button>
+<!--          @click="isOpenCommodityGenre = true"-->
+          <el-button
+              type="primary"
+              @click="openTest"
+          >商品类型</el-button>
+        </el-col>
+      </el-row>
+    </el-header>
+    <el-main class="gva-table-box">
+      <el-table
+          :data="commodityListData"
+          style="height: 600px"
+      >
+        <el-table-column
+            prop="name"
+            label="商品名称"
+            align="center"
+        />
+        <el-table-column
+            prop="commodityGenre.name"
+            label="类型"
+            align="center"
+        />
+        <el-table-column
+            prop="supplier.name"
+            label="供应商"
+            align="center"
+        />
+        <el-table-column
+            prop="unitPrice"
+            label="单价"
+            align="center"
+        />
+        <el-table-column label="操作">
+          <template #default="scope">
+            <el-button
+                size="small"
+                type="primary"
+                @click="openCommodityEdit(scope.row)"
+            >编辑</el-button>
+            <el-button
+                size="small"
+                type="danger"
+                @click="commodityDelete(scope.row)"
+            >删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <!--      分页-->
+      <div class="gva-pagination">
+        <el-pagination
+            :current-page="searchCommodity.pageInfo.page"
+            :page-size="searchCommodity.pageInfo.pageSize"
+            :page-sizes="[10, 30, 50, 100]"
+            :total="total"
+            layout="total, sizes, prev, pager, next, jumper"
+            @current-change="handleCurrentChange"
+            @size-change="handleSizeChange"
+        />
+      </div>
+      <!--      修改-->
+      <el-drawer
+          v-model="isOpenCommodityEdit"
+          title="修改供应商信息"
+          direction="rtl"
+          size="30%"
+      >
+        <div>
+          <el-form
+              v-model="commodityEditData"
+              label-position="left"
+              label-width="auto"
+              style="max-width: 400px"
+          >
+            <el-form-item label="商品名称">
+              <el-input v-model="commodityEditData.name" />
+            </el-form-item>
+            <el-form-item label="商品类型">
+              <el-select
+                  v-model="commodityEditData.genre"
+                  style="width: 240px"
+              >
+                <el-option
+                    v-for="item in commodityGenreAllData"
+                    :key="item.ID"
+                    :label="item.name"
+                    :value="item.ID"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="供应商">
+              <el-select
+                  v-model="commodityEditData.supplierId"
+                  style="width: 240px"
+              >
+                <el-option
+                    v-for="item in supplierAllData"
+                    :key="item.ID"
+                    :label="item.name"
+                    :value="item.ID"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="单价">
+              <el-input
+                  v-model="commodityEditData.unitPrice"
+                  type="number"
+              />
+            </el-form-item>
+            <el-form-item label="单位">
+              <el-input v-model="commodityEditData.unity" />
+            </el-form-item>
+            <el-form-item label="备注">
+              <el-input v-model="commodityEditData.remark" />
+            </el-form-item>
+            <el-form-item>
+              <el-button
+                  type="primary"
+                  @click="commoditySubmit"
+              >提交</el-button>
+              <el-button @click="isOpenCommodityEdit = false">关闭</el-button>
+            </el-form-item>
+          </el-form>
+        </div>
+      </el-drawer>
+      <el-drawer
+          v-model="isOpenCommodityAdd"
+          title="新增供应商信息"
+          direction="rtl"
+          size="30%"
+      >
+        <div>
+          <el-form
+              v-model="commodityAddData"
+              label-position="left"
+              label-width="auto"
+              style="max-width: 400px"
+          >
+            <el-form-item label="商品名称">
+              <el-input v-model="commodityAddData.name" />
+            </el-form-item>
+            <el-form-item label="商品类型">
+              <el-select
+                  v-model="commodityAddData.genre"
+                  style="width: 240px"
+              >
+                <el-option
+                    v-for="item in commodityGenreAllData"
+                    :key="item.ID"
+                    :label="item.name"
+                    :value="item.ID"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="供应商">
+              <el-select
+                  v-model="commodityAddData.supplierId"
+                  style="width: 240px"
+              >
+                <el-option
+                    v-for="item in supplierAllData"
+                    :key="item.ID"
+                    :label="item.name"
+                    :value="item.ID"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="单价">
+              <el-input
+                  v-model.number="commodityAddData.unitPrice"
+                  type="number"
+              />
+            </el-form-item>
+            <el-form-item label="单位">
+              <el-input v-model="commodityAddData.unity" />
+            </el-form-item>
+            <el-form-item label="备注">
+              <el-input v-model="commodityAddData.remark" />
+            </el-form-item>
+            <el-form-item>
+              <el-button
+                  type="primary"
+                  @click="commodityAddSubmit"
+              >提交</el-button>
+              <el-button @click="isOpenCommodityAdd = false">关闭</el-button>
+            </el-form-item>
+          </el-form>
+        </div>
+      </el-drawer>
+      <!--      商品类型-->
+      <el-drawer
+          v-model="isOpenCommodityGenre"
+          title="商品类型"
+          direction="rtl"
+          size="50%"
+      >
+        <el-header>
+          <el-button
+              type="primary"
+              @click="isOpenAddGenre = true"
+          >新增商品类型</el-button>
+        </el-header>
+        <el-main>
+          <el-table
+              :data="tableData"
+              style="width: 100%; margin-bottom: 20px"
+              row-key="id"
+              border
+              default-expand-all
+          >
+            <el-table-column prop="date1" label="Date" sortable />
+            <el-table-column prop="name1" label="Name" sortable />
+            <el-table-column prop="address1" label="Address" sortable />
+          </el-table>
+<!--          <el-table>-->
+<!--            <el-table-column-->
+<!--                label="ID"-->
+<!--                prop="ID"-->
+<!--            />-->
+<!--            <el-table-column-->
+<!--                label="名称"-->
+<!--                prop="name"-->
+<!--            />-->
+<!--            <el-table-column-->
+<!--                label="备注"-->
+<!--                prop="remarks"-->
+<!--            />-->
+<!--            <el-table-column align="right">-->
+<!--              <template #header>-->
+<!--                <el-input-->
+<!--                    v-model="searchCommodityGenre"-->
+<!--                    placeholder="筛选"-->
+<!--                />-->
+<!--              </template>-->
+<!--              <template #default="scope">-->
+<!--                <el-button-->
+<!--                    type="primary"-->
+<!--                    @click="openUpdateGenre(scope.row)"-->
+<!--                >编辑</el-button>-->
+<!--                <el-button-->
+<!--                    type="danger"-->
+<!--                    @click="commodityGenreDeleteSubmit(scope.row)"-->
+<!--                >删除</el-button>-->
+<!--              </template>-->
+<!--            </el-table-column>-->
+<!--          </el-table>-->
+        </el-main>
+        <!--        新增-->
+        <el-dialog
+            v-model="isOpenAddGenre"
+            title="新增商品类型"
+            width="300"
+            align-center
+        >
+          <template #footer>
+            <el-form>
+              <el-form-item label="名称">
+                <el-input
+                    v-model="commodityGenreAddData.name"
+                    style="width: 240px;"
+                />
+              </el-form-item>
+              <el-form-item label="备注">
+                <el-input
+                    v-model="commodityGenreAddData.remarks"
+                    style="width: 240px;"
+                />
+              </el-form-item>
+              <el-form-item>
+                <el-button
+                    type="primary"
+                    @click="commodityGenreAddSubmit"
+                >提交</el-button>
+              </el-form-item>
+            </el-form>
+          </template>
+        </el-dialog>
+        <!--        编辑-->
+        <el-dialog
+            v-model="isOpenUpdateGenre"
+            title="编辑商品类型"
+            width="300"
+            align-center
+        >
+          <template #footer>
+            <el-form>
+              <el-form-item label="名称">
+                <el-input
+                    v-model="commodityGenreUpdateData.name"
+                    style="width: 240px;"
+                />
+              </el-form-item>
+              <el-form-item label="备注">
+                <el-input
+                    v-model="commodityGenreUpdateData.remarks"
+                    style="width: 240px;"
+                />
+              </el-form-item>
+              <el-form-item>
+                <el-button
+                    type="primary"
+                    @click="commodityGenreUpdateSubmit"
+                >提交</el-button>
+              </el-form-item>
+            </el-form>
+          </template>
+        </el-dialog>
+      </el-drawer>
+    </el-main>
+  </el-container>
+</template>
+
+<script setup>
+import { ref, onMounted, computed } from 'vue'
+import {
+  createCommodity,
+  createCommodityGenre, deleteCommodity,
+  deleteCommodityGenre,
+  queryAllCommodityGenre, queryAllSupplier, queryCommodityList, queryGoodsType, updateCommodity,
+  updateCommodityGenre
+} from '@/api/storehouse'
+import { ElMessage, ElMessageBox } from 'element-plus'
+
+const openTest = () => {
+  console.log('打开商品类型')
+  isOpenCommodityGenre.value = true
+}
+// 数据
+const commodityGenreAllData = ref()
+const commodityListData = ref()
+
+const searchCommodity = ref({
+  pageInfo: {
+    page: 1,
+    pageSize: 10,
+  },
+  name: ''
+})
+
+const total = ref(0)
+
+// 分页
+const handleSizeChange = (val) => {
+  searchCommodity.value.pageSize = val
+  getData()
+}
+
+const handleCurrentChange = (val) => {
+  searchCommodity.value.page = val
+  getData()
+}
+
+const supplierAllData = ref()
+const getData = async() => {
+  // await queryAllCommodityGenre().then(res => {
+  //   commodityGenreAllData.value = res.data
+  // })
+  // await queryCommodityList(searchCommodity.value).then(res => {
+  //   commodityListData.value = res.data.list
+  //   total.value = res.data.total
+  // })
+  // await queryAllSupplier().then(res => {
+  //   console.log(res.data)
+  //   supplierAllData.value = res.data
+  // })
+
+  await queryGoodsType().then(res => {
+    console.log('货品类型', res.data)
+  })
+}
+
+// 商品类型
+const isOpenCommodityGenre = ref(false)
+
+const searchCommodityGenre = ref()
+
+const filterTableData = computed(() =>
+    commodityGenreAllData.value.filter(
+        (data) =>
+            !searchCommodityGenre.value ||
+            data.name.toLowerCase().includes(searchCommodityGenre.value.toLowerCase())
+    )
+)
+
+const commodityGenreAddData = ref({
+  name: '',
+})
+const isOpenAddGenre = ref(false)
+
+const commodityGenreAddSubmit = async() => {
+  if (!commodityGenreAddData.value.name) {
+    ElMessage.error('名称不能为空')
+    return
+  }
+  await createCommodityGenre(commodityGenreAddData.value).then(res => {
+    if (res.code === 0) {
+      ElMessage.success('新增成功')
+    } else {
+      ElMessage.error('新增失败')
+    }
+    isOpenAddGenre.value = false
+    getData()
+  })
+}
+
+const commodityGenreUpdateData = ref()
+const isOpenUpdateGenre = ref(false)
+
+const openUpdateGenre = (val) => {
+  isOpenUpdateGenre.value = true
+  commodityGenreUpdateData.value = val
+}
+
+const commodityGenreUpdateSubmit = async() => {
+  if (!commodityGenreUpdateData.value.name) {
+    ElMessage.error('名称不能为空')
+    return
+  }
+  await updateCommodityGenre(commodityGenreUpdateData.value).then(res => {
+    if (res.code === 0) {
+      ElMessage.success('编辑成功')
+    } else {
+      ElMessage.error('编辑失败')
+    }
+    isOpenUpdateGenre.value = false
+    getData()
+  })
+}
+
+const commodityGenreDeleteSubmit = (val) => {
+  ElMessageBox.confirm(
+      '将永久删除该信息。是否继续？',
+      '删除',
+      {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      }
+  )
+      .then(async() => {
+        await deleteCommodityGenre(val).then(res => {
+          if (res.code === 0) {
+            ElMessage.success('删除成功')
+            getData()
+          } else {
+            ElMessage.error('删除失败')
+          }
+        })
+      })
+      .catch(() => {
+        ElMessage({
+          type: 'info',
+          message: '删除已取消',
+        })
+      })
+}
+
+// 商品
+const isOpenCommodityEdit = ref(false)
+const commodityEditData = ref()
+const openCommodityEdit = (val) => {
+  commodityEditData.value = val
+  isOpenCommodityEdit.value = true
+}
+
+const commoditySubmit = async() => {
+  await updateCommodity(commodityEditData.value).then(res => {
+    if (res.code === 0) {
+      ElMessage.success('编辑成功')
+    } else {
+      ElMessage.error('编辑失败')
+    }
+    isOpenCommodityEdit.value = false
+  })
+}
+
+const commodityDelete = async(val) => {
+  ElMessageBox.confirm(
+      '将永久删除该信息。是否继续？',
+      '删除',
+      {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      }
+  )
+      .then(async() => {
+        await deleteCommodity(val).then(res => {
+          if (res.code === 0) {
+            ElMessage.success('删除成功')
+            getData()
+          } else {
+            ElMessage.error('删除失败')
+          }
+        })
+      })
+      .catch(() => {
+        ElMessage({
+          type: 'info',
+          message: '删除已取消',
+        })
+      })
+}
+
+// 新增
+const commodityAddData = ref({
+  name: '',
+  genre: '',
+  supplierId: '',
+  unitPrice: 0,
+  unity: '',
+  remark: '',
+})
+const isOpenCommodityAdd = ref(false)
+
+const commodityAddSubmit = async() => {
+  if (!commodityAddData.value.name || !commodityAddData.value.genre || !commodityAddData.value.supplierId || commodityAddData.value.unitPrice === 0) {
+    ElMessage.error('数据不能为空')
+    return
+  }
+  console.log(commodityAddData.value)
+  await createCommodity(commodityAddData.value).then(res => {
+    if (res.code === 0) {
+      ElMessage.success('新增成功')
+    } else {
+      ElMessage.error('新增失败')
+    }
+    isOpenCommodityAdd.value = false
+    getData()
+  })
+}
+
+const tableData = [
+  {
+    id: 1,
+    date1: '2016-05-02',
+    name1: 'wangxiaohu',
+    address1: 'No. 189, Grove St, Los Angeles',
+  },
+  {
+    id: 2,
+    date1: '2016-05-04',
+    name1: 'wangxiaohu',
+    address1: 'No. 189, Grove St, Los Angeles',
+  },
+  {
+    id: 3,
+    date1: '2016-05-01',
+    name1: 'wangxiaohu',
+    address1: 'No. 189, Grove St, Los Angeles',
+    children1: [
+      {
+        id: 31,
+        date1: '2016-05-01',
+        name1: 'wangxiaohu',
+        address1: 'No. 189, Grove St, Los Angeles',
+      },
+      {
+        id: 32,
+        date1: '2016-05-01',
+        name1: 'wangxiaohu',
+        address1: 'No. 189, Grove St, Los Angeles',
+      },
+    ],
+  },
+  {
+    id: 4,
+    date1: '2016-05-03',
+    name1: 'wangxiaohu',
+    address1: 'No. 189, Grove St, Los Angeles',
+  },
+]
+
+onMounted(() => {
+  getData()
+})
+</script>
+

web/src/view/storehouse/goods/goods.vue

@@ -72,6 +72,9 @@
                 />
               </el-select>
             </el-form-item>
+            <el-form-item>
+              <el-button type="primary" @click="goodsManageShow = true">商品管理</el-button>
+            </el-form-item>
             <el-form-item>
               <el-button
                 type="primary"
@@ -367,6 +370,10 @@
 
         </div>
       </el-drawer>
+<!--      商品管理-->
+      <el-drawer v-model="goodsManageShow" size="70%" title="商品管理">
+        <GoodsManage />
+      </el-drawer>
     </el-main>
   </el-container>
 </template>
@@ -374,12 +381,14 @@
 <script setup>
 import { ref, onMounted } from 'vue'
 import { queryAllCommodity } from '@/api/inventory'
+import GoodsManage from "./component/goodsManage.vue";
 import {
   createInboundManifest, createOutboundManifest, queryAllGoods,
   queryAllPlace,
   queryAllStorageArea,
   queryAllWarehouse,
-  queryGoodsList
+  queryGoodsList,
+  queryGoodsType
 } from '@/api/storehouse'
 import { ElMessage } from 'element-plus'
 // 数据
@@ -433,35 +442,36 @@ const searchGoods = ref({
 const total = ref(0)
 
 const getData = async() => {
-  await queryAllCommodity().then(res => {
-    commodityData.value = res.data
-  })
-  await queryAllWarehouse().then(res => {
-    warehouseData.value = res.data
-    warehouseOptions.value = res.data.map(warehouse => ({
-      value: warehouse.ID,
-      label: warehouse.name,
-      children: warehouse.storageAreas.map(area => ({
-        value: area.ID,
-        label: area.name,
-        children: area.places.map(place => ({
-          value: place.ID,
-          label: `${place.shelfNumber}架-${place.layerNumber}层 (${place.code})`
-        }))
-      }))
-    }))
-  })
-  await queryAllStorageArea().then(res => {
-    storageAreaData.value = res.data
-  })
-  await queryAllPlace().then(res => {
-    placeData.value = res.data
-  })
-  await queryGoodsList(searchGoods.value).then(res => {
-    goodsList.value = res.data.list
-    total.value = res.data.total
-  })
+  // await queryAllCommodity().then(res => {
+  //   commodityData.value = res.data
+  // })
+  // await queryAllWarehouse().then(res => {
+  //   warehouseData.value = res.data
+  //   warehouseOptions.value = res.data.map(warehouse => ({
+  //     value: warehouse.ID,
+  //     label: warehouse.name,
+  //     children: warehouse.storageAreas.map(area => ({
+  //       value: area.ID,
+  //       label: area.name,
+  //       children: area.places.map(place => ({
+  //         value: place.ID,
+  //         label: `${place.shelfNumber}架-${place.layerNumber}层 (${place.code})`
+  //       }))
+  //     }))
+  //   }))
+  // })
+  // await queryAllStorageArea().then(res => {
+  //   storageAreaData.value = res.data
+  // })
+  // await queryAllPlace().then(res => {
+  //   placeData.value = res.data
+  // })
+  // await queryGoodsList(searchGoods.value).then(res => {
+  //   goodsList.value = res.data.list
+  //   total.value = res.data.total
+  // })
   await queryAllGoods().then(res => {
+    console.log('所有货物', res.data)
     goodsData.value = res.data
   })
 }
@@ -712,6 +722,9 @@ const resetForm = () => {
   }
 }
 
+// 商品管理
+const goodsManageShow = ref(false)
+
 onMounted(() => {
   getData()
 })