无人机管理后台前端（已迁走）
parent: ca3102c3 | patch | commit | ignore whitespace
张含笑
2025-11-22 03d9cd065fe7b12c1ece887635adcedacb74131d 
feat:复制
1 files modified
1988 ■■■■■ changed files
src/views/tickets/ticket-copy.vue 1988 ●●●●● patch | view | raw | blame | history 
 src/views/tickets/ticket-copy.vue


@@ -9,6 +9,7 @@


      >


        <basic-main-content>


          <!-- 查询条件筛选栏 -->


          <!-- 查询条件筛选栏 -->


          <div class="ztzf-form-search">


            <el-form :model="filters" inline>


              <el-row :gutter="24">


@@ -25,7 +26,33 @@


                  </el-form-item>


                </el-col>






                <!-- <el-select


                  v-model="filters.department"


                  placeholder="请选择所属部门"


                  class="filter-item"


                  clearable


                >


                  <el-option


                    v-for="item in departments"


                    :key="item.value"


                    :label="item.label"


                    :value="item.value"


                  />


                </el-select> -->


                <!-- <el-select


                  v-model="filters.type"


                  placeholder="请选择工单类型"


                  class="filter-item"


                  clearable


                  @change="handleSearch"


                >


                  <el-option


                    v-for="item in types"


                    :key="item.value"


                    :label="item.label"


                    :value="item.value"


                  />


                </el-select> -->


                <el-col :span="5">


                  <el-form-item label="选择日期:">


                  <el-date-picker


@@ -60,6 +87,34 @@


                  </el-form-item>


                </el-col>




                <!-- <el-select


                  v-model="filters.algorithm"


                  placeholder="请选择关联算法"


                  class="filter-item"


                  clearable


                  @change="handleSearch"


                >


                  <el-option


                    v-for="item in algorithms"


                    :key="item.dict_key"


                    :label="item.dict_value"


                    :value="item.dict_key"


                  />


                </el-select> -->


                <!-- <el-tree-select


                  popper-class="custom-tree-select"


                  :style="{ width: pxToRem(186) }"


                  placeholder="请选择关联算法"


                  v-model="dictKey"


                  :data="dataList"


                  :default-expanded-keys="[dictKey]"


                  check-strictly


                  node-key="id"


                  :props="treePropsSF"


                  @node-click="handleSFNodeClick"


                  clearable


                  @clear="handleClear"


                /> -->


                <el-col :span="4">


                  <el-form-item label="选择算法:">


                  <el-tree-select


