feat:拆分详情组件

张含笑

2025-11-20 570cacb3b74c80512b87f4a7f59955f50494e90a

feat:拆分详情组件

 src/views/tickets/ticket.vue

@@ -960,15 +960,16 @@
    },
 
    // 更新当前详情
 
    updateCurrentDetail() {
    updateCurrentDetail() {  
      this.currentDetail = this.tableData[this.currentIndex];
      console.log('当前',this.currentDetail);    
      this.currentDetail.mediaUrl = this.currentDetail.photo_url;
      this.currentDetail.updatePhotoUrl = this.currentDetail.update_photo_url;
      this.currentDetail.processingDetail = this.currentDetail.content;
      this.currentDetail.processingDetail = this.currentDetail.processingDetail;
      this.currentDetail.showQR = false;
      this.currentDetail.latAndLon = _.round(this.currentDetail.location[0], 6) + ',' + _.round(this.currentDetail.location[1], 6);
    },
       this.getStepInfoData(this.currentDetail.orderNumber);
   },

    // 更新当前详情数据
    handleCurrentDetailUpdate(updatedDetail) {
@@ -1300,90 +1301,93 @@
      return `${location[0].toFixed(6)}, ${location[1].toFixed(6)}`;
    },

    async handleViewDetail(row) {
      // 找到当前行在tableData中的索引
      this.currentIndex = this.tableData.findIndex(item => item.id === row.id);
      // 先设置workType，直接从row读取
      this.workType = row.work_type !== undefined ? Number(row.work_type) : 0;

      // 重置上传组件的文件列表
      this.$nextTick(() => {
        if (this.$refs.MapContainer && this.$refs.MapContainer.initAddEntity) {
          this.$refs.MapContainer.initAddEntity('point', this.currentDetail.location);
        }
async getStepInfoData(val) {
  try {
  const orderNum = val
    const stepResponse = await getStepInfo(orderNum);
    const steps = Array.isArray(stepResponse.data.data)
      ? stepResponse.data.data
      : stepResponse.data.data?.steps || [];
    
    const finishedStep = steps.find(s => String(s.status) === '4');
    this.totalTime = finishedStep && finishedStep.total_time ? finishedStep.total_time : '';
    
    if (this.activeTab !== 'myTickets') {
      this.stepInfos = steps.map(step => ({
        status: String(step.status),
        name: step.name,
        time: step.time,
        create_time: step.create_time,
      }));
    } else {
      const statusArr = this.workType === 1 ? ['3', '4'] : this.fixedStatuses;
      this.stepInfos = statusArr.map(status => {
        const step = steps.find(s => String(s.status) === String(status));
        return {
          status,
          name: step ? step.name : '',
          time: step ? step.time : null,
          create_time: step ? step.create_time : null,
        };
      });
    }
    console.log('stepInfos',this.stepInfos);
    
    return true; // 表示成功获取数据
  } catch (error) {
    console.error('获取步骤信息失败:', error);
    // 失败时设置默认步骤信息
    if (this.activeTab === 'myTickets') {
      const statusArr = this.workType === 1 ? ['3', '4'] : this.fixedStatuses;
      this.stepInfos = statusArr.map(status => ({
        status,
        name: status === row.status ? row.handler || '未分配' : '未处理',
        time: status === row.status ? row.startTime || '未知时间' : null,
      }));
    } else {
      this.stepInfos = [];
    }
    return false; // 表示获取数据失败
  }
},
   async handleViewDetail(row) {
  // 找到当前行在tableData中的索引
  this.currentIndex = this.tableData.findIndex(item => item.id === row.id);
  // 先设置workType，直接从row读取
  this.workType = row.work_type !== undefined ? Number(row.work_type) : 0;

      const detailData = {
        ...row,
        processingDetail: row.processing_details || '',
        mediaUrl: row.photo_url || row.video_url || '',
        updatePhotoUrl: row.update_photo_url || '',
        photos: [],
        job_name: row.job_name || '', // 新增
      };
  const detailData = {
    ...row,
    processingDetail: row.processing_details || '',
    mediaUrl: row.photo_url || row.video_url || '',
    updatePhotoUrl: row.update_photo_url || '',
    photos: [],
    job_name: row.job_name || '',
  };

      let stepArr = [];
      try {
        const stepResponse = await getStepInfo(row.orderNumber);
        const steps = Array.isArray(stepResponse.data.data)
          ? stepResponse.data.data
          : stepResponse.data.data?.steps || [];
        const finishedStep = steps.find(s => String(s.status) === '4');
        this.totalTime = finishedStep && finishedStep.total_time ? finishedStep.total_time : '';
        if (this.activeTab !== 'myTickets') {
          this.stepInfos = steps.map(step => ({
            status: String(step.status),
            name: step.name,
            time: step.time,
            create_time: step.create_time,
          }));
        } else {
          const statusArr = this.workType === 1 ? ['3', '4'] : this.fixedStatuses;
          this.stepInfos = statusArr.map(status => {
            const step = steps.find(s => String(s.status) === String(status));
            return {
              status,
              name: step ? step.name : '',
              time: step ? step.time : null,
              create_time: step ? step.create_time : null,
            };
          });
          console.log('this.stepInfos', this.stepInfos);
          
        }
        this.currentDetail.status = row.status;
      } catch (error) {
        if (this.activeTab === 'myTickets') {
          const statusArr = this.workType === 1 ? ['3', '4'] : this.fixedStatuses;
          this.stepInfos = statusArr.map(status => ({
            status,
            name: status === row.status ? row.handler || '未分配' : '未处理',
            time: status === row.status ? row.startTime || '未知时间' : null,
          }));
        } else {
          this.stepInfos = [];
        }
      }
      console.log(detailData, 'detailDatadetailDatadetailData');
      this.currentDetail = {
        ...detailData,
        // address: null,
        showQR: false,
        latAndLon: _.round(detailData.location[0], 6) + ',' + _.round(detailData.location[1], 6),
      };
  // 获取步骤信息
  await this.getStepInfoData(row.orderNumber);
  
  this.currentDetail.status = row.status;

      console.log('this.currentDetail', this.currentDetail);
  console.log(detailData, 'detailDatadetailDatadetailData');
  this.currentDetail = {
    ...detailData,
    showQR: false,
    latAndLon: _.round(detailData.location[0], 6) + ',' + _.round(detailData.location[1], 6),
  };

      this.detailVisible = true;
  console.log('this.currentDetail', this.currentDetail);

  this.detailVisible = true;


      this.$nextTick(() => {
        if (this.$refs.MapContainer && this.$refs.MapContainer.initAddEntity) {
          this.$refs.MapContainer.initAddEntity('point', this.currentDetail.location);
        }
      });
    },
  // 重置上传组件的文件列表
  this.$nextTick(() => {
    if (this.$refs.MapContainer && this.$refs.MapContainer.initAddEntity) {
      this.$refs.MapContainer.initAddEntity('point', this.currentDetail.location);
    }
  });
},
 // 详情成功回调
    handleDetailSuccess() {
      this.fetchTableData();