feat(workStation): 新增货盘管理功能

- 添加货盘管理相关的 API 接口
- 实现货盘列表、新增货盘、修改货盘、发布/结束发布等功能
- 集成货盘管理页面到路由和菜单中

src/apis/fetch.js

@@ -404,4 +404,29 @@ export default {
   deleteTerminalServiceStaff(data) {
     return $http("/terminal/service/staff/delete", data);
   },
+
+  // 修改货盘信息
+  modifyPallet(data) {
+    return $http("/pallet/modify", data);
+  },
+
+  // 发布/结束发布货盘
+  modifyPalletStatus(data) {
+    return $http("/pallet/modify/status", data);
+  },
+
+  // 货盘列表
+  getPalletList(data) {
+    return $http("/pallet/list", data);
+  },
+
+  // 新增货盘信息
+  addPallet(data) {
+    return $http("/pallet/add", data);
+  },
+
+  // 删除货盘信息
+  deletePallet(data) {
+    return $http("/pallet/delete", data);
+  },
 };

src/layout/Aside.vue

@@ -164,6 +164,10 @@ if (store.state.shippingCompany === "汇很多船务公司") {
     path: "/workStation/terminalServiceStaffManage",
     name: "码头服务人员管理",
   });
+  menu.value.at(-1).items.push({
+    path: "/workStation/palletManage",
+    name: "货盘管理",
+  });
 }
 </script>
 <style scoped>

src/main.js

@@ -96,6 +96,10 @@ router.afterEach((to, from) => {
       path: "/workStation/terminalServiceStaffManage",
       name: "码头人员管理",
     });
+    store.state.menu.at(-1).items.push({
+      path: "/workStation/palletManage",
+      name: "货盘管理",
+    });
   }
 });
 

src/router/index.js