@@ -215,49 +270,637 @@


    </el-tabs>




    <!-- 新建工单对话框 -->


        <create-ticket-dialog


        v-model="dialogVisible"


        :departments="departments"


        :department-users="departmentUsers"


        :types="types"


        :all-algorithms="allAlgorithms"


        :edit-data="editFormData"


        :map-center="inputMapShowDefaultCenter"


        @create-success="handleCreateSuccess"


        @draft-success="handleDraftSuccess"


        @create-error="handleCreateError"


      />


    <el-dialog


      v-model="dialogVisible"


      v-if="dialogVisible"


      title="新建工单"


      width="70%"


      :close-on-click-modal="false"


      @close="resetForm"


    >


      <el-form


        :model="form"


        :rules="rules"


        ref="form"


        label-width="90px"


        class="create-ticket-form"


      >


        <div class="form-section">


          <el-row :gutter="16">


            <el-col :span="12">


              <el-form-item label="工单名称" prop="name">


                <el-input v-model="form.name" placeholder="请输入工单名称"></el-input>


              </el-form-item>


            </el-col>


            <el-col :span="12">


              <el-form-item label="工单类型" prop="type">


                <el-select


                  @change="handleTypeChange"


                  v-model="form.type"


                  placeholder="请选择工单类型"


                  class="full-width"


                >


                  <el-option


                    v-for="item in types"


                    :key="item.value"


                    :label="item.label"


                    :value="item.value"


                  />


                </el-select>


              </el-form-item>


            </el-col>


          </el-row>




          <el-row :gutter="16">


            <el-col :span="12">


              <el-form-item label="处理部门" prop="department">


                <el-select


                  v-model="form.department"


                  placeholder="请选择处理部门"


                  @change="handleDepartmentChange"


                  class="full-width"


                >


                  <el-option


                    v-for="dept in departments"


                    :key="dept.value"


                    :label="dept.label"


                    :value="dept.value"


                  />


                </el-select>


              </el-form-item>


            </el-col>


            <el-col :span="12">


              <el-form-item label="处理人员" prop="handler">


                <el-select


                  v-model="form.handler"


                  placeholder="请先选择处理人员"


                  :disabled="!form.department"


                  class="full-width"


                >


                  <el-option


                    v-for="user in availableHandlers"


                    :key="user.id"


                    :label="user.name"


                    :value="user.id"


                  />


                </el-select>


              </el-form-item>


            </el-col>


          </el-row>




          <el-row :gutter="16">


            <el-col :span="12">


              <el-form-item label="关联算法" prop="algorithm">


                <el-select


                  v-model="form.algorithm"


                  multiple


                  placeholder="请选择关联算法"


                  class="full-width"


                  :disabled="!form.type"


                >


                  <el-option


                    v-for="item in algorithms2"


                    :key="item.value"


                    :label="item.label"


                    :value="item.value"


                  />


                </el-select>


              </el-form-item>


            </el-col>


            <el-col :span="12">


              <el-form-item label="事件位置" prop="location">


                <div class="location-wrapper">


                  <avue-input-map


                    v-model="form.location"


                    :clearable="false"


                    :params="mapParams"


                    @change="handleLocationChange"


                    type="button"


                  >


                    <el-button type="primary" plain class="map-button">


                      <i class="el-icon-map-location"></i> 地图选点


                    </el-button>


                  </avue-input-map>


                  <!-- <div v-if="form.location?.length >= 3">


    {{ form.location[2] || '获取地址中...' }}


  </div> -->


                </div>


              </el-form-item>


            </el-col>


          </el-row>




          <el-row :gutter="16">


            <el-col :span="12">


              <el-form-item label="工单内容" prop="content">


                <el-input


                  type="textarea"


                  v-model="form.content"


                  :rows="4"


                  placeholder="请输入工单内容描述"


                ></el-input>


              </el-form-item>


            </el-col>


            <el-col :span="12">


              <el-form-item label="事件图片" prop="photos" required class="upload-wrapper">


                <el-upload


                  v-if="createoredit === 1"


                  ref="upload"


                  :action="'#'"


                  :auto-upload="false"


                  list-type="picture-card"


                  :on-change="handleFileChange"


                  :on-remove="handleUploadRemove"


                  :before-upload="beforeUpload"


                  :file-list="form.photos"


                  :limit="1"


                  accept="image/*"


                  class="create-upload"


                >


                  <template v-if="form.photos.length < 1">


                    <!-- <i class="el-icon-plus">+</i> -->


                    <div class="el-icon-plus">


                      <span>+</span>


                    </div>


                  </template>


                </el-upload>


                <el-upload


                  v-else


                  ref="upload"


                  :action="'#'"


                  :auto-upload="false"


                  list-type="picture-card"


                  :on-change="handleFileChange"


                  :on-remove="handleUploadRemove"


                  :before-upload="beforeUpload"


                  :file-list="popupShowImage(form.photos)"


                  :limit="1"


                  accept="image/*"


                  class="create-upload"


                >


                  <template v-if="form.photos.length < 1">


                    <div class="el-icon-plus">


                      <span>+</span>


                    </div>


                  </template>


                </el-upload>


                <div class="upload-tip">需上传含有地址信息的照片(jpg、jpeg、png),且不超过5M</div>


              </el-form-item>


            </el-col>


          </el-row>


        </div>


      </el-form>


      <template #footer>


        <div class="dialog-footer-new">


          <el-button


            type="danger"


            :loading="submitLoading"


            @click="submitForm"


            icon="el-icon-position"


            >发布


          </el-button>


          <el-button


            type="infoprimary"


            plain


            :loading="draftLoading"


            @click="saveDraft"


            icon="el-icon-document-add"


            >存草稿


          </el-button>




          <el-button @click="handleCancel" icon="el-icon-circle-close">取 消</el-button>


        </div>


      </template>


    </el-dialog>




    <!-- 工单详情对话框 -->


      <ticket-detail-dialog


        v-model="detailVisible"


        :current-detail="currentDetail"


        :current-index="currentIndex"


        :total-items="tableData.length"


        :algorithms="algorithms2"


        :types="types"


        :permission="permission"


        :step-status-list="stepStatusList"


        :work-type="workType"


        @detail-success="handleDetailSuccess"


        @detail-error="handleDetailError"


        @prev-item="handlePrevItem"


        @next-item="handleNextItem"


        @update:current-detail="handleCurrentDetailUpdate"


        @approve-and-dispatch="handleApproveAndDispatch"


      />


    <el-dialog


      class="custom-dialog"


      align-center


      v-model="detailVisible"


      title="工单详情"


      width="80%"


      append-to-body


    >


      <div class="detail-container">


        <div class="detail-top-title">


          <div class="event-title-center event-orderNumber">


            {{ currentDetail.orderNumber || '工单编号' }}


          </div>


          <div class="event-title-center">{{ currentDetail.orderName || '事件名称' }}</div>


        </div>


        <div v-if="totalTime" class="event-total-time">总耗时：{{ totalTime }}</div>


        <!-- 工单状态流程 -->


        <div class="custom-steps-container">


          <!-- 标题行 -->


          <div class="steps-titles">


            <div


              v-for="(status, index) in stepStatusList"


              :key="index"


              :class="{


                'step-title': true,


                active: index <= stepStatusList.indexOf(String(currentDetail.status)),


              }"


            >


              {{ mapStatus(status) }}


            </div>


          </div>




          <!-- Element Steps 组件 -->


          <el-steps :active="getActiveStep() - 1" align-center class="custom-steps">


            <el-step v-for="(status, index) in stepStatusList" :key="index">


              <template #description>


                <span class="step-description">


                  {{ getStepHandler(status) }}


                </span>


                <div class="step-description" v-if="getStepTime(status)">


                  <span class="step-timer"> 耗时:{{ getStepTime(status) }} </span>


                </div>


                <div class="step-description">


                  {{ getStepCreateTime(status) }}


                </div>


              </template>


            </el-step>


          </el-steps>


        </div>




        <div class="PopUpTableScrolls">


          <!-- 基本信息表格 -->


          <el-table :show-header="false" :data="formattedDetailFields" border class="tableCss">


            <el-table-column prop="label1" label="基本信息" width="150">


              <template #default="{ row }">


                <!-- 添加必填星号的标签 -->


                <span


                  v-if="


                    currentDetail.status === 0 &&


                    (row.label1 === '关联算法' || row.label1 === '工单名称')


                  "


                  class="required-label"


                >


                  <span class="required-star">*</span>{{ row.label1 }}


                </span>


                <span v-else>{{ row.label1 }}</span>


              </template>


            </el-table-column>


            <el-table-column>


              <template #default="{ row }">


                <template


                  v-if="


                    currentDetail.status === 0 &&


                    row.label1 === '工单名称' &&


                    hasProcessingBtnPermission()


                  "


                >


                  <el-input


                    v-model="currentDetail.orderName"


                    placeholder="请输入工单名称"


                    class="required-input"


                  />


                </template>


                <template


                  v-else-if="


                    currentDetail.status === 0 &&


                    row.label1 === '关联算法' &&


                    hasProcessingBtnPermission()


                  "


                >


                  <el-select


                    v-model="currentDetail.aiType"


                    placeholder="请选择关联算法"


                    class="required-input"


                  >


                    <el-option


                      v-for="item in algorithms2"


                      :key="item.value"


                      :label="item.label"


                      :value="item.value"


                    />


                  </el-select>


                </template>


                <template v-else>{{ row.value1 }}</template>


              </template>


            </el-table-column>


            <el-table-column prop="label2" label="基本信息" width="150">


              <template #default="{ row }">


                <!-- 添加必填星号的标签 -->




                <span


                  v-if="currentDetail.status === 0 && row.label2 === '工单内容'"


                  class="required-label"


                >


                  <span class="required-star">*</span>{{ row.label2 }}


                </span>


                <span v-else>{{ row.label2 }}</span>


              </template>


            </el-table-column>


            <el-table-column>


              <template #default="{ row }">


                <!-- 修改工单类型和工单内容的显示 -->




                <template


                  v-if="


                    currentDetail.status === 0 &&


                    row.label2 === '工单内容' &&


                    hasProcessingBtnPermission()


                  "


                >


                  <el-input


                    type="textarea"


                    v-model="currentDetail.content"


                    placeholder="请输入工单内容"


                    class="required-input"


                  />


                </template>


                <template v-else>{{ row.value2 }}</template>


              </template>


            </el-table-column>


          </el-table>




          <!-- 事件处理详情 -->


          <div v-if="[3, 4].includes(currentDetail.status)" class="form-section">


            <div class="section-title">


              <!-- 处理中状态显示必填星号 -->


              <template v-if="currentDetail.status === 3">


                <span class="required-label">


                  <span class="required-star">*</span>事件处理详情


                </span>


              </template>


              <template v-else> 事件处理详情</template>


            </div>


            <!-- 处理中状态显示输入框 -->


            <template v-if="currentDetail.status === 3 && hasProcessedAndOverBtnPermission()">


              <el-input


                type="textarea"


                v-model="currentDetail.processingDetail"


                placeholder="请输入事件处理详情"


                :rows="4"


                style="width: 100%; margin-bottom: 10px"


              />


            </template>


            <!-- 已完成和已完结状态显示只读文本 -->


            <template v-else>


              <div class="readonly-processing-detail">


                {{ currentDetail.processingDetail }}


              </div>


            </template>


          </div>




          <!-- 上传图片 -->


          <div v-if="[3].includes(currentDetail.status)" class="form-section uploadImg">


            <div class="section-title" v-if="hasProcessedAndOverBtnPermission()">


              <!-- 已完成状态显示必填星号 -->


              <template v-if="currentDetail.status === 3">


                <span class="required-label"> <span class="required-star">*</span>上传图片 </span>


              </template>


              <template v-else> 上传图片</template>


            </div>


            <el-upload


              v-if="hasProcessedAndOverBtnPermission()"


              ref="upload"


              :action="'#'"


              :auto-upload="false"


              list-type="picture-card"


              :on-change="handleFileChange"


              :on-remove="handleUploadRemove"


              :before-upload="beforeUpload"


              :file-list="currentDetail.photos || []"


              :limit="1"


              accept="image/*"


              class="detail-upload"


            >


              <template v-if="!currentDetail.photos || currentDetail.photos.length < 1">


                <!-- <i class="el-icon-plus">+</i> -->


                <div class="el-icon-plus">


                  <span>+</span>


                </div>


              </template>


            </el-upload>


            <div class="el-upload__tip" v-if="hasProcessedAndOverBtnPermission()">


              （上传照片即可完结工单，只能上传jpg、jpeg、png照片,且不超过5M）


            </div>


          </div>




          <!-- 图片和地图部分 -->


          <div class="media-section">


            <el-row :gutter="20">


              <el-col :span="12">


                <div class="media-box">


                  <div class="media-title">事件图片</div>


                  <div class="media-content">


                    <el-image


                      v-if="currentDetail.mediaUrl"


                      :src="getThumbUrl(currentDetail.mediaUrl)"


                      :preview-src-list="[getPreviewUrl(currentDetail.mediaUrl)]"


                      fit="contain"


                      style=" cursor: pointer"


                    >


                      <template #placeholder>


                        <div class="image-placeholder">


                          <i class="el-icon-picture-outline"></i>


                          <span>加载中...</span>


                        </div>


                      </template>


                      <template #error>


                        <div class="image-error">


                          <i class="el-icon-picture-outline"></i>


                          <span>加载失败</span>


                        </div>


                      </template>


                    </el-image>


                    <div v-else class="no-media">暂无图片/视频</div>


                  </div>


                </div>


              </el-col>


              <el-col :span="12">


                <div class="media-box">


                  <!-- 根据状态显示不同的标题和内容 -->




                  <template v-if="currentDetail.status === 4">


                    <div class="media-title">工单处理图片</div>


                    <div class="media-content">


                      <el-image


                        v-if="currentDetail.updatePhotoUrl"


                        :src="getThumbUrl(currentDetail.updatePhotoUrl)"


                        :preview-src-list="[getPreviewUrl(currentDetail.updatePhotoUrl)]"


                        fit="fill"


                      >


                        <template #placeholder>


                          <div class="image-placeholder">


                            <i class="el-icon-picture-outline"></i>


                            <span>加载中...</span>


                          </div>


                        </template>


                        <template #error>


                          <div class="image-error">


                            <i class="el-icon-picture-outline"></i>


                            <span>加载失败</span>


                          </div>


                        </template>


                      </el-image>


                      <div v-else class="no-media">暂无处理图片</div>


                    </div>


                  </template>


                  <template v-else>


                    <div class="media-title">


                      地图标记事件点


                      <el-popover


                        v-if="currentDetail.status === 3 || currentDetail.status === 0"


                        popper-class="custom-qrcode-popover"


                        :width="120"


                        :visible="currentDetail.showQR && detailVisible"


                        placement="top"


                        title=""


                        trigger="click"


                      >


                        <template #reference>


                          <img


                            @click.stop="handleQRCode(currentDetail)"


                            class="QRCodeImg"


                            src="@/assets/images/dataCenter/qrCode.svg"


                            alt=""


                            title="事件导航"


                          />


                        </template>


                        <div class="qrcode-content">


                          <div class="close-btn" @click.stop="currentDetail.showQR = false">×</div>


                          <CreateQRcode


                            v-if="currentDetail.showQR && detailVisible"


                            :latAndLon="currentDetail.location"


                          ></CreateQRcode>


                        </div>


                      </el-popover>


                    </div>


                    <div class="media-content">


                      <map-container v-if="detailVisible" ref="MapContainer"></map-container>


                    </div>


                  </template>


                </div>


              </el-col>


            </el-row>


          </div>


        </div>




        <!-- 操作按钮 -->


        <div class="dialog-footer1-new">


          <div class="leftBtn" :class="currentIndex === 0 ? 'disableds' : ''" @click="leftClick">


            上一页


          </div>


          <div class="btngroups">


            <template v-if="currentDetail.status === 2">


              <!-- 待审核 -->


              <el-button


                v-if="hasReviewBtnPermission()"


                type="primary"


                :loading="approveLoading"


                @click="approveTicket"


                icon="el-icon-check"


                >通过


              </el-button>


              <el-button


                v-if="hasReviewBtnPermission()"


                type="danger"


                :loading="rejectLoading"


                @click="rejectTicket"


                icon="el-icon-close"


                >不通过


              </el-button>


              <el-button @click="detailVisible = false" icon="el-icon-circle-close">取消</el-button>


            </template>


            <template v-else-if="currentDetail.status === 0">


              <el-button


                v-if="hasProcessingBtnPermission()"


                type="primary"


                :loading="dispatchLoading"


                @click="approveAndDispatch"


                icon="el-icon-check"


                >受理


              </el-button>


              <el-button


                v-if="hasProcessingBtnPermission()"


                type="danger"


                :loading="rejectLoading"


                @click="rejectTicket"


                icon="el-icon-close"


                >不受理


              </el-button>


              <el-button @click="detailVisible = false" icon="el-icon-circle-close">取消</el-button>


            </template>


            <template v-if="currentDetail.status === 3">


              <!-- 处理中 -->


              <el-button


                v-if="hasProcessedAndOverBtnPermission()"


                type="primary"


                :loading="completeLoading"


                @click="completeTicket"


                icon="el-icon-circle-check"


                >完成工单


              </el-button>


              <el-button @click="detailVisible = false" icon="el-icon-circle-close">取消</el-button>


            </template>


            <template v-else-if="currentDetail.status === 4">


              <!-- 已完成 -->


              <!-- <el-button v-if="hasProcessedAndOverBtnPermission()" type="primary" :loading="finalizeLoading"


              @click="finalizeTicket">完结工单</el-button> -->


              <el-button @click="detailVisible = false" icon="el-icon-circle-close">取消</el-button>


            </template>


          </div>


          <div


            :class="currentIndex === tableData.length - 1 ? 'disableds' : ''"


            class="leftBtn"


            @click="rightClick"


          >


            下一页


          </div>


        </div>


      </div>


    </el-dialog>




    <!-- 派发工单对话框 -->


      <dispatch-dialog


        v-model="dispatchDialogVisible"


        :current-detail="currentDetail"


        :departments="departments"


        :department-users="departmentUsers"


        :algorithms="algorithms"


        :types="types"


        @dispatch-success="handleDispatchSuccess"


        @dispatch-error="handleDispatchError"


      />


    <el-dialog


      v-model="dispatchDialogVisible"


      title="派发工单"


      width="40%"


      :close-on-click-modal="false"


    >


      <el-form :model="dispatchForm" :rules="dispatchRules" ref="dispatchForm" label-width="100px">


        <el-form-item label="选择部门" prop="department">


          <el-select


            v-model="dispatchForm.department"


            placeholder="请选择部门"


            @change="handleDispatchDepartmentChange"


          >


            <el-option


              v-for="dept in departments"


              :key="dept.value"


              :label="dept.label"


              :value="dept.value"


            />


          </el-select>


        </el-form-item>


        <el-form-item label="选择处理人" prop="handler">


          <el-select


            filterable


            v-model="dispatchForm.handler"


            placeholder="请选择处理人"


            :disabled="!dispatchForm.department"


          >


            <el-option


              v-for="user in availableDispatchHandlers"


              :key="user.id"


              :label="user.name"


              :value="user.id"


            />


          </el-select>


        </el-form-item>


      </el-form>


      <template #footer>


        <el-button @click="dispatchDialogVisible = false" icon="el-icon-circle-close"


          >取消


        </el-button>


        <el-button type="primary" :loading="dispatchLoading" @click="submitDispatch"


          >确认派发


        </el-button>


      </template>


    </el-dialog>




    <!-- 添加在其他 dialog 组件之后 -->


    <el-dialog


