x

2026-06-02 09:55:06 +08:00
parent ecc6b8ab8a
commit 8cca6f9d32
28 changed files with 1951 additions and 2658 deletions
@@ -0,0 +1,145 @@
+<script setup lang="ts">
+import { reactive, ref } from 'vue'
+import { useInventory } from '@/modules/inventory/composables/useInventory'
+import { apiRequest } from '@/shared/api'
+import { addNotification, handleApiError } from '@/shared/notification'
+
+const { state, loadSuppliers } = useInventory()
+
+const showModal = ref(false)
+const editingItem = ref<any>(null)
+const form = reactive({
+  name: '',
+  contact_person: '',
+  phone: '',
+  email: '',
+  address: ''
+})
+
+function openCreateSupplier() {
+  editingItem.value = null
+  form.name = ''
+  form.contact_person = ''
+  form.phone = ''
+  form.email = ''
+  form.address = ''
+  showModal.value = true
+}
+
+function editSupplier(item: any) {
+  editingItem.value = item
+  form.name = item.name ?? ''
+  form.contact_person = item.contact_person ?? ''
+  form.phone = item.phone ?? ''
+  form.email = item.email ?? ''
+  form.address = item.address ?? ''
+  showModal.value = true
+}
+
+async function save() {
+  try {
+    const payload = {
+      name: form.name,
+      contact_person: form.contact_person || null,
+      phone: form.phone || null,
+      email: form.email || null,
+      address: form.address || null
+    }
+    if (editingItem.value) {
+      await apiRequest(`/api/suppliers/${editingItem.value.id}`, {
+        method: 'PUT',
+        body: JSON.stringify(payload)
+      })
+      addNotification('供应商更新成功', 'success')
+    } else {
+      await apiRequest('/api/suppliers', {
+        method: 'POST',
+        body: JSON.stringify(payload)
+      })
+      addNotification('供应商已创建', 'success')
+    }
+    showModal.value = false
+    loadSuppliers()
+  } catch (e) {
+    handleApiError(e, '保存供应商')
+  }
+}
+
+async function deleteSupplier(id: number) {
+  if (!confirm('确定要删除这个供应商吗？')) return
+  try {
+    await apiRequest(`/api/suppliers/${id}`, { method: 'DELETE' })
+    addNotification('供应商已删除', 'success')
+    loadSuppliers()
+  } catch (e) {
+    handleApiError(e, '删除供应商')
+  }
+}
+</script>
+
+<template>
+  <div class="suppliers-tab">
+    <div class="table-header">
+      <el-button type="primary" @click="openCreateSupplier">+ 新增供应商</el-button>
+    </div>
+    <el-table :data="state.suppliers" style="width: 100%" v-loading="state.loading" empty-text="暂无供应商数据">
+      <el-table-column prop="code" label="编码" />
+      <el-table-column prop="name" label="名称" />
+      <el-table-column prop="contact_person" label="联系人">
+        <template #default="{ row }">
+          {{ row.contact_person || '-' }}
+        </template>
+      </el-table-column>
+      <el-table-column prop="phone" label="电话">
+        <template #default="{ row }">
+          {{ row.phone || '-' }}
+        </template>
+      </el-table-column>
+      <el-table-column prop="email" label="邮箱">
+        <template #default="{ row }">
+          {{ row.email || '-' }}
+        </template>
+      </el-table-column>
+      <el-table-column label="操作" width="180">
+        <template #default="{ row }">
+          <el-button size="small" @click="editSupplier(row)">编辑</el-button>
+          <el-button size="small" type="danger" @click="deleteSupplier(row.id)">删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <el-dialog v-model="showModal" :title="editingItem ? '编辑供应商' : '新增供应商'" width="520px" :close-on-click-modal="false">
+      <el-form :model="form" label-width="80px">
+        <el-form-item label="名称" required>
+          <el-input v-model="form.name" placeholder="请输入供应商名称" />
+        </el-form-item>
+        <el-form-item label="联系人">
+          <el-input v-model="form.contact_person" placeholder="请输入联系人" />
+        </el-form-item>
+        <el-form-item label="电话">
+          <el-input v-model="form.phone" placeholder="请输入电话" />
+        </el-form-item>
+        <el-form-item label="邮箱">
+          <el-input v-model="form.email" type="email" placeholder="请输入邮箱" />
+        </el-form-item>
+        <el-form-item label="地址">
+          <el-input v-model="form.address" placeholder="请输入地址" />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <el-button @click="showModal = false">取消</el-button>
+        <el-button type="primary" @click="save">保存</el-button>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<style scoped>
+.suppliers-tab {
+  padding: 0;
+}
+
+.table-header {
+  margin-bottom: 16px;
+}
+</style>