wlzboy
2025-09-24 62a079a15b46925283581f6caaf631b5a4558927
ruoyi-ui/src/views/task/general/index.vue
@@ -94,7 +94,15 @@
    <el-table v-loading="loading" :data="taskList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="任务编号" align="center" prop="taskCode" />
      <el-table-column label="任务编号" align="center" prop="taskCode">
        <template slot-scope="scope">
          <el-button
            type="text"
            @click="handleView(scope.row)"
            v-hasPermi="['task:general:query']"
          >{{ scope.row.taskCode }}</el-button>
        </template>
      </el-table-column>
      <el-table-column label="任务类型" align="center" prop="taskType">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.sys_task_type" :value="scope.row.taskType"/>
@@ -105,9 +113,14 @@
          <dict-tag :options="dict.type.sys_task_status" :value="scope.row.taskStatus"/>
        </template>
      </el-table-column>
      <el-table-column label="任务描述" align="center" prop="taskDescription" show-overflow-tooltip />
      <el-table-column label="出发地址" align="center" prop="departureAddress" show-overflow-tooltip />
      <el-table-column label="目的地址" align="center" prop="destinationAddress" show-overflow-tooltip />
      <el-table-column label="预计公里数" align="center" prop="estimatedDistance" width="120">
        <template slot-scope="scope">
          <span v-if="scope.row.estimatedDistance">{{ scope.row.estimatedDistance }} km</span>
          <span v-else style="color: #C0C4CC;">--</span>
        </template>
      </el-table-column>
      <el-table-column label="计划开始时间" align="center" prop="plannedStartTime" width="180">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.plannedStartTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
@@ -175,7 +188,7 @@
    />
    <!-- 添加或修改任务管理对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="600px" append-to-body>
    <el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-form-item label="任务类型" prop="taskType">
          <el-select v-model="form.taskType" placeholder="请选择任务类型">
@@ -195,6 +208,86 @@
        </el-form-item>
        <el-form-item label="目的地址" prop="destinationAddress">
          <el-input v-model="form.destinationAddress" placeholder="请输入目的地址" />
        </el-form-item>
        <!-- GPS坐标信息 -->
        <el-divider content-position="left">GPS坐标信息</el-divider>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="出发地经度" prop="departureLongitude">
              <el-input-number
                v-model="form.departureLongitude"
                :precision="7"
                :step="0.0000001"
                :min="-180"
                :max="180"
                placeholder="请输入经度"
                style="width: 100%"
                @change="calculateDistance"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="出发地纬度" prop="departureLatitude">
              <el-input-number
                v-model="form.departureLatitude"
                :precision="7"
                :step="0.0000001"
                :min="-90"
                :max="90"
                placeholder="请输入纬度"
                style="width: 100%"
                @change="calculateDistance"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="目的地经度" prop="destinationLongitude">
              <el-input-number
                v-model="form.destinationLongitude"
                :precision="7"
                :step="0.0000001"
                :min="-180"
                :max="180"
                placeholder="请输入经度"
                style="width: 100%"
                @change="calculateDistance"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="目的地纬度" prop="destinationLatitude">
              <el-input-number
                v-model="form.destinationLatitude"
                :precision="7"
                :step="0.0000001"
                :min="-90"
                :max="90"
                placeholder="请输入纬度"
                style="width: 100%"
                @change="calculateDistance"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="预计公里数" prop="estimatedDistance">
          <el-input-number
            v-model="form.estimatedDistance"
            :precision="2"
            :step="0.01"
            :min="0"
            placeholder="自动计算"
            style="width: 200px"
            :disabled="true"
          />
          <span style="margin-left: 10px; color: #909399; font-size: 12px;">
            <i class="el-icon-info"></i> 根据GPS坐标自动计算
          </span>
        </el-form-item>
        <el-form-item label="计划开始时间" prop="plannedStartTime">
          <el-date-picker clearable
@@ -398,6 +491,11 @@
        taskDescription: null,
        departureAddress: null,
        destinationAddress: null,
        departureLongitude: null,
        departureLatitude: null,
        destinationLongitude: null,
        destinationLatitude: null,
        estimatedDistance: null,
        plannedStartTime: null,
        plannedEndTime: null,
        assigneeId: null,
@@ -529,6 +627,52 @@
    cancelStatusChange() {
      this.statusOpen = false;
      this.statusForm = {};
    },
    /** 计算GPS坐标距离 */
    calculateDistance() {
      if (this.form.departureLongitude && this.form.departureLatitude &&
          this.form.destinationLongitude && this.form.destinationLatitude) {
        // 验证坐标有效性
        if (this.isValidCoordinate(this.form.departureLatitude, this.form.departureLongitude) &&
            this.isValidCoordinate(this.form.destinationLatitude, this.form.destinationLongitude)) {
          // 使用Haversine公式计算距离
          const distance = this.calculateHaversineDistance(
            this.form.departureLatitude, this.form.departureLongitude,
            this.form.destinationLatitude, this.form.destinationLongitude
          );
          this.form.estimatedDistance = Math.round(distance * 100) / 100; // 保留2位小数
        } else {
          this.form.estimatedDistance = 0;
        }
      } else {
        this.form.estimatedDistance = 0;
      }
    },
    /** 验证GPS坐标是否有效 */
    isValidCoordinate(latitude, longitude) {
      return latitude >= -90 && latitude <= 90 && longitude >= -180 && longitude <= 180;
    },
    /** 使用Haversine公式计算两点间距离 */
    calculateHaversineDistance(lat1, lon1, lat2, lon2) {
      const R = 6371; // 地球半径(公里)
      const dLat = this.toRadians(lat2 - lat1);
      const dLon = this.toRadians(lon2 - lon1);
      const a = Math.sin(dLat / 2) * Math.sin(dLat / 2) +
                Math.cos(this.toRadians(lat1)) * Math.cos(this.toRadians(lat2)) *
                Math.sin(dLon / 2) * Math.sin(dLon / 2);
      const c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));
      return R * c;
    },
    /** 角度转弧度 */
    toRadians(degrees) {
      return degrees * (Math.PI / 180);
    }
  }
};