@@ -341,11 +984,20 @@


    </el-dialog>




    <!-- 复核弹出层 -->


    <recheck-dialog


  v-model="reCheckDialog"


  :recheck-data="reCheckData"


  @recheck-success="handleRecheckSuccess"


/>




    <el-dialog


      v-model="reCheckDialog"


      title="工单复核"


      width="30%"


      append-to-body


      class="ztzf-dialog-mange"


      @close="reCheckDialog = false"


    >


      <div class="dialog-footer">


        <el-button type="primary" @click="reCheckConfirm(1)">人工复核</el-button>


        <el-button type="primary" @click="reCheckConfirm(2)">无人机复核</el-button>


      </div>


    </el-dialog>


  </basic-container>


</template>




@@ -363,6 +1015,8 @@


  flowEvent,


  getstatusCount,


  getStepInfo,


  getReviewById,


  getCreateEventJob,


  exportTheTicket


} from '@/api/tickets/ticket';


import { getSFDictionaryTree } from '@/api/job/task';


@@ -374,10 +1028,7 @@


import getBaseConfig from '@/buildConfig/config';


import CreateQRcode from '@/components/CreateQRcode/CreateQRcode.vue';


import { CircleClose } from '@element-plus/icons-vue';


import RecheckDialog from '@/views/tickets/ticketComponent/RecheckDialog.vue';