@@ -265,6 +265,14 @@ const router = createRouter({
       component: () =>
         import("../views/workStation/terminalServiceStaffManage.vue"),
     },
+    {
+      path: "/workStation/palletManage",
+      name: "palletManage",
+      meta: {
+        title: "货盘管理",
+      },
+      component: () => import("../views/workStation/palletManage.vue"),
+    },
     {
       path: "/workStation/crewSchoolInfoManage",
       name: "crewSchoolInfoManage",

src/views/workStation/palletManage.vue

@@ -0,0 +1,394 @@
+<template>
+  <div class="full-container-p24">
+    <div class="mb30 df aic jcsb">
+      <div class="df aic">
+        <el-input
+          v-model="searchKey"
+          placeholder="请输入货种/始发港/卸货港/联系人/联系电话"
+          class="w300"
+          @keyup.enter="handleSearch"
+          clearable
+          @clear="handleSearch"
+        />
+        <el-select
+          v-model="statusFilter"
+          placeholder="货盘状态"
+          class="ml10 w150"
+          @change="handleSearch"
+        >
+          <el-option label="全部" :value="3" />
+          <el-option label="待发布" :value="0" />
+          <el-option label="已发布" :value="1" />
+          <el-option label="发布结束" :value="2" />
+        </el-select>
+        <el-button class="ml10" type="primary" @click="handleSearch">
+          搜索
+        </el-button>
+      </div>
+      <el-button class="ml10" type="primary" @click="handleAdd">
+        新增货盘
+      </el-button>
+    </div>
+
+    <el-table border :data="tableData" stripe>
+      <el-table-column type="index" label="序号" width="80" align="center" />
+      <el-table-column
+        prop="cargoName"
+        label="货种名称"
+        min-width="120"
+        align="center"
+      />
+      <el-table-column
+        prop="loadPortName"
+        label="装货港"
+        min-width="120"
+        align="center"
+      />
+      <el-table-column
+        prop="dischargePortName"
+        label="卸货港"
+        min-width="120"
+        align="center"
+      />
+      <el-table-column
+        prop="cargoTons"
+        label="吨位"
+        min-width="100"
+        align="center"
+      />
+      <el-table-column
+        prop="contactName"
+        label="联系人"
+        min-width="100"
+        align="center"
+      />
+      <el-table-column
+        prop="contactPhone"
+        label="联系电话"
+        min-width="120"
+        align="center"
+      />
+      <el-table-column
+        prop="statusText"
+        label="状态"
+        min-width="100"
+        align="center"
+      >
+        <template #default="scope">
+          <el-tag :type="getStatusType(scope.row.status)">
+            {{ getStatusText(scope.row.status) }}
+          </el-tag>
+        </template>
+      </el-table-column>
+
+      <el-table-column label="操作" width="220" align="center">
+        <template #default="scope">
+          <el-button
+            type="primary"
+            text
+            @click="handleEdit(scope.row)"
+            v-if="scope.row.status != 2"
+          >
+            修改
+          </el-button>
+          <el-button
+            v-if="scope.row.status === 0"
+            type="success"
+            text
+            @click="handleChangeStatus(scope.row, 1)"
+          >
+            发布
+          </el-button>
+          <el-button
+            v-if="scope.row.status === 1"
+            type="warning"
+            text
+            @click="handleChangeStatus(scope.row, 2)"
+          >
+            结束发布
+          </el-button>
+          <!-- <el-button type="danger" text @click="deletePallet(scope.row)">
+            删除
+          </el-button> -->
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <div class="df aic jcfe mt40 mr20">
+      <el-pagination
+        background
+        layout="prev, pager, next"
+        :current-page="currentPage"
+        :total="total"
+        @current-change="pageChange"
+      />
+    </div>
+
+    <el-dialog v-model="dialogVisible" :title="dialogTitle" width="700">
+      <el-form
+        ref="formRef"
+        :model="formData"
+        :rules="rules"
+        label-width="120px"
+      >
+        <el-form-item label="货种名称" prop="cargoName">
+          <el-input v-model="formData.cargoName" class="w400" />
+        </el-form-item>
+        <el-form-item label="装货港" prop="loadPortName">
+          <el-input v-model="formData.loadPortName" class="w400" />
+        </el-form-item>
+        <el-form-item label="卸货港" prop="dischargePortName">
+          <el-input v-model="formData.dischargePortName" class="w400" />
+        </el-form-item>
+        <el-form-item label="吨位" prop="cargoTons">
+          <el-input-number v-model="formData.cargoTons" :min="0" class="w400" />
+        </el-form-item>
+        <el-form-item label="联系人" prop="contactName">
+          <el-input v-model="formData.contactName" class="w400" />
+        </el-form-item>
+        <el-form-item label="联系电话" prop="contactPhone">
+          <el-input v-model="formData.contactPhone" class="w400" />
+        </el-form-item>
+        <el-form-item label="发布方式" prop="releaseType" v-if="isAdd">
+          <el-radio-group v-model="formData.releaseType">
+            <el-radio :label="1">暂存</el-radio>
+            <el-radio :label="2">直接发布</el-radio>
+          </el-radio-group>
+        </el-form-item>
+      </el-form>
+
+      <template #footer>
+        <el-button @click="dialogVisible = false">取消</el-button>
+        <el-button type="primary" @click="submitForm">确定</el-button>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import { ref, reactive, computed } from "vue";
+import { ElMessage, ElMessageBox } from "element-plus";
+import api from "../../apis/fetch";
+import { useStore } from "vuex";
+import { confirm } from "../../utils/utils";
+
+const store = useStore();
+const loginAccountId = store.state.loginAccountId;
+const choiceCompanyId = ref(0); // 选择的船务公司ID，默认为0
+
+const searchKey = ref("");
+const statusFilter = ref(3); // 默认显示全部状态
+const currentPage = ref(1);
+const total = ref(0);
+const tableData = ref([]);
+
+const dialogVisible = ref(false);
+const dialogTitle = ref("新增货盘");
+const formRef = ref(null);
+const isAdd = ref(true);
+
+const formData = reactive({
+  loginAccountId: loginAccountId,
+  choiceCompanyId: 0,
+  palletId: 0,
+  cargoName: "",
+  loadPortName: "",
+  dischargePortName: "",
+  cargoTons: 0,
+  contactName: "",
+  contactPhone: "",
+  releaseType: 1, // 默认暂存
+});
+
+const rules = reactive({
+  cargoName: [{ required: true, message: "请输入货种名称", trigger: "blur" }],
+  loadPortName: [{ required: true, message: "请输入装货港", trigger: "blur" }],
+  dischargePortName: [
+    { required: true, message: "请输入卸货港", trigger: "blur" },
+  ],
+  cargoTons: [{ required: true, message: "请输入吨位", trigger: "blur" }],
+  contactName: [{ required: true, message: "请输入联系人", trigger: "blur" }],
+  contactPhone: [
+    { required: true, message: "请输入联系电话", trigger: "blur" },
+  ],
+});
+
+// 获取货盘列表
+async function getPalletList() {
+  try {
+    const { data } = await api.getPalletList({
+      loginAccountId: loginAccountId,
+      choiceCompanyId: choiceCompanyId.value,
+      status: statusFilter.value,
+      term: searchKey.value,
+      currentPage: currentPage.value,
+      size: 10,
+    });
+    if (data.status === 0) {
+      tableData.value = data.result;
+      total.value = data.total;
+    } else {
+      tableData.value = [];
+      total.value = 0;
+      ElMessage.error(data.msg || "获取数据失败");
+    }
+  } catch (error) {
+    ElMessage.error("获取数据失败");
+  }
+}
+
+// 获取状态文本
+function getStatusText(status) {
+  const statusMap = {
+    0: "待发布",
+    1: "已发布",
+    2: "发布结束",
+  };
+  return statusMap[status] || "未知状态";
+}
+
+// 获取状态标签类型
+function getStatusType(status) {
+  const typeMap = {
+    0: "info",
+    1: "success",
+    2: "warning",
+  };
+  return typeMap[status] || "info";
+}
+
+// 分页切换
+function pageChange(page) {
+  currentPage.value = page;
+  getPalletList();
+}
+
+// 搜索
+function handleSearch() {
+  currentPage.value = 1;
+  getPalletList();
+}
+
+// 新增
+function handleAdd() {
+  dialogTitle.value = "新增货盘";
+  isAdd.value = true;
+  Object.keys(formData).forEach((key) => {
+    if (
+      key !== "palletId" &&
+      key !== "loginAccountId" &&
+      key !== "choiceCompanyId" &&
+      key !== "releaseType"
+    ) {
+      if (key === "cargoTons") {
+        formData[key] = 0;
+      } else {
+        formData[key] = "";
+      }
+    }
+  });
+  formData.palletId = 0;
+  formData.releaseType = 1; // 默认暂存
+  dialogVisible.value = true;
+}
+
+// 编辑
+function handleEdit(row) {
+  dialogTitle.value = "修改货盘";
+  isAdd.value = false;
+  formData.palletId = row.id;
+  formData.cargoName = row.cargoName;
+  formData.loadPortName = row.loadPortName;
+  formData.dischargePortName = row.dischargePortName;
+  formData.cargoTons = row.cargoTons || 0;
+  formData.contactName = row.contactName;
+  formData.contactPhone = row.contactPhone;
+  formData.releaseType = 1; // 修改时默认为保存修改
+
+  dialogVisible.value = true;
+}
+
+// 修改状态（发布/结束发布）
+async function handleChangeStatus(row, status) {
+  try {
+    if (!(await confirm(status === 1 ? "确认发布？" : "结束发布？"))) return;
+    const { data } = await api.modifyPalletStatus({
+      loginAccountId: loginAccountId,
+      choiceCompanyId: choiceCompanyId.value,
+      status: status,
+      palletId: row.id,
+    });
+    if (data.status === 0) {
+      ElMessage.success(status === 1 ? "发布成功" : "结束发布成功");
+      getPalletList();
+    } else {
+      ElMessage.error(data.msg || "操作失败");
+    }
+  } catch (error) {
+    ElMessage.error("操作失败");
+  }
+}
+
+// 提交表单
+async function submitForm() {
+  try {
+    await formRef.value.validate();
+    if (!(await confirm("确认提交？"))) return;
+    const apiMethod = isAdd.value ? api.addPallet : api.modifyPallet;
+    const params = { ...formData };
+    params.choiceCompanyId = choiceCompanyId.value;
+
+    const { data } = await apiMethod(params);
+    if (data.status === 0) {
+      ElMessage.success("操作成功");
+      dialogVisible.value = false;
+      getPalletList();
+    } else {
+      ElMessage.error(data.msg || "操作失败");
+    }
+  } catch (error) {
+    console.error(error);
+    ElMessage.error("操作失败");
+  }
+}
+
+// 删除
+function deletePallet(row) {
+  ElMessageBox.confirm("确认删除该货盘信息？", "警告", {
+    confirmButtonText: "确认",
+    cancelButtonText: "取消",
+    type: "warning",
+  }).then(async () => {
+    try {
+      const { data } = await api.deletePallet({
+        loginAccountId: loginAccountId,
+        choiceCompanyId: choiceCompanyId.value,
+        palletId: row.id,
+      });
+      if (data.status === 0) {
+        ElMessage.success("删除成功");
+        getPalletList();
+      } else {
+        ElMessage.error(data.msg || "删除失败");
+      }
+    } catch (error) {
+      ElMessage.error("删除失败");
+    }
+  });
+}
+
+// 初始化获取数据
+getPalletList();
+</script>
+
+<style scoped>
+.w150 {
+  width: 150px;
+}
+.w300 {
+  width: 300px;
+}
+.w400 {
+  width: 400px;
+}
+</style>