Agency_WxApp/miniprogram/pages/voyages/detail/detail.js

// pages/voyages/detail/detail.js
import { postApi } from "../../../apis/api";

import { uploadImage } from "../../../utils/uploadImage";
Page({
  data: {
    id: "",
    tab: 1,
    shipDischargeCurrentPage: 1,
    truckLoadCurrentPage: 1,
    coordinates: [],
    medias: [],
    policys: [],
    voyage: {},
    waybills: [],
    infoType: "ship",
    shipDischargeList: [],
    truckLoadList: [],
    shipDischargeTotal: 0,
    truckLoadTotal: 0,
    polyline: [
      {
        points: [],
        width: 2,
        dottedLine: true,
        color: "#eb2f06",
      },
    ],
    markers: [],
    points: [],
    pageSize: 30,
    latitude: 31.891992,
    longitude: 120.551369,
    currentPortId: 0,
    dischargeModal: false,
    currentDischargePortId: "",
    currentDischargePort: "",
    tab2disabled: false,
    currentDischargeIndex: 0,
    tab3CurrentDischargeIndex: 0,
    uploadBillVisable: true,
    currentBeforePortIndex: 0,
    beforePorts: [],
  },
  changeTab(e) {
    let { tab } = e.currentTarget.dataset;
    this.setData({
      tab,
    });
  },

  async getVoyageDetail() {
    let res = await postApi("/voyage/detail", {
      voyageId: this.data.id,
      loginAccountId: wx.getStorageSync("loginAccountId"),
    });
    if (res.data.status == 0) {
      let { coordinates, medias, policys, voyage, waybills } = res.data.result;
      if (coordinates.length) {
        let points = [];
        for (let i of coordinates) {
          points.push({
            latitude: i.latitude,
            longitude: i.longitude,
          });
        }
        let { latitude, longitude } = points[points.length - 1];
        this.data.latitude = latitude;
        this.data.longitude = longitude;
        this.data.polyline[0].points = points;
        let id = 1;
        for (let i of points) {
          this.data.markers.push({
            id: id + 1,
            latitude: i.latitude,
            longitude: i.longitude,
            iconPath:
              "https://frontend-1255802371.cos.ap-shanghai.myqcloud.com/miniapp-static/red-circle.png?sign=6d208881376358fb4111aa6d7f1a7846&t=1647934972",
            height: 20,
            width: 20,
          });
        }

        this.setData({
          polyline: this.data.polyline,
          markers: this.data.markers,
          latitude: this.data.latitude,
          longitude: this.data.longitude,
          points,
        });
      }
      // voyage.arrivalLoadPortTime = this.subTimeStr(voyage.arrivalLoadPortTime)
      // voyage.loadStartTime = this.subTimeStr(voyage.loadStartTime)
      // voyage.loadEndTime = this.subTimeStr(voyage.loadEndTime)
      // voyage.setSailTime = this.subTimeStr(voyage.setSailTime)
      // voyage.expectedArrivalTime = this.subTimeStr(voyage.expectedArrivalTime)
      let dischargePortIds = voyage.dischargePortIds.split(",");
      let dischargePorts = voyage.dischargePorts.split(",");
      let discLength = dischargePortIds.length;

      for (let item of voyage.voyageDetails) {
        item.setSailTime = this.subTimeStr(item.setSailTime);
        item.expectedArrivalTime = this.subTimeStr(item.expectedArrivalTime);
        item.actualArrivalTime = this.subTimeStr(item.actualArrivalTime);
        item.dischargeStartTime = this.subTimeStr(item.dischargeStartTime);
        item.dischargeEndTime = this.subTimeStr(item.dischargeEndTime);
      }
      this.setData({
        coordinates,
        medias,
        policys,
        ...voyage,
        waybills,
        currentPortId: voyage?.voyageDetails[0].portId,
        dischargePortIds,
        dischargePorts,
        discLength,
        tab2disabled: voyage.voyageStatus == 2,
      });
      this.getCarLoadRecordList();
      this.getDischargeList();
    } else {
      wx.showToast({
        title: "获取详情失败!",
        icon: "error",
      });
    }
  },
  subTimeStr(str) {
    if (!str || typeof str != "string") return;
    let index = str.indexOf(" ");
    return str.substring(0, index);
  },

  async getCarLoadRecordList(isScroll) {
    if (isScroll) {
      this.data.truckLoadCurrentPage += 1;
    } else {
      this.data.truckLoadCurrentPage = 1;
    }
    let res = await postApi("/voyage/getCarLoadRecordList", {
      portId: this.data.currentPortId,
      voyageId: this.data.id,
      size: this.data.pageSize,
      currentPage: this.data.truckLoadCurrentPage,
      loginAccountId: wx.getStorageSync("loginAccountId"),
    });
    this.setData({
      truckLoadCurrentPage: this.data.truckLoadCurrentPage,
    });

    if (0 == res.data.status) {
      if (isScroll) {
        let truckLoadList = [...this.data.truckLoadList, ...res.data.result];
        for (let i of truckLoadList) {
          i.weighTime = this.cutTimeString(i.weighTime);
        }
        this.setData({
          truckLoadList,
          truckLoadTotal: res.data.total,
        });
      } else {
        let truckLoadList = res.data.result;

        for (let i of truckLoadList) {
          i.weighTime = this.cutTimeString(i.weighTime);
        }
        this.setData({
          truckLoadList,
          truckLoadTotal: res.data.total,
        });
      }
    } else {
      // wx.showToast({
      //   icon: 'none',
      //   title: res.data.msg,
      // })
    }
  },

  async getDischargeList(isScroll) {
    if (isScroll) {
      this.data.shipDischargeCurrentPage += 1;
    } else {
      this.data.shipDischargeCurrentPage = 1;
    }
    let res = await postApi("/voyage/getDischargeList", {
      portId: this.data.currentPortId,
      voyageId: this.data.id,
      size: this.data.pageSize,
      currentPage: this.data.shipDischargeCurrentPage,
      loginAccountId: wx.getStorageSync("loginAccountId"),
    });
    this.setData({
      shipDischargeCurrentPage: this.data.shipDischargeCurrentPage,
    });
    if (0 == res.data.status) {
      if (isScroll) {
        let shipDischargeList = [
          ...this.data.shipDischargeList,
          ...res.data.result,
        ];
        for (let i of shipDischargeList) {
          i.dischargeTime = this.cutTimeString(i.dischargeTime);
        }
        this.setData({
          shipDischargeList,
          shipDischargeTotal: res.data.total,
        });
      } else {
        let shipDischargeList = res.data.result;
        for (let i of shipDischargeList) {
          i.dischargeTime = this.cutTimeString(i.dischargeTime);
        }
        this.setData({
          shipDischargeList,
          shipDischargeTotal: res.data.total,
        });
      }
    } else {
      // wx.showToast({
      //   icon: "none",
      //   title: res.data.msg,
      // })
    }
  },

  previewImage(e) {
    let { src, files } = e.currentTarget.dataset;
    let urls = [];
    if (this.data.infoType == "ship" && this.data.tab == 3) {
      urls = files.map((item) => {
        return item.viewUrl;
      });
    } else {
      urls = [src];
    }
    wx.previewImage({
      current: src, // 当前显示图片的http链接
      urls, // 需要预览的图片http链接列表
    });
  },

  changeInfoType(e) {
    let { type } = e.currentTarget.dataset;
    this.setData({
      infoType: type,
      truckLoadCurrentPage: 1,
      shipDischargeCurrentPage: 1,
      shipDischargeList: [],
      truckLoadList: [],
      shipDischargeTotal: 0,
      truckLoadTotal: 0,
    });
    if (type == "ship") {
      this.getDischargeList();
    } else {
      this.getCarLoadRecordList();
    }
  },

  cutTimeString(str) {
    let index = str.indexOf(" ");
    return index == -1 ? str : str.substring(0, index);
  },

  changeBottomPage() {
    if (this.data.infoType == "ship") {
      this.getDischargeList(true);
    } else {
      this.getCarLoadRecordList(true);
    }
  },

  scrollShip() {
    if (
      this.data.shipDischargeTotal == 0 ||
      this.data.shipDischargeTotal <=
        this.data.pageSize * this.data.shipDischargeCurrentPage
    )
      return;
    this.getDischargeList(true);
  },
  scrollTruck() {
    if (
      this.data.truckLoadTotal == 0 ||
      this.data.truckLoadTotal <=
        this.data.pageSize * this.data.truckLoadCurrentPage
    )
      return;
    this.getCarLoadRecordList(true);
  },

  changePort(e) {
    let tab3CurrentDischargeIndex = e.detail;
    this.setData({
      tab3CurrentDischargeIndex,
      currentPortId: this.data.voyageDetails[tab3CurrentDischargeIndex].portId,
      shipDischargeList: [],
      truckLoadList: [],
    });
    if (this.data.infoType == "ship") {
      this.getDischargeList();
    } else {
      this.getCarLoadRecordList();
    }
  },
  showAddDischargePortModal() {
    let beforePorts = [
      {
        portName: this.data.loadPort,
        portId: 0,
      },
    ];
    for (let i in this.data.dischargePorts) {
      beforePorts.push({
        portName: this.data.dischargePorts[i],
        portId: this.data.dischargePortIds[i],
      });
    }
    this.setData({
      dischargeModal: true,
      beforePorts,
    });
  },

  onShareAppMessage() {
    let id = wx.getStorageSync("voyageDetailId");
    return {
      title: "真实 实时 精准",
      path: `/pages/sharePage/sharePage?id=${id}`,
    };
  },

  doNothing() {},

  cancelAddDischargePort() {
    this.setData({
      dischargeModal: false,
      currentDischargePortId: "",
      currentDischargePort: "",
      currentBeforePortIndex: 0,
      beforePorts: [],
    });
  },
  selectDischargePort(e) {
    if (this.checkPort(e.detail.label, this.data.beforePorts, "portName"))
      return;
    this.setData({
      currentDischargePortId: e.detail.value,
      currentDischargePort: e.detail.label,
    });
  },
  deleteDischargePort(e) {
    let { index } = e.currentTarget.dataset;
    wx.showModal({
      title: `确认删除: ${this.data.dischargePorts[index]}?`,
      content: `此操作会同时删除当前港口下的记录`,
      success: async (res) => {
        if (res.confirm) {
          let { data } = await postApi("/voyage/deletePort", {
            voyageId: this.data.id,
            portId: this.data.dischargePortIds[index],
          });
          if (data.status == 0) {
            wx.showToast({
              title: "删除成功",
            });
          }
          this.getVoyageDetail();
        }
      },
    });
  },

  checkPort(portName = -1, ports = [], attr) {
    let b = ports.some((item) => {
      return item[attr] == portName;
    });
    if (b) {
      wx.showToast({
        title: "港口已存在",
        icon: "error",
      });
    }
    return b;
  },

  async addDischargePort() {
    let { currentDischargePortId, currentDischargePort } = this.data;
    if (!currentDischargePortId || !currentDischargePort) {
      wx.showToast({
        title: "请选择港口",
        icon: "error",
      });
      return;
    }
    let res = await postApi("/voyage/addNewPort", {
      loginAccountId: wx.getStorageSync("loginAccountId"),
      voyageId: this.data.id,
      previousPortId: this.data.beforePorts[this.data.currentBeforePortIndex]
        .portId,
      portId: this.data.currentDischargePortId,
    });
    this.getVoyageDetail();
    this.cancelAddDischargePort();
  },

  bindDischargePortChange(e) {
    let { index, param } = e.currentTarget.dataset;
    this.data.voyageDetails[index][param] = e.detail.value;
    this.setData({
      voyageDetails: this.data.voyageDetails,
    });
  },

  changeDischargeTab(e) {
    let { detail: currentDischargeIndex } = e;
    this.setData({
      currentDischargeIndex,
    });
  },

  async updateVoyage() {
    for (let i of this.data.voyageDetails) {
      Object.keys(i).forEach(function (key) {
        if (typeof i[key] == "string") {
          i[key] = i[key].replaceAll("-", "/");
          if (i[key].length == 10) i[key] = i[key] + " 00:00:00";
        }
      });
    }
    if (
      this.data.arrivalLoadPortTime &&
      this.data.arrivalLoadPortTime.length == 10
    )
      this.data.arrivalLoadPortTime =
        this.data.arrivalLoadPortTime + " 00:00:00";
    if (this.data.actualLoadTons && this.data.actualLoadTons.length == 10)
      this.data.actualLoadTons = this.data.actualLoadTons + " 00:00:00";
    if (this.data.actualLoadPieces && this.data.actualLoadPieces.length == 10)
      this.data.actualLoadPieces = this.data.actualLoadPieces + " 00:00:00";
    if (this.data.loadStartTime && this.data.loadStartTime.length == 10)
      this.data.loadStartTime = this.data.loadStartTime + " 00:00:00";
    if (this.data.loadEndTime && this.data.loadEndTime.length == 10)
      this.data.loadEndTime = this.data.loadEndTime + " 00:00:00";

    let res = await postApi("/voyage/update", {
      ...this.data,
      loginAccountId: wx.getStorageSync("loginAccountId"),
    });
    if (res.data.status == 0) {
      wx.showToast({
        title: res.data.msg,
      });
    }
    this.getVoyageDetail();
  },
  async uploadBill(e) {
    let { type } = e.currentTarget.dataset;
    let postData = {
      type,
      voyageId: this.data.id,
    };
    let res = await uploadImage("/voyage/uploadVoyageWayBill", postData);
    this.getVoyageDetail();
  },
  async completeVoyage() {
    wx.showModal({
      title: "确认完成航次?",
      success: async (e) => {
        if (e.confirm) {
          let res = await postApi("/voyage/finish", {
            loginAccountId: wx.getStorageSync("loginAccountId"),
            voyageId: this.data.id,
          });
          if (res.data.status == 0) {
            wx.showToast({
              title: "成功!",
            });
            this.getVoyageDetail();
          }
        }
      },
    });
  },
  async cancelVoyage() {
    wx.showModal({
      title: "确认取消航次?",
      success: async (e) => {
        if (e.confirm) {
          let res = await postApi("/voyage/cancel", {
            loginAccountId: wx.getStorageSync("loginAccountId"),
            id: this.data.id,
          });
          if (res.data.status == 0) {
            wx.showToast({
              title: "取消成功!",
            });
            wx.switchTab({
              url: "/pages/voyageManage/voyageManage",
            });
          }
        }
      },
    });
  },
  goTo(e) {
    let { url } = e.currentTarget.dataset;
    let { id, currentPortId } = this.data;
    wx.navigateTo({
      url: `${url}?voyageId=${id}&portId=${currentPortId}`,
    });
  },

  uploadBillCanvas() {
    wx.navigateTo({
      url: `/pages/voyageManage/takeBill/takeBill?type=1&voyageId=${this.data.id}`,
    });
  },

  loadEndTimeChange(e) {
    if (!this.data.voyageDetails[0].setSailTime)
      this.data.voyageDetails[0].setSailTime = e.detail.value;
    this.setData({
      voyageDetails: this.data.voyageDetails,
    });
  },
  bindBeforePortChange(e) {
    this.setData({
      currentBeforePortIndex: e.detail.value,
    });
  },
  onLoad(options) {
    let { id } = options;
    wx.setStorageSync("voyageDetailId", id);
    this.setData({
      id,
    });
    this.getVoyageDetail();
  },
  onShow() {
    if (wx.getStorageSync("addStatus") == "success") {
      this.getVoyageDetail();
      wx.removeStorageSync("addStatus");
    }
  },
});