import DispatchDialog from '@/views/tickets/ticketComponent/DispatchDialog.vue';


import CreateTicketDialog from '@/views/tickets/ticketComponent/CreateTicketDialog.vue';


import TicketDetailDialog from '@/views/tickets/ticketComponent/TicketDetailDialog.vue';




const { envName } = getBaseConfig();




function regExp(label, name) {


@@ -386,11 +1037,17 @@


}




export default {


  components: { elTooltipCopy, CreateQRcode,RecheckDialog,DispatchDialog,CreateTicketDialog,TicketDetailDialog, },


  components: { elTooltipCopy, CreateQRcode },


  name: 'TicketPage',


  data() {


    return {


      currentIndex: null, // 当前显示的数据索引


      submitLoading: false, // 新增loading状态


      draftLoading: false,


      approveLoading: false,


      rejectLoading: false,


      dispatchLoading: false,


      completeLoading: false,


      finalizeLoading: false,


      createoredit: '',


      activeTab: 'all',


@@ -423,7 +1080,6 @@




      algorithms: [],


      algorithms2: [],


      algorithms3: [],


      statuses: [


        { label: '待审核', value: '2' },


        { label: '待处理', value: '0' },


@@ -495,11 +1151,54 @@


        total: 0,


      },


      dialogVisible: false,


       editFormData: null, // 专门用于存储编辑数据的对象


        createoredit: '', // 可以删除这个字段，因为组件内部会判断


      detailVisible: false,


      currentDetail: {},


    


      form: {


        name: '',


        type: '',


        department: '',


        handler: '',


        algorithm: [], // 关联算法改为数组


        location: [], // 将存储为[经度, 纬度, 地址]格式


        address: '',


        photos: [],


        content: '', // 新增字段，用于存储后端返回的 content


      },


      rules: {


        name: [{ required: true, message: '请输入工单名称', trigger: 'blur' }],


        type: [{ required: true, message: '请选择工单类型', trigger: 'change' }],


        department: [{ required: true, message: '请选择所属部门', trigger: 'change' }],


        handler: [{ required: true, message: '请选择处理人员', trigger: 'change' }],


        content: [{ required: true, message: '请输入工单内容', trigger: 'blur' }],


        algorithm: [{ required: true, message: '请选择关联算法', trigger: 'change' }],


        location: [


          {


            required: true,


            validator: (rule, value, callback) => {


              if (!value || value.length < 2) {


                callback(new Error('请选择位置信息'));


              } else if (!value[0] || !value[1]) {


                callback(new Error('请选择位置信息'));


              } else {


                callback();


              }


            },


            trigger: 'change',


          },


        ],


        photos: [


          {


            validator: (rule, value, callback) => {


              if (!this.form.photos || this.form.photos.length === 0) {


                callback(new Error('请上传工单图片'));


              } else {


                callback();


              }


            },


            trigger: 'change',


          },


        ],


      },


      departmentUsers: {},


      loading: false,


      globalCounts: {},


@@ -512,7 +1211,14 @@


      dispatchDepartment: '', // 新增：派发部门


      dispatchHandler: '', // 新增：派发处理人


      dispatchDialogVisible: false, // 新增：派发对话框可见性


  


      dispatchForm: {


        department: '',


        handler: '',


      }, // 新增：派发表单数据


      dispatchRules: {


        department: [{ required: true, message: '请选择部门', trigger: 'change' }],


        handler: [{ required: true, message: '请选择处理人', trigger: 'change' }],


      }, // 新增：派发表单验证规则


      stepInfos: [], // 新增：存储步骤信息


      fixedStatuses: ['2', '0', '3', '4'], // 固定的五个状态


      userNameToIdMap: {}, // 新增用户名到ID的映射


@@ -529,7 +1235,6 @@




      // 复核弹窗


      reCheckDialog: false,


      reCheckData: {}, // 专门用于存储复核数据的对象


      treePropsSF: {


        label: 'dictValue',


        value: 'id',


@@ -542,6 +1247,7 @@


  },


  created() {


    this.inputMapShowDefaultCenter = null;




    this.loadAMapScripts();


    this.fetchDropdownData();


  },


@@ -628,7 +1334,134 @@


        ? this.departmentUsers[this.dispatchForm.department] || []


        : [];


    },


    detailTableData() {


      return [


        {


          label: '工单名称',


          value: this.currentDetail.orderName,


          editable: this.currentDetail.status === 0,


          type: 'input',


        },


        {


          label: '关键任务',


          value: this.currentDetail.keyData,


          editable: false,


        },


        {


          label: '工单创建人',


          value: this.currentDetail.creator,


          editable: false,


        },


        {


          label: '当前状态',


          value: this.mapStatus(this.currentDetail.status),


          editable: false,


        },


        {


          label: '事件地址',


          value: this.currentDetail.address,


          editable: false,


        },


        {


          label: '工单类型',


          value: this.currentDetail.type,


          editable: this.currentDetail.status === 0,


          type: 'select',


          options: this.types,


        },


        {


          label: '关联算法',


          value: this.currentDetail.aiType,


          editable: false,


        },


        {


          label: '发起单位',


          value: this.currentDetail.department,


          editable: false,


        },


        {


          label: '发起任务时间',


          value: this.currentDetail.startTime,


          editable: false,


        },


        {


          label: '工单内容',


          value: this.currentDetail.content,


          editable: this.currentDetail.status === 0,


          type: 'textarea',


        },


      ];


    },


    detailFields() {


      return [


        {


          label: '工单名称',


          value: this.currentDetail.orderName,


          editable: this.currentDetail.status === 0,


          type: 'input',


        },


        { label: '关键任务', value: this.currentDetail.keyData, editable: false },


        { label: '工单创建人', value: this.currentDetail.creator, editable: false },


        { label: '当前状态', value: this.mapStatus(this.currentDetail.status), editable: false },


        { label: '事件地址', value: this.currentDetail.address, editable: false },


        {


          label: '工单类型',


          value: this.currentDetail.type,


          editable: this.currentDetail.status === 0,


          type: 'select',


          options: this.types,


        },


        { label: '关联算法', value: this.currentDetail.aiType, editable: false },


        { label: '发起单位', value: this.currentDetail.department, editable: false },


        { label: '发起任务时间', value: this.currentDetail.startTime, editable: false },


        {


          label: '工单内容',


          value: this.currentDetail.content,


          editable: this.currentDetail.status === 0,


          type: 'textarea',


        },


      ];


    },


    formattedDetailFields() {


      const fields = [


        { label: '工单名称', value: this.currentDetail.orderName },


        {


          label: '工单类型',


          // 修改这里：使用 types 数组查找对应的 label


          value:


            this.types.find(t => t.value === this.currentDetail.type)?.label ||


            this.currentDetail.type,


        },


        { label: '关联任务', value: this.currentDetail.job_name || '/' },


        { label: '工单创建人', value: this.currentDetail.creator },


        { label: '当前状态', value: this.mapStatus(this.currentDetail.status) },


        { label: '事件地址', value: this.currentDetail.address || this.currentDetail.latAndLon }, // 包含经纬度信息


        {


          label: '关联算法',


          value:


            this.algorithms.find(t => t.value === this.currentDetail.aiType)?.label ||


            this.currentDetail.aiType,


        },


        { label: '发起单位', value: this.currentDetail.department },


        { label: '发起任务时间', value: this.currentDetail.startTime },


        { label: '工单内容', value: this.currentDetail.content },


      ];




      // 过滤掉值为 '/' 的列


      const filteredFields = fields.filter(field => field.value !== '/');


      // 将字段分成两列


      const formattedFields = [];


      for (let i = 0; i < filteredFields.length; i += 2) {


        formattedFields.push({


          label1: filteredFields[i]?.label || '',


          value1: filteredFields[i]?.value || (filteredFields[i]?.label ? '暂无数据' : ''),


          label2: filteredFields[i + 1]?.label || '',


          value2: filteredFields[i + 1]?.value || (filteredFields[i + 1]?.label ? '暂无数据' : ''),


        });


      }




      return formattedFields;


    },


    dynamicFixedStatuses() {


      // 直接使用接口返回的 stepInfos


      return this.stepInfos.map(step => String(step.status));


@@ -757,40 +1590,36 @@


        });


      }


    },


     // 上一项


    handlePrevItem() {


    // 左切换


    leftClick() {


      if (this.tableData.length === 0) return;


      this.currentIndex = Math.max(0, this.currentIndex - 1);


      this.updateCurrentDetail();


    },




    // 下一项


    handleNextItem() {


    // 右切换


    rightClick() {


      if (this.tableData.length === 0) return;


      this.currentIndex = Math.min(this.tableData.length - 1, this.currentIndex + 1);


      this.updateCurrentDetail();


    },


 


    // 更新当前详情


    updateCurrentDetail() {  


    updateCurrentDetail() {


      this.currentDetail = this.tableData[this.currentIndex];


      this.currentDetail.mediaUrl = this.currentDetail.photo_url;


      this.currentDetail.updatePhotoUrl = this.currentDetail.update_photo_url;


      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);


   },


      this.currentDetail.processingDetail = this.currentDetail.content;


      this.handleViewDetail(this.currentDetail);




    // 更新当前详情数据


    handleCurrentDetailUpdate(updatedDetail) {


      this.currentDetail = updatedDetail;


      // 如果使用地图组件，需要更新地图标记


      this.$nextTick(() => {


        if (this.$refs.MapContainer && this.currentDetail.location) {


          this.$refs.MapContainer.initAddEntity('point', this.currentDetail.location);


        }


      });


    },




    // 受理并派发


    handleApproveAndDispatch(detail) {


      this.currentDetail = detail;


      this.dispatchDialogVisible = true;


    async handleQRCode(val) {


      val.showQR = !val.showQR;


    },




    async loadAMapScripts() {


      try {


        const areaCode = this.userInfo.detail.areaCode;


@@ -820,6 +1649,64 @@


        this.mapLoaded = true;


      } catch (error) {


        this.$message.error('地图加载失败，请检查网络或API Key配置');


      }


    },


    async handleBatchApprove() {


      try {


        if (this.selections.length === 0) {


          this.$message.warning('没有选中的工单');


          return;


        }




        const currentItem = this.selections[this.currentImageIndex - 1];


        if (!currentItem) {


          this.$message.warning('当前工单数据无效');


          return;


        }




        await this.$confirm('确认审核通过当前工单?', '提示', {


          confirmButtonText: '确定',


          cancelButtonText: '取消',


          type: 'warning',


        });




        const data = {


          id: currentItem.id,


          status: currentItem.status,


          isPass: 0,


          eventNum: currentItem.orderNumber,


          eventName: currentItem.orderName,


        };




        const response = await flowEvent(data);


        if (response.data.code === 0) {


          this.$message.success('工单审核通过');




          // 创建新的数组而不是修改原数组


          const newSelections = [...this.selections];


          newSelections.splice(this.currentImageIndex - 1, 1);


          this.selections = newSelections;




          // 修正索引并更新图片


          if (this.selections.length > 0) {


            if (this.currentImageIndex > this.selections.length) {


              this.currentImageIndex = this.selections.length;


            }


            this.updateCurrentReviewImage();


          } else {


            this.reviewDialogVisible = false;


            this.currentImageIndex = 1;


            this.currentReviewImage = '';


          }




          // 刷新表格数据


          this.fetchTableData();


        } else {


          throw new Error(response.data.msg || '审核失败');


        }


      } catch (error) {


        if (error === 'cancel') return;


        this.$message.error(error.message || '审核失败，请稍后重试');


      }


    },


    async fetchDropdownData() {


@@ -872,8 +1759,35 @@


        this.$message.error('加载下拉框数据失败');


      }


    },


    // 工单类型变化时触发


    handleTypeChange(typeValue) {


      this.form.algorithm = [];


      if (!typeValue) {


        // 未选择类型时清空算法列表


        this.algorithms2 = [];


        return;


      }




    // 获取表格数据


      const matchedCategory = this.allAlgorithms.find(category => category.dict_key === typeValue);




      if (


        !matchedCategory ||


        !matchedCategory.algorithms ||


        matchedCategory.algorithms.length === 0


      ) {


        // 无匹配的算法时清空


        this.algorithms2 = [];


        this.$message.info('该工单类型暂无关联算法');


        return;


      }


      this.algorithms2 = matchedCategory.algorithms.map(algo => ({


        label: algo.dict_value,


        value: algo.dict_key,


        dict_key: algo.dict_key,


        dict_value: algo.dict_value,


      }));


    },




    async fetchTableData() {


      if (this.isFetching) return;


      this.isFetching = true;


@@ -954,6 +1868,8 @@


            job_name: item.job_name || '',


            job_create_time: item.job_create_time || '',


            isReview: item.is_review, // 添加复核状态字段映射






          };


        });




