页面调整

peng

2025-10-30 914b2943c09f947ab59e8143e25f4d5e23b8dcf0

 seller/src/views/order/order/orderDetail.vue

@@ -439,6 +439,10 @@
      <div v-if="packageTraceList.length > 0" v-for="(packageItem, packageIndex) in packageTraceList" :key="packageIndex">
        <div class="layui-layer-wrap">
          <dl>
            <dt>包裹编号：</dt>
            <dd><div class="text-box">{{ packageItem.packageNo }}</div></dd>
          </dl>
          <dl>
            <dt>物流公司：</dt>
            <dd><div class="text-box">{{ packageItem.logisticsName }}</div></dd>
          </dl>
@@ -464,6 +468,10 @@
            </ul>
            <ul class="express-log" v-else><li>暂无物流信息</li></ul>
          </div>
          <!-- 添加修改物流单号按钮 -->
          <div style="text-align: center; margin-top: 10px;">
            <Button type="primary" @click="modifyPackageLogistics(packageItem)">修改物流单号</Button>
          </div>
        </div>
      </div>
      <div v-if = "packageTraceList.length == 0 && logisticsInfo">
@@ -485,6 +493,10 @@
            </ul>
            <ul class="express-log" v-else><li>暂无物流信息</li></ul>
          </div>
          <!-- 添加修改物流单号按钮 -->
          <div style="text-align: center; margin-top: 10px;">
            <Button type="primary" @click="modifySingleLogistics">修改物流单号</Button>
          </div>
        </div>
      </div>
      <div slot="footer" style="text-align: right">
@@ -492,7 +504,38 @@
      </div>
    </Modal>


    <!-- 修改物流单号弹窗 -->
    <Modal v-model="modifyLogisticsModal" width="530">
      <p slot="header">
        <Icon type="edit"></Icon>
        <span>修改物流单号</span>
      </p>
      <div>
        <Form ref="modifyLogisticsForm" :model="modifyLogisticsForm" label-position="left" :label-width="100" :rules="modifyLogisticsValidate">
          <FormItem label="包裹编号" prop="packageNo">
            <Input v-model="modifyLogisticsForm.packageNo" size="large" disabled></Input>
          </FormItem>
          <FormItem label="订单编号" prop="orderSn">
            <Input v-model="modifyLogisticsForm.orderSn" size="large" disabled></Input>
          </FormItem>
          <FormItem label="快递公司" prop="logisticsId">
            <Select v-model="modifyLogisticsForm.logisticsId" placeholder="请选择快递公司" style="width: 100%">
              <Option v-for="(item, i) in checkedLogistics" :key="i" :value="item.logisticsId">{{ item.name }}</Option>
            </Select>
          </FormItem>
          <FormItem label="快递单号" prop="logisticsNo">
            <Input v-model="modifyLogisticsForm.logisticsNo" size="large"></Input>
          </FormItem>
<!--          <FormItem label="快递编码" prop="logisticsCode">-->
<!--            <Input v-model="modifyLogisticsForm.logisticsCode" size="large"></Input>-->
<!--          </FormItem>-->
        </Form>
      </div>
      <div slot="footer" style="text-align: right">
        <Button @click="modifyLogisticsModal = false">关闭</Button>
        <Button type="primary" @click="modifyLogisticsSubmit">确认修改</Button>
      </div>
    </Modal>
    <!-- 订单发货 -->
    <Modal v-model="orderDeliverModal" width="500px">
      <p slot="header">
@@ -1031,7 +1074,26 @@
      editTemplateModalVisible: false,
      currentTemplateId: "",
      // 用于传递userCheckTemplates数据给子组件
      userCheckTemplates: []
      userCheckTemplates: [],

      // 添加修改物流单号相关数据
      modifyLogisticsModal: false, // 弹出修改物流单号框
      modifyLogisticsForm: {
        packageNo: "",
        orderSn: "",
        logisticsId: "",
        logisticsNo: "",
        logisticsCode: ""
      },
      modifyLogisticsValidate: {
        logisticsId: [
          { required: true, message: "请选择快递公司", trigger: "change" }
        ],
        logisticsNo: [
          { required: true, message: "请输入快递单号", trigger: "blur" }
        ]
      },

    };
  },
  methods: {
@@ -1505,7 +1567,82 @@
          this.endpoint = res.data.endpoint;
        }
      });
    }
    },

    // 添加修改物流单号方法
    modifyLogisticsNo() {
      // 获取物流公司列表
      this.getLogisticsList();

      // 初始化表单数据
      this.modifyLogisticsForm.orderSn = this.sn;

      // 如果有包裹信息，初始化第一个包裹的信息
      if (this.orderPackage && this.orderPackage.length > 0) {
        const firstPackage = this.orderPackage[0];
        this.modifyLogisticsForm.packageNo = firstPackage.packageNo || "";
        this.modifyLogisticsForm.logisticsId = firstPackage.logisticsId || "";
        this.modifyLogisticsForm.logisticsNo = firstPackage.logisticsNo || "";
        this.modifyLogisticsForm.logisticsCode = firstPackage.logisticsCode || "";
      }

      this.modifyLogisticsModal = true;
    },

    // 修改指定包裹的物流单号
    modifyPackageLogistics(packageItem) {
      // 获取物流公司列表
      this.getLogisticsList();

      // 初始化表单数据
      this.modifyLogisticsForm.packageNo = packageItem.packageNo || "";
      this.modifyLogisticsForm.orderSn = this.sn;
      this.modifyLogisticsForm.logisticsId = packageItem.logisticsId || "";
      this.modifyLogisticsForm.logisticsNo = packageItem.logisticsNo || "";
      this.modifyLogisticsForm.logisticsCode = packageItem.logisticsCode || "";

      // 关闭查看物流弹窗，打开修改物流弹窗
      this.logisticsModal = false;
      this.modifyLogisticsModal = true;
    },

    // 修改单个物流单号（非分包裹情况）
    modifySingleLogistics() {
      // 获取物流公司列表
      this.getLogisticsList();

      // 初始化表单数据
      this.modifyLogisticsForm.orderSn = this.sn;
      this.modifyLogisticsForm.logisticsId = "";
      this.modifyLogisticsForm.logisticsNo = this.logisticsInfo.logisticCode || "";
      this.modifyLogisticsForm.logisticsCode = "";

      // 关闭查看物流弹窗，打开修改物流弹窗
      this.logisticsModal = false;
      this.modifyLogisticsModal = true;
    },

    // 修改物流单号提交
    modifyLogisticsSubmit() {
      this.$refs.modifyLogisticsForm.validate((valid) => {
        if (valid) {
          API_Order.updateTraces(this.modifyLogisticsForm).then((res) => {
            if (res.success) {
              this.$Message.success("修改物流单号成功");
              this.modifyLogisticsModal = false;
              // 重新获取订单详情和包裹信息
              this.getDataDetail();
              this.getOrderPackage();
              // 重新加载物流信息
              this.checkLogistics();
            } else {
              this.$Message.error(res.message || "修改物流单号失败");
            }
          });
        }
      });
    },

  },
  mounted () {
    this.sn = this.$route.query.sn;