| | |
| | | </div> |
| | | |
| | | <!-- 表格部分 --> |
| | | <avue-crud ref="avueCrud" v-model="tableData" :option="option" :data="tableData" v-model:page="page" |
| | | @size-change="sizeChange" @current-change="handleCurrentChange" :table-loading="loading" |
| | | @selection-change="handleSelectionChange" :permission="permissionList" v-if="activeTab === tab.name"> |
| | | <avue-crud class="ztzf-public-general-avue-crud" ref="avueCrud" v-model="tableData" :option="option" |
| | | :data="tableData" v-model:page="page" @size-change="sizeChange" @current-change="handleCurrentChange" |
| | | @refresh-change="refreshChange" :table-loading="loading" @selection-change="handleSelectionChange" |
| | | :permission="permissionList" v-if="activeTab === tab.name"> |
| | | <template #menu-left> |
| | | <el-button v-if="(activeTab === 'all' || activeTab === 'myTickets') && permissionList.addBtn" |
| | | type="primary" icon="el-icon-plus" @click="handleAdd">新建工单</el-button> |
| | |
| | | |
| | | <template v-if="permission.tickets_repeat_review"> |
| | | <el-button v-if="row.status === 4 && row.isReview !== 1" type="text" icon="el-icon-check" |
| | | @click="reCheck(row)">复核</el-button> |
| | | @click="reCheck(row)">复核</el-button> |
| | | </template> |
| | | |
| | | </template> |
| | |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="选择位置" prop="location" required> |
| | | <el-form-item label="选择位置" prop="location"> |
| | | <div class="location-wrapper"> |
| | | <avue-input-map v-model="form.location" :params="mapParams" @change="handleLocationChange" |
| | | type="button"> |
| | | <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> |
| | |
| | | </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"> |
| | | <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"> |
| | | <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" |
| | | <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"> |
| | | |
| | | <div class="el-icon-plus"> |
| | | <span>+</span> |
| | | </div> |
| | | </template> |
| | |
| | | <!-- 工单详情对话框 --> |
| | | <el-dialog 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 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> |
| | |
| | | <template v-if="!currentDetail.photos || currentDetail.photos.length < 1"> |
| | | <!-- <i class="el-icon-plus">+</i> --> |
| | | <div class="el-icon-plus"> |
| | | <span>+</span> |
| | | </div> |
| | | <span>+</span> |
| | | </div> |
| | | </template> |
| | | </el-upload> |
| | | <div class="el-upload__tip" v-if="hasProcessedAndOverBtnPermission()"> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import { getSmallImg,getShowImg } from '@/utils/util'; |
| | | import { getSmallImg, getShowImg } from '@/utils/util' |
| | | import { ElMessageBox, ElLoading } from 'element-plus' |
| | | import { calculateDefaultRange } from '@/utils/util' |
| | | import { gcj02ToWgs84, wgs84ToGcj02 } from '@/utils/coordinateTransformation' |
| | |
| | | dispatchLoading: false, |
| | | completeLoading: false, |
| | | finalizeLoading: false, |
| | | createoredit:'', |
| | | createoredit: '', |
| | | activeTab: 'all', |
| | | // tabs 只保留静态结构,不做权限判断 |
| | | tabs: [ |
| | |
| | | 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: 'blur', |
| | | trigger: 'change' |
| | | }, |
| | | ], |
| | | photos: [ |
| | |
| | | } |
| | | }, |
| | | created () { |
| | | this.inputMapShowDefaultCenter = null |
| | | |
| | | this.loadAMapScripts() |
| | | this.fetchDropdownData() |
| | | console.log('permission.tickets_processing_btn', this.permission.tickets_processing_btn) |
| | |
| | | |
| | | mounted () { |
| | | const href = this.$route.href |
| | | if (this.$route?.query?.status !== undefined && this.$route?.query?.status !== null){ |
| | | if (this.$route?.query?.status !== undefined && this.$route?.query?.status !== null) { |
| | | this.filters.status = this.$route?.query?.status + '' |
| | | this.$router.replace({}) |
| | | } |
| | |
| | | |
| | | // 直接从返回对象中获取正确的路径 |
| | | const center = adcodeObj?.payload?.objects?.collection?.geometries?.[0]?.properties?.center |
| | | |
| | | if (Array.isArray(center) && center.length === 2) { |
| | | this.mapParams.center = center |
| | | this.inputMapShowDefaultCenter = center |
| | | } else { |
| | | // 如果找不到中心点,尝试使用 bbox 的中心点 |
| | | const bbox = adcodeObj?.payload?.bbox |
| | | if (Array.isArray(bbox) && bbox.length === 4) { |
| | | const centerX = (bbox[0] + bbox[2]) / 2 |
| | | const centerY = (bbox[1] + bbox[3]) / 2 |
| | | this.mapParams.center = [centerX, centerY] |
| | | this.inputMapShowDefaultCenter = [centerX, centerY] |
| | | } else { |
| | | this.mapParams.center = [115.861365, 28.621311] |
| | | this.inputMapShowDefaultCenter = [115.861365, 28.621311] |
| | | } |
| | | } |
| | | this.mapParams.center = [...this.inputMapShowDefaultCenter] |
| | | |
| | | this.mapLoaded = true |
| | | } catch (error) { |
| | |
| | | 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 = { |
| | |
| | | |
| | | // 草稿时也至少需要工单名称 |
| | | if (!submitData.eventName) { |
| | | this.$message.warning('请至少输入工单名称') |
| | | this.$message.warning('请输入工单名称') |
| | | return |
| | | } |
| | | |
| | |
| | | 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() |
| | | this.form = { |
| | | name: '', |
| | | type: '', |
| | | department: '', |
| | | handler: '', |
| | | algorithm: [], // 关联算法改为数组 |
| | | location: [], // 将存储为[经度, 纬度, 地址]格式 |
| | | address: '', |
| | | photos: [], |
| | | content: '', // 新增字段,用于存储后端返回的 content |
| | | }, |
| | | this.fetchTableData() |
| | | } else { |
| | | throw new Error(response.data.msg || '保存失败') |
| | | } |
| | |
| | | }, |
| | | |
| | | async handleCurrentChange (val) { |
| | | |
| | | |
| | | // 先更新页码 |
| | | this.page.currentPage = val |
| | | // 等待 DOM 更新后再请求数据 |
| | |
| | | }, |
| | | |
| | | async sizeChange (val) { |
| | | |
| | | this.page.pageSize = val |
| | | this.page.currentPage = 1 // 重置到第一页 |
| | | await this.$nextTick() |
| | |
| | | }, |
| | | |
| | | handleAdd () { |
| | | |
| | | this.createoredit =1 |
| | | this.createoredit = 1 |
| | | this.dialogVisible = true |
| | | this.mapParams.center = null |
| | | this.mapParams.center = [...this.inputMapShowDefaultCenter] |
| | | this.form.location = [] |
| | | }, |
| | | |
| | |
| | | this.stepInfos = [] |
| | | } |
| | | } |
| | | console.log(detailData,'detailDatadetailDatadetailData'); |
| | | console.log(detailData, 'detailDatadetailDatadetailData') |
| | | this.currentDetail = { |
| | | ...detailData, |
| | | address:null, |
| | | latAndLon: _.round(detailData.location[0],6) + ',' + _.round(detailData.location[1],6) |
| | | address: null, |
| | | 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.$nextTick(() => { |
| | | if (this.$refs.MapContainer && this.$refs.MapContainer.initAddEntity) { |
| | |
| | | |
| | | // 添加编辑方法 |
| | | handleEdit (row) { |
| | | this.createoredit = 2 |
| | | this.createoredit = 2 |
| | | console.log('编辑原始数据:', row) |
| | | |
| | | // 尝试从row.dept_id或通过部门名称查找对应的部门ID |
| | |
| | | address: row.address || '', |
| | | content: row.content, |
| | | photos: [], |
| | | |
| | | |
| | | } |
| | | |
| | | let curLocation = [] |
| | |
| | | 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 = null // 没有经纬度时用默认 |
| | | this.mapParams.center = [...this.inputMapShowDefaultCenter] |
| | | } |
| | | // 如果有图片,添加到表单中 |
| | | if (row.photo_url) { |
| | |
| | | |
| | | // 添加选择变化处理方法 |
| | | handleSelectionChange (selection) { |
| | | |
| | | this.selections = selection |
| | | console.log('已选择的行:', selection) |
| | | }, |
| | |
| | | * @param goWgs84 是否由国测转换到84,默认false----由84转换到国测 |
| | | */ |
| | | disposeLocation (goWgs84 = false, data) { |
| | | let lng, lat |
| | | if (goWgs84) { |
| | | lng = data.location?.[0] ? String(data.location[0]) : undefined |
| | | lat = data.location?.[1] ? String(data.location[1]) : undefined |
| | | let lng = '', lat = '' |
| | | |
| | | if (lng && lat) { |
| | | [lng, lat] = gcj02ToWgs84(Number(lng), Number(lat)) |
| | | } |
| | | } else { |
| | | lng = Number(data.location[0]) |
| | | lat = Number(data.location[1]) |
| | | if (Array.isArray(data.location) && data.location.length > 0) { |
| | | if (goWgs84) { |
| | | lng = data.location?.[0] ? String(data.location[0]) : undefined |
| | | lat = data.location?.[1] ? String(data.location[1]) : undefined |
| | | |
| | | if (lng && lat) { |
| | | [lng, lat] = wgs84ToGcj02(Number(lng), Number(lat)) |
| | | if (lng && lat) { |
| | | [lng, lat] = gcj02ToWgs84(Number(lng), Number(lat)) |
| | | } |
| | | } else { |
| | | lng = Number(data.location[0]) |
| | | lat = Number(data.location[1]) |
| | | |
| | | if (lng && lat) { |
| | | [lng, lat] = wgs84ToGcj02(Number(lng), Number(lat)) |
| | | } |
| | | } |
| | | } |
| | | |
| | |
| | | |
| | | .detail-container { |
| | | padding: 20px; |
| | | |
| | | .detail-top-title { |
| | | display: flex; |
| | | justify-content: center; |
| | | align-items: center; |
| | | .event-orderNumber{ |
| | | margin-right: 10px;} |
| | | display: flex; |
| | | justify-content: center; |
| | | align-items: center; |
| | | |
| | | .event-orderNumber { |
| | | margin-right: 10px; |
| | | } |
| | | } |
| | | } |
| | | |