@@ -976,41 +1892,175 @@


      }


    },




 handleTypeChange(typeValue) {


      // this.form.algorithm = [];


      if (!typeValue) {


        // 未选择类型时清空算法列表


        this.algorithms2 = [];


        this.algorithms3 = [];


        return;


      }


    async submitForm() {


      if (this.submitLoading) return; // 防止重复提交


      this.submitLoading = true;


      try {


        // 提交时需要完整验证


        await this.$refs.form.validate();




      const matchedCategory = this.allAlgorithms.find(category => category.dict_key === typeValue);


        // 验证位置信息


        if (!this.form.location || this.form.location.length < 2) {


          this.$message.warning('请在地图上选择位置');


          return;


        }




      if (


        !matchedCategory ||


        !matchedCategory.algorithms ||


        matchedCategory.algorithms.length === 0


      ) {


        // 无匹配的算法时清空


        this.algorithms2 = [];


         this.algorithms3 = [];


        this.$message.info('该工单类型暂无关联算法');


        return;


        // 修改图片验证逻辑


        if (!this.form.photos || this.form.photos.length === 0) {


          this.$message.warning('请上传工单图片');


          return;


        }




        let [lng, lat] = this.disposeLocation(true, this.form);




        const submitData = {


          eventName: this.form.name,


          content: this.form.content,


          workType: '1',


          longitude: lng,


          latitude: lat,


          address: this.form.address,


          workOrderTypeDictKey: this.form.type,


          aiType: Array.isArray(this.form.algorithm) ? this.form.algorithm : [this.form.algorithm], // 传数组


          updateUser: this.form.handler,


          createDept: this.form.department,


          isDraft: 0,


        };




        if (this.form.id) {


          submitData.id = this.form.id;


        }




        // 修改获取文件的逻辑


        let file = null;


        const photoInfo = this.form.photos[0];




        if (photoInfo.raw) {


          // 如果有新上传的文件，使用新文件


          file = photoInfo.raw;


        } else if (photoInfo.existingUrl) {


          // 如果是已存在的图片，将URL添加到提交数据中


          submitData.photoUrl = photoInfo.existingUrl;


        } else {


          this.$message.warning('图片文件无效，请重新上传');


          return;


        }




        const response = await createTicket(submitData, file);


        if (response.data.code === 0) {


          this.$message.success('工单创建成功');


          this.dialogVisible = false;


          this.fetchTableData();


        } else {


          throw new Error(response.data.msg || '创建失败');


        }


      } catch (error) {


        if (error.message.includes('验证未通过')) {


          this.$message.warning('请填写完整的工单信息');


        } else {


          this.$message.error(error.message || '工单创建失败，请稍后重试');


        }


      } finally {


        this.submitLoading = false;


      }


      this.algorithms2 = matchedCategory.algorithms.map(algo => ({


        label: algo.dict_value,


        value: algo.dict_key,


        dict_key: algo.dict_key,


        dict_value: algo.dict_value,


      }));


        this.algorithms3 = matchedCategory.algorithms.map(algo => ({


        label: algo.dict_value,


        value: algo.dict_key,


        dict_key: algo.dict_key,


        dict_value: algo.dict_value,


      }));


    },




    async saveDraft() {


      if (this.draftLoading) return; // 防止重复提交


      this.draftLoading = true;


      try {


        let handlerValue = this.form.handler;


        if (!handlerValue || handlerValue === '未分配') {


          handlerValue = undefined;


        }




        // 验证位置信息


        if (


          !this.form.location ||


          this.form.location.length < 2 ||


          !this.form.location[0] ||


          !this.form.location[1]


        ) {


          this.$message.warning('请在地图上选择位置');


          return;


        }




        let [lng, lat] = this.disposeLocation(true, this.form);




        const submitData = {


          id: this.form.id,


          eventName: this.form.name || undefined,


          content: this.form.content || undefined,


          workType: '1',


          longitude: lng,


          latitude: lat,


          address: this.form.address || undefined,


          workOrderTypeDictKey: this.form.type || undefined,


          aiType:


            this.form.algorithm && this.form.algorithm.length > 0 ? this.form.algorithm : undefined, // 传数组


          updateUser: handlerValue,


          createDept: this.form.department || undefined,


          isDraft: 1,


        };




        // 草稿时也至少需要工单名称


        if (!submitData.eventName) {


          this.$message.warning('请输入工单名称');


          return;


        }




        // 过滤掉所有 undefined 的字段


        Object.keys(submitData).forEach(


          key => submitData[key] === undefined && delete submitData[key]


        );




        let file = null;


        if (this.form.photos && this.form.photos.length > 0) {


          file = this.form.photos[0].raw;


        }




        const response = await createTicket(submitData, file);


        if (response.data.code === 0) {


          this.$message.success('草稿保存成功');


          this.dialogVisible = false;


          (this.form = {


            name: '',


            type: '',


            department: '',


            handler: '',


            algorithm: [], // 关联算法改为数组


            location: [], // 将存储为[经度, 纬度, 地址]格式


            address: '',


            photos: [],


            content: '', // 新增字段，用于存储后端返回的 content


          }),


            this.fetchTableData();


        } else {


          throw new Error(response.data.msg || '保存失败');


        }


      } catch (error) {


        this.$message.error(error.message || '保存草稿失败，请稍后重试');


      } finally {


        this.draftLoading = false;


      }


    },


    handleCancel() {


      this.resetForm();


      this.dialogVisible = false;


    },


    handleLocationChange(val) {


      let locationValue = val.value;


      if (locationValue && locationValue.length >= 2) {


        // 兼容第三项为地址


        const [lng, lat] = gcj02ToWgs84(locationValue[0], locationValue[1]);


        this.form.location = [Number(lng), Number(lat), locationValue[2] || ''];


        this.form.address = locationValue[2] || '';


      } else {


        this.form.location = [];


        this.form.address = '';


      }


    },




    formatDate(date) {


      if (!date) return undefined;


      const d = new Date(date);


@@ -1126,105 +2176,156 @@


      await this.fetchTableData();


    },




  handleAdd() {


      this.editFormData = null; // 设置为 null 表示新建模式


    handleAdd() {


      this.createoredit = 1;


      this.dialogVisible = true;


      this.mapParams.center = [...this.inputMapShowDefaultCenter];


      this.form.location = [];


    },




    resetForm() {


      this.form = {


        name: '',


        type: '',


        department: '',


        handler: '',


        algorithm: [], // 关联算法改为数组


        location: [], // 将存储为[经度, 纬度, 地址]格式


        address: '',


        content: '',


        photos: [],


        content: '', // 新增字段，用于存储后端返回的 content


      };


      if (this.$refs.form) {


        this.$refs.form.resetFields();


      }


    },




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,


        };


    formatLocation(location) {


      if (!Array.isArray(location)) {


        return '未知位置';


      }


      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);


        }


      });


    }


    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 || '', // 新增


      };




  // 获取步骤信息


  await this.getStepInfoData(row.orderNumber);


  this.currentDetail.status = row.status;


 


  this.currentDetail = {


    ...detailData,


    showQR: false,


    latAndLon: _.round(detailData.location[0], 6) + ',' + _.round(detailData.location[1], 6),


  };


      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,


            };


          });


        }


        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),


      };




  console.log('this.currentDetail', this.currentDetail);


      console.log('this.currentDetail', this.currentDetail);




  this.detailVisible = true;


 this.handleTypeChange(this.currentDetail.type);


  // 重置上传组件的文件列表


  this.$nextTick(() => {


    if (this.$refs.MapContainer && this.$refs.MapContainer.initAddEntity) {


      this.$refs.MapContainer.initAddEntity('point', this.currentDetail.location);


    }


  });


},


 // 详情成功回调


    handleDetailSuccess() {


      this.fetchTableData();


      this.detailVisible = true;


      this.handleTypeChange(this.currentDetail.type);






      this.$nextTick(() => {


        if (this.$refs.MapContainer && this.$refs.MapContainer.initAddEntity) {


          this.$refs.MapContainer.initAddEntity('point', this.currentDetail.location);


        }


      });


    },




    // 详情错误回调


    handleDetailError(error) {


      console.error('工单操作失败:', error);


    getStepHandler(status) {


      const step = this.stepInfos.find(step => step.status === status);


      return step ? step.name : '';


    },




    getStepTime(status) {


      const step = this.stepInfos.find(step => step.status === status);


      // 如果 step 不存在或 step.time 为 0，返回 false


      return step && step.time && step.time !== '0' ? step.time : false;


    },


    getStepCreateTime(status) {


      const step = this.stepInfos.find(step => step.status === status);


      return step ? step.create_time : null;


    },


    getActiveStep() {


      // 步骤索引适配


      const arr = this.stepStatusList;


      const index = arr.indexOf(String(this.currentDetail.status));


      return index !== -1 ? index + 2 : 1;


    },




    openMap() {


      const areaCode = this.userInfo.detail.areaCode;


      const subAreaCode = areaCode ? areaCode.substring(0, 6) : '';


      getAdcodeObj(geoJson, 'adcode', subAreaCode);


      this.$message.info('地图选址功能暂未实现');


    },




    handlePreview(file) {


      this.$message.info(`预览图片：${file.name}`);


    },




    handleRemove(file) {


      this.$message.info(`移除图片：${file.name}`);


    },




    refreshChange() {


      if (this.isFetching) return;


@@ -1302,21 +2403,287 @@


      };


    },




    handleDepartmentChange(deptId) {


      this.form.handler = '';


    },




    handleDispatchDepartmentChange(deptId) {


      this.dispatchForm.handler = ''; // 清空处理人选择


    },




    // 文件改变时的钩子


    handleFileChange(file, fileList) {


      // 保持最新的文件列表


      this.form.photos = fileList.map(item => ({


        ...item,


        existingUrl: item.url && !item.raw ? item.url : null, // 标记已存在的图片URL


      }));


      this.currentDetail.photos = this.form.photos;


    },




    // 文件移除时的钩子


    handleUploadRemove(file, fileList) {


      this.form.photos = fileList;


      this.currentDetail.photos = fileList;


    },




    // 上传前的验证


    beforeUpload(file) {


      const isImage = file.type.includes('image');


      const isLt5M = file.size / 1024 / 1024 < 5;




      if (!isImage) {


        this.$message.error('只能上传图片文件!');


        return false;


      }


      if (!isLt5M) {


        this.$message.error('图片大小不能超过5MB!');


        return false;


      }


      return true;


    },




    async approveTicket() {


      if (this.approveLoading) return;


      this.approveLoading = true;


      try {


        const data = {


          id: this.currentDetail.id,


          status: this.currentDetail.status,


          isPass: 0, // 0 表示通过


          eventNum: this.currentDetail.orderNumber,


        };




        const file = this.currentDetail.file || null; // 如果没有文件，则为 null




        const response = await flowEvent(data, file);


        if (response.data.code === 0) {


          this.$message.success('工单已通过');


          this.detailVisible = false;


          this.fetchTableData();


        } else {


          throw new Error(response.data.msg || '操作失败');


        }


      } catch (error) {


        this.$message.error(error.message || '操作失败，请稍后重试');


      } finally {


        this.approveLoading = false;


      }


    },


    async rejectTicket() {


      if (this.rejectLoading) return;


      this.rejectLoading = true;


      try {


        const data = {


          id: this.currentDetail.id,


          status: this.currentDetail.status,


          isPass: 1, // 1 表示不通过


        };




        const response = await flowEvent(data);


        if (response.data.code === 0) {


          this.$message.success('工单未通过');


          this.detailVisible = false;


          this.fetchTableData();


        } else {


          throw new Error(response.data.msg || '操作失败');


        }


      } catch (error) {


        this.$message.error(error.message || '操作失败，请稍后重试');


      } finally {


        this.rejectLoading = false;


      }


    },


    async submitProcessing() {


      if (this.currentDetail.status !== 3) {


        this.$message.warning('只有处理中状态的工单可以提交处理详情');


        return;


      }




      try {


        const data = {


          id: this.currentDetail.id, // 当前工单 ID


          status: this.currentDetail.status, // 当前工单状态


          processing_details: this.currentDetail.processingDetail, // 事件处理详情


        };




        // 如果有图片，添加 file 参数


        const file = this.currentDetail.photos?.[0]?.raw || null;




        const response = await flowEvent(data, file);


        if (response.data.code === 0) {


          this.$message.success('处理详情提交成功');


          this.detailVisible = false;


          this.fetchTableData();


        } else {


          throw new Error(response.data.msg || '提交失败');


        }


      } catch (error) {


        console.error('处理详情提交失败:', error);


        this.$message.error(error.message || '提交失败，请稍后重试');


      }


    },


    markAsCompleted() {


      this.$message.success('工单已标记为完成');


    },


    // 派发成功回调


    handleDispatchSuccess() {


      this.detailVisible = false;


      this.fetchTableData();


    async completeTicket() {


      if (this.completeLoading) return;


      this.completeLoading = true;


      try {


        if (!this.currentDetail.processingDetail) {


          this.$message.warning('请先填写事件处理详情');


          return;


        }


        // 检查图片上传


        if (!this.currentDetail.photos || this.currentDetail.photos.length === 0) {


          this.$message.warning('请选择上传图片');


          this.completeLoading = false;


          return;


        }




        const data = {


          id: this.currentDetail.id,


          status: this.currentDetail.status,


          processingDetails: this.currentDetail.processingDetail,


          eventNum: this.currentDetail.orderNumber,


        };




        // 如果有上传的图片，添加到请求中


        const file = this.currentDetail.photos?.[0]?.raw || null;




        const response = await flowEvent(data, file);




        if (response.data.code === 0) {


          this.$message.success('工单已完成');


          this.detailVisible = false;


          this.fetchTableData(); // 刷新列表数据


        } else {


          throw new Error(response.data.msg || '操作失败');


        }


      } catch (error) {


        console.error('完成工单失败:', error);


        this.$message.error(error.message || '操作失败，请稍后重试');


      } finally {


        this.completeLoading = false;


      }


    },


    async approveAndDispatch() {


      if (this.dispatchLoading) return;




      // 添加必填项检查


      if (!this.currentDetail.orderName || !this.currentDetail.orderName.trim()) {


        this.$message.warning('请填写工单名称');


        return;


      }


      if (!this.currentDetail.aiType) {


        this.$message.warning('请选择关联算法');


        return;


      }


      if (!this.currentDetail.content || !this.currentDetail.content.trim()) {


        this.$message.warning('请填写工单内容');


        return;


      }




      // 通过验证后,打开派发对话框


      this.dispatchDialogVisible = true;




      console.log('受理', this.currentDetail);


    },


    hasProcessingBtnPermission() {


      // undefined 或 false 都返回 false，只有 true 返回 true


      //  console.log('权限检查:', this.permission.tickets_processing_btn)


      return this.permission && this.permission.tickets_processing_btn === true;


    },


    hasProcessedAndOverBtnPermission() {


      // undefined 或 false 都返回 false，只有 true 返回 true


      //console.log('权限检查:', this.permission)


      return this.permission && this.permission.tickets_view_processedAndOver === true;


    },


    hasReviewBtnPermission() {


      // undefined 或 false 都返回 false，只有 true 返回 true


      // console.log('权限检查:', this.permission)


      return this.permission && this.permission.tickets_review_btn === true;


    },




    // 派发错误回调


    handleDispatchError(error) {


      // 可以在这里处理错误，或者保持空实现


      console.error('派发失败:', error);


    },


    async submitDispatch() {


      if (this.dispatchLoading) return;


      if (!this.currentDetail.orderName || !this.currentDetail.orderName.trim()) {


        this.$message.warning('请填写工单名称');


        return;


      }


      if (!this.currentDetail.type) {


        this.$message.warning('请选择工单类型');


        return;


      }


      if (!this.currentDetail.content || !this.currentDetail.content.trim()) {


        this.$message.warning('请填写工单内容');


        return;


      }


      if (!this.dispatchForm.department) {


        this.$message.warning('请选择部门');


        return;


      }


      if (!this.dispatchForm.handler) {


        this.$message.warning('请选择处理人');


        return;


      }


      this.dispatchLoading = true;


      console.log('派发成功', this.currentDetail);


      const isValue = this.algorithms.some(item => item.value === this.currentDetail.aiType);


      let resultValue;




      if (isValue) {


        // 如果已经是value，直接使用


        resultValue = this.currentDetail.aiType;


      } else {


        // 否则查找对应的value


        const matched = this.algorithms.find(


          item => item.dict_value === this.currentDetail.aiType ||


                  item.label === this.currentDetail.aiType


        );


        resultValue = matched ? matched.value : null;


      }




// console.log('resultValue',resultValue);


      this.$refs.dispatchForm.validate(async valid => {


        if (valid) {


          try {


            const data = {


              id: this.currentDetail.id,


              status: this.currentDetail.status,


              isPass: 0, // 0 表示通过


              eventName: this.currentDetail.orderName, // 工单名称


              eventNum: this.currentDetail.orderNumber,


              workOrderTypeDictKey: this.currentDetail.type, // 直接使用原始的 dict_key


              content: this.currentDetail.content, // 使用 content 替代原来的 remark


              createDept: this.dispatchForm.department, // 派发部门 ID


              updateUser: this.dispatchForm.handler, // 处理人 ID


              aiType:resultValue,


            };


            console.log('派发', data);




            const file = this.currentDetail.file || null; // 如果没有文件，则为 null




            const response = await flowEvent(data, file);


            if (response.data.code === 0) {


              this.$message.success('工单已成功派发');


              this.dispatchDialogVisible = false;


              this.detailVisible = false;


              this.fetchTableData();


            } else {


              throw new Error(response.data.msg || '派发失败');


            }


          } catch (error) {


            console.error('派发失败:', error);


            this.$message.error(error.message || '派发失败，请稍后重试');


          } finally {


            this.dispatchLoading = false;


          }


        } else {


          this.dispatchLoading = false;


        }


      });


    },


    async finalizeTicket() {


      if (this.finalizeLoading) return;


      this.finalizeLoading = true;


@@ -1353,24 +2720,122 @@


    },




    // 添加编辑方法


    // 编辑工单 - 简化方法


    handleEdit(row) {


      this.editFormData = row; // 设置编辑数据


      this.createoredit = 2;


      console.log('编辑原始数据:', row);




      // 尝试从row.dept_id或通过部门名称查找对应的部门ID


      let deptId = row.dept_id; // 优先使用原始数据中的dept_id




      // 如果没有dept_id，则通过部门名称查找


      if (!deptId) {


        // 输出所有可用的部门数据用于调试


        console.log('可用部门列表:', this.departments);


        console.log('当前部门名称:', row.department);




        const deptInfo = this.departments.find(


          dept => dept.label && dept.label.trim() === row.department.trim()


        );


        deptId = deptInfo?.value;


      }




      // 获取工单类型值 - 从types中找到匹配的值


      const typeValue =


        this.types.find(t => t.value === row.type)?.value || row.work_order_type_dict_key;


      // 获取处理人ID - 使用userNameToIdMap映射


      const handlerId = this.userNameToIdMap[row.handler] || row.handler;




      console.log('数据映射:', {


        部门名称: row.department,


        找到的部门ID: deptId,


        原始处理人: row.handler,


        处理人ID: handlerId,


        原始工单类型: row.type,


        映射后类型值: typeValue,


      });




      // 修改算法数组的处理逻辑


      let algorithmArr = [];


      if (Array.isArray(row.aiType)) {


        algorithmArr = row.aiType;


      } else if (typeof row.aiType === 'string' && row.aiType) {


        // 首先尝试将字符串按照逗号或顿号分割


        algorithmArr = row.aiType.split(/[,、]/).map(item => item.trim());


      }




      // 确保算法值与选项匹配


      algorithmArr = algorithmArr


        .map(item => {


          // 如果是字符串值，尝试找到对应的 dict_key


          if (typeof item === 'string') {


            const matchedAlgorithm = this.algorithms.find(


              algo => algo.dict_value === item || algo.dict_key === item


            );


            return matchedAlgorithm ? matchedAlgorithm.dict_key : item;


          }


          return item;


        })


        .filter(Boolean); // 过滤掉无效值




      console.log('算法处理:', {


        原始值: row.aiType,


        分割后: algorithmArr,


      });




      this.form = {


        id: row.id,


        name: row.orderName,


        type: typeValue,


        department: deptId,


        handler: handlerId,


        algorithm: algorithmArr,


        location:


          Array.isArray(row.location) && row.location.length >= 2


            ? [Number(row.location[0]), Number(row.location[1])]


            : [],


        address: row.address || '',


        content: row.content,


        photos: [],


      };




      let curLocation = [];




      if (Array.isArray(row.location) && row.location.length >= 2) {


        let [lng, lat] = this.disposeLocation(false, row);




        curLocation = [lng, lat, row.location[2] || row.address || ''];


      }




      this.form.location = curLocation;


      this.form.address = this.form.location[2] || '';


      // 设置地图中心点


      if (Array.isArray(this.form.location) && this.form.location.length >= 2) {


        this.mapParams.center = [Number(this.form.location[0]), Number(this.form.location[1])];


      } else {


        this.mapParams.center = [...this.inputMapShowDefaultCenter];


      }


      // 如果有图片，添加到表单中


      if (row.photo_url) {


        // 创建一个带有必要信息的文件对象


        this.form.photos = [


          {


            name: 'existing-photo.jpg', // 添加默认扩展名


            url: row.photo_url, // 用于预览的URL


            status: 'success', // 标记为已上传成功


            raw: null, // 初始化为null


            existingUrl: row.photo_url, // 保存原始URL，用于区分是否为已存在的图片


          },


        ];


      }




      // 调试输出


      console.log('编辑表单数据:', {


        原始算法值: row.aiType,


        处理后算法值: algorithmArr,


        表单数据: this.form,


      });




      this.dialogVisible = true;


    },


    // 创建成功回调


    handleCreateSuccess() {


      this.fetchTableData();


    },




    // 草稿保存成功回调


    handleDraftSuccess() {


      this.fetchTableData();


    },




    // 创建失败回调


    handleCreateError(error) {


      console.error('工单操作失败:', error);


    },




    // 添加删除方法


@@ -1411,6 +2876,11 @@


    // 添加全选方法


    handleSelectAll(val) {


      this.$refs.avueCrud.toggleSelection(val);


    },




    // 添加单行选择方法


    handleSelect(selection, row) {


      console.log('选中行变化：', selection, row);


    },




    // 如果需要手动选中某些行


@@ -1674,17 +3144,58 @@


    },




    // 复核按钮


  reCheck(row) {


    reCheck(row) {


      this.reCheckData = row;


      this.reCheckDialog = true;


    },


 // 复核成功回调


    handleRecheckSuccess() {


      this.page.currentPage = 1;


      this.fetchTableData();


      this.fetchTabCounts();




    // 复核确认框按钮事件


    reCheckConfirm(key) {


      const that = this;


      if (key == 1) {


        getReviewById(that.reCheckData.id).then(res => {


          that.reCheckDialog = false;


          that.page.currentPage = 1;


          that.fetchTableData();


          that.fetchTabCounts();


        });


      } else {


        const loading = ElLoading.service({


          lock: true,


          text: '复核任务创建中……',


          background: 'rgba(0, 0, 0, 0.7)',


        });




        function closeConfirm() {


          that.reCheckDialog = false;


          that.page.currentPage = 1;


          that.fetchTableData();


          that.fetchTabCounts();


          loading.close();


        }




        // 获取时间的接口


        getCreateEventJob(that.reCheckData.id)


          .then(res => {


            ElMessageBox.confirm(`预计复核执行时间为${res.data.data}`, '提示', {


              confirmButtonText: '确定',


              showCancelButton: false, // 关键配置


              closeOnClickModal: false,


              closeOnPressEscape: false,


              type: 'warning',


            })


              .then(() => {


                closeConfirm();


              })


              .catch(() => {


                closeConfirm();


              });


          })


          .catch(() => {


            closeConfirm();


          });


      }


    },


   


    // 导出工单报表


    exportTheTick(row){


      const params = {


@@ -1709,6 +3220,14 @@


};


</script>


<style lang="scss">


.custom-dialog {


  max-height: 96vh;




  .el-dialog__body {


    border-top: 0.1rem solid #f0f0f0;


  }


}




.custom-qrcode-popover {


  min-width: 160px !important;


  min-height: 140px !important;


@@ -2258,7 +3777,22 @@


  word-break: break-word;


}




.readonly-processing-detail {


  background-color: #f5f7fa;


  padding: 12px;


  border-radius: 4px;


  min-height: 30px;


  color: #606266;


  line-height: 1.5;


  display: block;


  text-align: left;


  margin-bottom: 5px;




  &:first-child {


    font-weight: bold;


    margin-bottom: 4px;


  }


}




// 添加删除按钮样式


.danger-button {