| | |
| | | <div class="tab-content"> |
| | | <!-- 查询条件筛选栏 --> |
| | | <div class="filter-bar"> |
| | | <el-input v-model="filters.keyword" placeholder="请输入关键字" class="filter-item" clearable |
| | | <el-input v-model="filters.keyword" placeholder="请输入关键字" class="filter-item" clearable |
| | | @keyup.enter="handleSearch" /> |
| | | <el-select v-model="filters.department" placeholder="请选择所属单位" class="filter-item" clearable> |
| | | <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> |
| | | <el-select v-model="filters.type" placeholder="请选择工单类型" class="filter-item" clearable> |
| | | <el-option v-for="item in types" :key="item.value" :label="item.label" :value="item.value" /> |
| | | </el-select> |
| | | <el-date-picker v-model="filters.dateRange" type="daterange" class="filter-item" |
| | | range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"> |
| | | <el-date-picker v-model="filters.dateRange" type="daterange" class="filter-item" range-separator="至" |
| | | start-placeholder="开始日期" end-placeholder="结束日期"> |
| | | </el-date-picker> |
| | | <el-select v-model="filters.status" placeholder="请选择状态" class="filter-item" clearable> |
| | | <el-select v-model="filters.status" placeholder="请选择状态" class="filter-item" clearable> |
| | | <el-option v-for="item in statuses" :key="item.value" :label="item.label" :value="item.value" /> |
| | | </el-select> |
| | | <el-select v-model="filters.algorithm" placeholder="请选择关联算法" class="filter-item" clearable> |
| | | <el-select v-model="filters.algorithm" placeholder="请选择关联算法" class="filter-item" clearable> |
| | | <el-option v-for="item in algorithms" :key="item.dict_key" :label="item.dict_value" |
| | | :value="item.dict_key" /> |
| | | </el-select> |
| | | <el-button type="primary" icon="el-icon-search" @click="handleSearch">查询</el-button> |
| | | <el-button icon="el-icon-refresh" @click="handleReset">重置</el-button> |
| | | <el-button type="primary" icon="el-icon-search" @click="handleSearch">查询</el-button> |
| | | <el-button icon="el-icon-refresh" @click="handleReset">重置</el-button> |
| | | </div> |
| | | |
| | | <!-- 表格部分 --> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import { getList, createTicket, getTicketInfo, flowEvent, getstatusCount, getStepInfo } from '@/api/tickets/ticket'; |
| | | import { export_json_to_excel } from '@/utils/exportExcel'; |
| | | import { getList, createTicket, getTicketInfo, flowEvent, getstatusCount, getStepInfo } from '@/api/tickets/ticket' |
| | | import { export_json_to_excel } from '@/utils/exportExcel' |
| | | import geoJson from '@/assets/geoJson.json' |
| | | |
| | | import { mapGetters } from 'vuex' |
| | | import { getAdcodeObj } from '@/utils/disposeData' |
| | | export default { |
| | | name: "TicketPage", |
| | | data() { |
| | | data () { |
| | | return { |
| | | submitLoading: false, // 新增loading状态 |
| | | draftLoading: false, |
| | |
| | | location: [{ |
| | | validator: (rule, value, callback) => { |
| | | if (!value || value.length < 2) { |
| | | callback(new Error('请选择位置信息')); |
| | | callback(new Error('请选择位置信息')) |
| | | } else { |
| | | callback(); |
| | | callback() |
| | | } |
| | | }, |
| | | trigger: 'change' |
| | |
| | | photos: [{ |
| | | validator: (rule, value, callback) => { |
| | | if (!this.form.photos || this.form.photos.length === 0) { |
| | | callback(new Error('请上传工单图片')); |
| | | callback(new Error('请上传工单图片')) |
| | | } else { |
| | | callback(); |
| | | callback() |
| | | } |
| | | }, |
| | | trigger: 'change' |
| | |
| | | currentImageIndex: 1, // 新增:当前图片索引 |
| | | totalTime: '', |
| | | isShowInfo: false, |
| | | }; |
| | | }, |
| | | created() { |
| | | let orderNumber = new URLSearchParams(window.location.search).get('orderNumber'); |
| | | if (orderNumber) { |
| | | this.filters.keyword = orderNumber; |
| | | this.isShowInfo = true; |
| | | } |
| | | this.loadAMapScripts(); |
| | | this.fetchDropdownData(); |
| | | this.fetchTabCounts(); // 新增:初始化时获取 tab 数据 |
| | | console.log('permission.tickets_processing_btn', this.permission.tickets_processing_btn); |
| | | console.log('permission', this.permission.tickets_tab_pending); |
| | | }, |
| | | mounted() { |
| | | this.fetchTableData(); |
| | | created () { |
| | | let orderNumber = new URLSearchParams(window.location.search).get('orderNumber') |
| | | if (orderNumber) { |
| | | this.filters.keyword = orderNumber |
| | | this.isShowInfo = true |
| | | } |
| | | this.loadAMapScripts() |
| | | this.fetchDropdownData() |
| | | this.fetchTabCounts() // 新增:初始化时获取 tab 数据 |
| | | console.log('permission.tickets_processing_btn', this.permission.tickets_processing_btn) |
| | | console.log('permission', this.permission.tickets_tab_pending) |
| | | }, |
| | | mounted () { |
| | | this.fetchTableData() |
| | | }, |
| | | computed: { |
| | | firstRowData() { |
| | | return this.tableData.length > 0 ? this.tableData[0] : null; |
| | | firstRowData () { |
| | | return this.tableData.length > 0 ? this.tableData[0] : null |
| | | }, |
| | | availableHandlers() { |
| | | return this.form.department ? (this.departmentUsers[this.form.department] || []) : []; |
| | | availableHandlers () { |
| | | return this.form.department ? (this.departmentUsers[this.form.department] || []) : [] |
| | | }, |
| | | availableDispatchHandlers() { |
| | | return this.dispatchForm.department ? (this.departmentUsers[this.dispatchForm.department] || []) : []; |
| | | availableDispatchHandlers () { |
| | | return this.dispatchForm.department ? (this.departmentUsers[this.dispatchForm.department] || []) : [] |
| | | }, |
| | | detailTableData() { |
| | | detailTableData () { |
| | | return [ |
| | | { |
| | | label: "工单名称", |
| | |
| | | editable: this.currentDetail.status === 0, |
| | | type: "textarea", |
| | | }, |
| | | ]; |
| | | ] |
| | | }, |
| | | detailFields() { |
| | | 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.department, editable: false }, |
| | | { label: "发起任务时间", value: this.currentDetail.startTime, editable: false }, |
| | | { label: "工单内容", value: this.currentDetail.content, editable: this.currentDetail.status === 0, type: "textarea" }, |
| | | ]; |
| | | ] |
| | | }, |
| | | formattedDetailFields() { |
| | | formattedDetailFields () { |
| | | const fields = [ |
| | | { label: "工单名称", value: this.currentDetail.orderName }, |
| | | { label: "工单类型", value: this.currentDetail.type }, |
| | |
| | | { label: "发起单位", value: this.currentDetail.department }, |
| | | { label: "发起任务时间", value: this.currentDetail.startTime }, |
| | | { label: "工单内容", value: this.currentDetail.content }, |
| | | ]; |
| | | ] |
| | | |
| | | // 将字段分成两列 |
| | | const formattedFields = []; |
| | | const formattedFields = [] |
| | | for (let i = 0; i < fields.length; i += 2) { |
| | | formattedFields.push({ |
| | | label1: fields[i]?.label || "", |
| | | value1: fields[i]?.value || "暂无数据", |
| | | label2: fields[i + 1]?.label || "", |
| | | value2: fields[i + 1]?.value || "暂无数据", |
| | | }); |
| | | }) |
| | | } |
| | | return formattedFields; |
| | | return formattedFields |
| | | }, |
| | | dynamicFixedStatuses() { |
| | | dynamicFixedStatuses () { |
| | | // 直接使用接口返回的 stepInfos |
| | | return this.stepInfos.map(step => String(step.status)); |
| | | return this.stepInfos.map(step => String(step.status)) |
| | | }, |
| | | ...mapGetters(['userInfo', 'permission']), |
| | | // 动态过滤tabs,保证isShow为true/false |
| | | filteredTabs() { |
| | | filteredTabs () { |
| | | // 统一处理权限,undefined视为false |
| | | const tabStatus = this.permission?.tickets_tab_status === true; |
| | | const tabPending = this.permission?.tickets_tab_pending === true; |
| | | const tabMyTickets = this.permission?.tickets_tab_mytickets === true; |
| | | const tabStatus = this.permission?.tickets_tab_status === true |
| | | const tabPending = this.permission?.tickets_tab_pending === true |
| | | const tabMyTickets = this.permission?.tickets_tab_mytickets === true |
| | | return this.tabs.map(tab => { |
| | | if (tab.name === 'all') { |
| | | return { ...tab, isShow: true }; |
| | | return { ...tab, isShow: true } |
| | | } |
| | | if (tab.name === 'pending') { |
| | | return { ...tab, isShow: tabPending }; |
| | | return { ...tab, isShow: tabPending } |
| | | } |
| | | if (['processing', 'inProgress', 'completed', 'closed'].includes(tab.name)) { |
| | | return { ...tab, isShow: tabStatus }; |
| | | return { ...tab, isShow: tabStatus } |
| | | } |
| | | if (tab.name === 'myTickets') { |
| | | return { ...tab, isShow: tabMyTickets }; |
| | | return { ...tab, isShow: tabMyTickets } |
| | | } |
| | | return { ...tab, isShow: false }; |
| | | }).filter(tab => tab.isShow); |
| | | return { ...tab, isShow: false } |
| | | }).filter(tab => tab.isShow) |
| | | }, |
| | | permissionList() { |
| | | permissionList () { |
| | | // 可根据实际后端权限key调整 |
| | | return { |
| | | addBtn: this.validData(this.permission.tickets_add, false), |
| | | delBtn: this.validData(this.permission.tickets_delete, false), |
| | | exportBtn: this.validData(this.permission.tickets_export, false,), |
| | | reviewBtn: this.validData(this.permission.tickets_review, false), |
| | | }; |
| | | } |
| | | }, |
| | | stepStatusList() { |
| | | stepStatusList () { |
| | | // “我发起的工单”tab用默认流程,其它tab用接口返回的stepInfos |
| | | if (this.activeTab === 'myTickets') { |
| | | if (this.workType === 1) { |
| | | return ["3", "4", "5"]; |
| | | return ["3", "4", "5"] |
| | | } |
| | | return this.fixedStatuses; |
| | | return this.fixedStatuses |
| | | } |
| | | // 其它tab直接用接口返回的stepInfos |
| | | return this.stepInfos.map(step => String(step.status)); |
| | | return this.stepInfos.map(step => String(step.status)) |
| | | }, |
| | | }, |
| | | methods: { |
| | | async loadAMapScripts() { |
| | | async loadAMapScripts () { |
| | | try { |
| | | const areaCode = this.userInfo.detail.areaCode; |
| | | const subAreaCode = areaCode ? areaCode.substring(0, 6) : ''; |
| | | const adcodeObj = getAdcodeObj(geoJson, 'adcode', subAreaCode); |
| | | const areaCode = this.userInfo.detail.areaCode |
| | | const subAreaCode = areaCode ? areaCode.substring(0, 6) : '' |
| | | const adcodeObj = getAdcodeObj(geoJson, 'adcode', subAreaCode) |
| | | |
| | | console.log('区域代码:', subAreaCode); |
| | | console.log('区域代码:', subAreaCode) |
| | | |
| | | // 直接从返回对象中获取正确的路径 |
| | | const center = adcodeObj?.payload?.objects?.collection?.geometries?.[0]?.properties?.center; |
| | | const center = adcodeObj?.payload?.objects?.collection?.geometries?.[0]?.properties?.center |
| | | if (Array.isArray(center) && center.length === 2) { |
| | | this.mapParams.center = center; |
| | | this.mapParams.center = center |
| | | } else { |
| | | // 如果找不到中心点,尝试使用 bbox 的中心点 |
| | | const bbox = adcodeObj?.payload?.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]; |
| | | const centerX = (bbox[0] + bbox[2]) / 2 |
| | | const centerY = (bbox[1] + bbox[3]) / 2 |
| | | this.mapParams.center = [centerX, centerY] |
| | | } else { |
| | | this.mapParams.center = [115.861365, 28.621311]; |
| | | this.mapParams.center = [115.861365, 28.621311] |
| | | } |
| | | } |
| | | |
| | | this.mapLoaded = true; |
| | | this.mapLoaded = true |
| | | } catch (error) { |
| | | this.$message.error('地图加载失败,请检查网络或API Key配置'); |
| | | this.$message.error('地图加载失败,请检查网络或API Key配置') |
| | | } |
| | | }, |
| | | async handleBatchApprove() { |
| | | async handleBatchApprove () { |
| | | try { |
| | | if (this.selections.length === 0) { |
| | | this.$message.warning('没有选中的工单'); |
| | | return; |
| | | this.$message.warning('没有选中的工单') |
| | | return |
| | | } |
| | | |
| | | const currentItem = this.selections[this.currentImageIndex - 1]; |
| | | const currentItem = this.selections[this.currentImageIndex - 1] |
| | | if (!currentItem) { |
| | | this.$message.warning('当前工单数据无效'); |
| | | return; |
| | | this.$message.warning('当前工单数据无效') |
| | | return |
| | | } |
| | | |
| | | await this.$confirm('确认审核通过当前工单?', '提示', { |
| | | confirmButtonText: '确定', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }); |
| | | }) |
| | | |
| | | const data = { |
| | | id: currentItem.id, |
| | |
| | | isPass: 0, |
| | | eventNum: currentItem.orderNumber, |
| | | eventName: currentItem.orderName, |
| | | }; |
| | | } |
| | | |
| | | const response = await flowEvent(data); |
| | | const response = await flowEvent(data) |
| | | if (response.data.code === 0) { |
| | | this.$message.success('工单审核通过'); |
| | | this.$message.success('工单审核通过') |
| | | |
| | | // 创建新的数组而不是修改原数组 |
| | | const newSelections = [...this.selections]; |
| | | newSelections.splice(this.currentImageIndex - 1, 1); |
| | | this.selections = newSelections; |
| | | 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.currentImageIndex = this.selections.length |
| | | } |
| | | this.updateCurrentReviewImage(); |
| | | this.updateCurrentReviewImage() |
| | | } else { |
| | | this.reviewDialogVisible = false; |
| | | this.currentImageIndex = 1; |
| | | this.currentReviewImage = ''; |
| | | this.reviewDialogVisible = false |
| | | this.currentImageIndex = 1 |
| | | this.currentReviewImage = '' |
| | | } |
| | | |
| | | // 刷新表格数据 |
| | | this.fetchTableData(); |
| | | this.fetchTableData() |
| | | } else { |
| | | throw new Error(response.data.msg || '审核失败'); |
| | | throw new Error(response.data.msg || '审核失败') |
| | | } |
| | | } catch (error) { |
| | | if (error === 'cancel') return; |
| | | this.$message.error(error.message || '审核失败,请稍后重试'); |
| | | if (error === 'cancel') return |
| | | this.$message.error(error.message || '审核失败,请稍后重试') |
| | | } |
| | | }, |
| | | async fetchDropdownData() { |
| | | async fetchDropdownData () { |
| | | try { |
| | | const response = await getTicketInfo(); |
| | | const { dept_data, event_type, ai_type } = response.data.data; |
| | | const response = await getTicketInfo() |
| | | const { dept_data, event_type, ai_type } = response.data.data |
| | | |
| | | this.departments = dept_data.map(item => ({ |
| | | label: item.dept_name, |
| | | value: item.id, |
| | | })); |
| | | })) |
| | | |
| | | this.departmentUsers = dept_data.reduce((acc, dept) => { |
| | | acc[dept.id] = dept.user_data || []; |
| | | return acc; |
| | | }, {}); |
| | | acc[dept.id] = dept.user_data || [] |
| | | return acc |
| | | }, {}) |
| | | |
| | | this.types = Object.entries(event_type).map(([key, value]) => ({ |
| | | label: value, |
| | | value: key, |
| | | })); |
| | | })) |
| | | |
| | | // 确保算法数据的映射一致 |
| | | this.algorithms = ai_type.map(item => ({ |
| | |
| | | // 同时添加 label 和 value 以兼容两处使用 |
| | | label: item.dict_value, |
| | | value: item.dict_key |
| | | })); |
| | | })) |
| | | |
| | | // 构建用户ID和名称的映射关系 |
| | | this.userNameToIdMap = {}; |
| | | this.userNameToIdMap = {} |
| | | dept_data.forEach(dept => { |
| | | (dept.user_data || []).forEach(user => { |
| | | this.userNameToIdMap[user.name] = user.id; |
| | | }); |
| | | }); |
| | | this.userNameToIdMap[user.name] = user.id |
| | | }) |
| | | }) |
| | | } catch (error) { |
| | | this.$message.error('加载下拉框数据失败'); |
| | | this.$message.error('加载下拉框数据失败') |
| | | } |
| | | }, |
| | | |
| | | async fetchTableData() { |
| | | if (this.isFetching) return; |
| | | this.isFetching = true; |
| | | this.loading = true; |
| | | async fetchTableData () { |
| | | if (this.isFetching) return |
| | | this.isFetching = true |
| | | this.loading = true |
| | | try { |
| | | const currentTab = this.tabs.find(tab => tab.name === this.activeTab); |
| | | const currentTab = this.tabs.find(tab => tab.name === this.activeTab) |
| | | const params = { |
| | | word_order_type: this.filters.type || undefined, |
| | | status: currentTab?.name === 'myTickets' ? undefined : |
| | |
| | | is_draft: currentTab?.name === 'myTickets' ? 1 : undefined, |
| | | |
| | | user_id: currentTab?.name === 'myTickets' ? this.userInfo.user_id : undefined, |
| | | }; |
| | | |
| | | const response = await getList(params); |
| | | if (!response?.data?.data?.records) { |
| | | throw new Error('接口返回数据格式不正确'); |
| | | } |
| | | |
| | | const { total, records } = response.data.data; |
| | | let filteredRecords = records; |
| | | const response = await getList(params) |
| | | if (!response?.data?.data?.records) { |
| | | throw new Error('接口返回数据格式不正确') |
| | | } |
| | | |
| | | const { total, records } = response.data.data |
| | | let filteredRecords = records |
| | | |
| | | // 如果是"我发起的"tab,过滤数据 |
| | | // if (currentTab?.name === 'myTickets') { |
| | |
| | | // } |
| | | |
| | | this.tableData = filteredRecords.map(item => { |
| | | const longitude = Number(item.longitude) || 0; |
| | | const latitude = Number(item.latitude) || 0; |
| | | const longitude = Number(item.longitude) || 0 |
| | | const latitude = Number(item.latitude) || 0 |
| | | return { |
| | | id: item.id, |
| | | orderNumber: item.event_num, // 修改这里:优先使用 event_num |
| | |
| | | work_type: item.work_type !== undefined ? Number(item.work_type) : 0, // 保留work_type字段并转为数字 |
| | | job_name: item.job_name || '', |
| | | job_create_time: item.job_create_time || '', |
| | | }; |
| | | }); |
| | | } |
| | | }) |
| | | |
| | | // 更新总数显示 |
| | | this.page.total = total || 0; |
| | | this.page.total = total || 0 |
| | | |
| | | // 是否弹出详情页 |
| | | if (this.isShowInfo) { |
| | | this.handleViewDetail(this.firstRowData) |
| | | this.isShowInfo = false; // 生效一次 |
| | | this.isShowInfo = false // 生效一次 |
| | | } |
| | | await this.fetchTabCounts(); |
| | | await this.fetchTabCounts() |
| | | } catch (error) { |
| | | this.$message.error(error.message || "获取数据失败"); |
| | | this.tableData = []; |
| | | this.page.total = 0; |
| | | this.$message.error(error.message || "获取数据失败") |
| | | this.tableData = [] |
| | | this.page.total = 0 |
| | | } finally { |
| | | this.loading = false; |
| | | this.isFetching = false; |
| | | this.loading = false |
| | | this.isFetching = false |
| | | } |
| | | }, |
| | | |
| | | async submitForm() { |
| | | if (this.submitLoading) return; // 防止重复提交 |
| | | this.submitLoading = true; |
| | | async submitForm () { |
| | | if (this.submitLoading) return // 防止重复提交 |
| | | this.submitLoading = true |
| | | try { |
| | | // 提交时需要完整验证 |
| | | await this.$refs.form.validate(); |
| | | await this.$refs.form.validate() |
| | | |
| | | // 验证位置信息 |
| | | if (!this.form.location || this.form.location.length < 2) { |
| | | this.$message.warning('请在地图上选择位置'); |
| | | return; |
| | | this.$message.warning('请在地图上选择位置') |
| | | return |
| | | } |
| | | |
| | | // 验证图片上传 |
| | | if (!this.form.photos || this.form.photos.length === 0) { |
| | | this.$message.warning('请上传工单图片'); |
| | | return; |
| | | this.$message.warning('请上传工单图片') |
| | | return |
| | | } |
| | | |
| | | const submitData = { |
| | |
| | | updateUser: this.form.handler, |
| | | createDept: this.form.department, |
| | | isDraft: 0 |
| | | }; |
| | | } |
| | | |
| | | if (this.form.id) { |
| | | submitData.id = this.form.id; |
| | | submitData.id = this.form.id |
| | | } |
| | | |
| | | // 获取文件对象 |
| | | const file = this.form.photos[0].raw; |
| | | const file = this.form.photos[0].raw |
| | | if (!file) { |
| | | this.$message.warning('图片文件无效,请重新上传'); |
| | | return; |
| | | this.$message.warning('图片文件无效,请重新上传') |
| | | return |
| | | } |
| | | |
| | | const response = await createTicket(submitData, file); |
| | | const response = await createTicket(submitData, file) |
| | | if (response.data.code === 0) { |
| | | this.$message.success('工单创建成功'); |
| | | this.dialogVisible = false; |
| | | this.fetchTableData(); |
| | | this.$message.success('工单创建成功') |
| | | this.dialogVisible = false |
| | | this.fetchTableData() |
| | | } else { |
| | | throw new Error(response.data.msg || '创建失败'); |
| | | throw new Error(response.data.msg || '创建失败') |
| | | } |
| | | } catch (error) { |
| | | if (error.message.includes('验证未通过')) { |
| | | this.$message.warning('请填写完整的工单信息'); |
| | | this.$message.warning('请填写完整的工单信息') |
| | | } else { |
| | | this.$message.error(error.message || '工单创建失败,请稍后重试'); |
| | | this.$message.error(error.message || '工单创建失败,请稍后重试') |
| | | } |
| | | } |
| | | finally { |
| | | this.submitLoading = false; |
| | | this.submitLoading = false |
| | | } |
| | | }, |
| | | |
| | | async saveDraft() { |
| | | if (this.draftLoading) return; // 防止重复提交 |
| | | this.draftLoading = true; |
| | | async saveDraft () { |
| | | if (this.draftLoading) return // 防止重复提交 |
| | | this.draftLoading = true |
| | | try { |
| | | let handlerValue = this.form.handler; |
| | | let handlerValue = this.form.handler |
| | | if (!handlerValue || handlerValue === '未分配') { |
| | | handlerValue = undefined; |
| | | handlerValue = undefined |
| | | } |
| | | const submitData = { |
| | | id: this.form.id, |
| | |
| | | updateUser: handlerValue, |
| | | createDept: this.form.department || undefined, |
| | | isDraft: 1 |
| | | }; |
| | | } |
| | | |
| | | // 草稿时也至少需要工单名称 |
| | | if (!submitData.eventName) { |
| | | this.$message.warning('请至少输入工单名称'); |
| | | return; |
| | | this.$message.warning('请至少输入工单名称') |
| | | return |
| | | } |
| | | |
| | | // 过滤掉所有 undefined 的字段 |
| | | Object.keys(submitData).forEach(key => |
| | | submitData[key] === undefined && delete submitData[key] |
| | | ); |
| | | ) |
| | | |
| | | let file = null; |
| | | let file = null |
| | | if (this.form.photos && this.form.photos.length > 0) { |
| | | file = this.form.photos[0].raw; |
| | | file = this.form.photos[0].raw |
| | | } |
| | | |
| | | const response = await createTicket(submitData, file); |
| | | const response = await createTicket(submitData, file) |
| | | if (response.data.code === 0) { |
| | | this.$message.success('草稿保存成功'); |
| | | this.dialogVisible = false; |
| | | this.fetchTableData(); |
| | | this.$message.success('草稿保存成功') |
| | | this.dialogVisible = false |
| | | this.fetchTableData() |
| | | } else { |
| | | throw new Error(response.data.msg || '保存失败'); |
| | | throw new Error(response.data.msg || '保存失败') |
| | | } |
| | | } catch (error) { |
| | | this.$message.error(error.message || '保存草稿失败,请稍后重试'); |
| | | this.$message.error(error.message || '保存草稿失败,请稍后重试') |
| | | } |
| | | finally { |
| | | this.draftLoading = false; |
| | | this.draftLoading = false |
| | | } |
| | | }, |
| | | |
| | | handleLocationChange(val) { |
| | | let locationValue = val.value; |
| | | handleLocationChange (val) { |
| | | let locationValue = val.value |
| | | if (locationValue && locationValue.length >= 2) { |
| | | // 兼容第三项为地址 |
| | | this.form.location = [ |
| | | Number(locationValue[0]), |
| | | Number(locationValue[1]), |
| | | locationValue[2] || '' |
| | | ]; |
| | | this.form.address = locationValue[2] || ''; |
| | | ] |
| | | this.form.address = locationValue[2] || '' |
| | | } else { |
| | | this.form.location = []; |
| | | this.form.address = ''; |
| | | this.form.location = [] |
| | | this.form.address = '' |
| | | } |
| | | }, |
| | | |
| | | formatDate(date) { |
| | | if (!date) return undefined; |
| | | const d = new Date(date); |
| | | return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')} 00:00:00`; |
| | | formatDate (date) { |
| | | if (!date) return undefined |
| | | const d = new Date(date) |
| | | return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')} 00:00:00` |
| | | }, |
| | | |
| | | mapStatus(status) { |
| | | mapStatus (status) { |
| | | const statusTextMap = { |
| | | "-1": "草稿", // 添加草稿状态 |
| | | "2": "待审核", |
| | |
| | | "3": "处理中", |
| | | "4": "已完成", |
| | | "5": "已完结" |
| | | }; |
| | | return statusTextMap[status] || "未知状态"; |
| | | } |
| | | return statusTextMap[status] || "未知状态" |
| | | }, |
| | | |
| | | getStatusTagType(status) { |
| | | getStatusTagType (status) { |
| | | // 草稿不加颜色 |
| | | if (status === -1 || status === "-1") return ''; |
| | | if (status === -1 || status === "-1") return '' |
| | | // 状态颜色映射 |
| | | const colorMap = { |
| | | "0": "#ffb6b6", // 待处理-淡红 |
| | |
| | | "2": "#faad14", // 待审核-橙色 |
| | | "4": "#a0cfff", // 已完成-淡蓝 |
| | | "5": "#67c23a", // 已完结-绿色 |
| | | }; |
| | | return colorMap[String(status)] || ''; |
| | | } |
| | | return colorMap[String(status)] || '' |
| | | }, |
| | | |
| | | async fetchTabCounts() { |
| | | async fetchTabCounts () { |
| | | try { |
| | | // 判断是否有部门筛选 |
| | | let params = {}; |
| | | let params = {} |
| | | if (this.filters.department) { |
| | | params.deptId = this.filters.department; |
| | | params.deptId = this.filters.department |
| | | } |
| | | const response = await getstatusCount(params); |
| | | const { statusCount, totalCount, userCount } = response.data.data; |
| | | const response = await getstatusCount(params) |
| | | const { statusCount, totalCount, userCount } = response.data.data |
| | | this.tabs.forEach(tab => { |
| | | if (tab.name === 'all') { |
| | | tab.count = totalCount || 0; // 总工单数 |
| | | tab.count = totalCount || 0 // 总工单数 |
| | | } else if (tab.name === 'myTickets') { |
| | | tab.count = userCount || 0; // 我发起的工单数 |
| | | tab.count = userCount || 0 // 我发起的工单数 |
| | | } else { |
| | | tab.count = statusCount[String(tab.value)] || 0; // 根据状态值映射 |
| | | tab.count = statusCount[String(tab.value)] || 0 // 根据状态值映射 |
| | | } |
| | | }); |
| | | }) |
| | | } catch (error) { |
| | | this.$message.error('获取 tab 数据失败'); |
| | | this.$message.error('获取 tab 数据失败') |
| | | } |
| | | }, |
| | | |
| | | handleTabChange(tab) { |
| | | this.activeTab = tab.props?.name || tab.name; |
| | | this.handleReset(); |
| | | this.page.currentPage = 1; |
| | | this.fetchTableData(); |
| | | this.fetchTabCounts(); // 切换 tab 时重新获取数据 |
| | | handleTabChange (tab) { |
| | | this.activeTab = tab.props?.name || tab.name |
| | | this.handleReset() |
| | | this.page.currentPage = 1 |
| | | this.fetchTableData() |
| | | this.fetchTabCounts() // 切换 tab 时重新获取数据 |
| | | }, |
| | | |
| | | handleSearch() { |
| | | this.page.currentPage = 1; |
| | | this.fetchTableData(); |
| | | this.fetchTabCounts(); |
| | | handleSearch () { |
| | | this.page.currentPage = 1 |
| | | this.fetchTableData() |
| | | this.fetchTabCounts() |
| | | }, |
| | | |
| | | handleReset() { |
| | | handleReset () { |
| | | this.filters = { |
| | | keyword: "", |
| | | department: "", |
| | |
| | | dateRange: [], |
| | | status: "", |
| | | algorithm: "", // 重置时清空算法筛选 |
| | | }; |
| | | this.page.currentPage = 1; |
| | | this.fetchTableData(); |
| | | } |
| | | this.page.currentPage = 1 |
| | | this.fetchTableData() |
| | | }, |
| | | |
| | | async handleCurrentChange(val) { |
| | | async handleCurrentChange (val) { |
| | | // 先更新页码 |
| | | this.page.currentPage = val; |
| | | this.page.currentPage = val |
| | | // 等待 DOM 更新后再请求数据 |
| | | await this.$nextTick(); |
| | | await this.fetchTableData(); |
| | | await this.$nextTick() |
| | | await this.fetchTableData() |
| | | }, |
| | | |
| | | async sizeChange(val) { |
| | | this.page.pageSize = val; |
| | | this.page.currentPage = 1; // 重置到第一页 |
| | | await this.$nextTick(); |
| | | await this.fetchTableData(); |
| | | async sizeChange (val) { |
| | | this.page.pageSize = val |
| | | this.page.currentPage = 1 // 重置到第一页 |
| | | await this.$nextTick() |
| | | await this.fetchTableData() |
| | | }, |
| | | |
| | | handleAdd() { |
| | | this.dialogVisible = true; |
| | | handleAdd () { |
| | | this.dialogVisible = true |
| | | }, |
| | | |
| | | resetForm() { |
| | | resetForm () { |
| | | this.form = { |
| | | name: '', |
| | | type: '', |
| | |
| | | content: '', |
| | | photos: [], |
| | | content: '', // 新增字段,用于存储后端返回的 content |
| | | }; |
| | | } |
| | | if (this.$refs.form) { |
| | | this.$refs.form.resetFields(); |
| | | this.$refs.form.resetFields() |
| | | } |
| | | }, |
| | | |
| | | formatLocation(location) { |
| | | formatLocation (location) { |
| | | if (!Array.isArray(location)) { |
| | | return '未知位置'; |
| | | return '未知位置' |
| | | } |
| | | return `${location[0].toFixed(6)}, ${location[1].toFixed(6)}`; |
| | | return `${location[0].toFixed(6)}, ${location[1].toFixed(6)}` |
| | | }, |
| | | |
| | | async handleViewDetail(row) { |
| | | async handleViewDetail (row) { |
| | | |
| | | // 先设置workType,直接从row读取 |
| | | this.workType = row.work_type !== undefined ? Number(row.work_type) : 0; |
| | | 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); |
| | | this.$refs.MapContainer.initAddEntity('point', this.currentDetail.location) |
| | | } |
| | | }); |
| | | }) |
| | | |
| | | const detailData = { |
| | | ...row, |
| | |
| | | updatePhotoUrl: row.update_photo_url || '', |
| | | photos: [], |
| | | job_name: row.job_name || '', // 新增 |
| | | }; |
| | | } |
| | | |
| | | let stepArr = []; |
| | | let stepArr = [] |
| | | try { |
| | | const stepResponse = await getStepInfo(row.orderNumber); |
| | | 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) === '5'); |
| | | this.totalTime = finishedStep && finishedStep.total_time ? finishedStep.total_time : ''; |
| | | : stepResponse.data.data?.steps || [] |
| | | const finishedStep = steps.find(s => String(s.status) === '5') |
| | | 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", "5"] : this.fixedStatuses; |
| | | const statusArr = this.workType === 1 ? ["3", "4", "5"] : this.fixedStatuses |
| | | this.stepInfos = statusArr.map(status => { |
| | | const step = steps.find(s => String(s.status) === String(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; |
| | | this.currentDetail.status = row.status |
| | | } catch (error) { |
| | | if (this.activeTab === 'myTickets') { |
| | | const statusArr = this.workType === 1 ? ["3", "4", "5"] : this.fixedStatuses; |
| | | const statusArr = this.workType === 1 ? ["3", "4", "5"] : this.fixedStatuses |
| | | this.stepInfos = statusArr.map(status => ({ |
| | | status, |
| | | name: status === row.status ? row.handler || '未分配' : '未处理', |
| | | time: status === row.status ? row.startTime || '未知时间' : null, |
| | | })); |
| | | })) |
| | | } else { |
| | | this.stepInfos = []; |
| | | this.stepInfos = [] |
| | | } |
| | | } |
| | | |
| | | this.currentDetail = detailData; |
| | | this.detailVisible = true; |
| | | this.currentDetail = detailData |
| | | this.detailVisible = true |
| | | this.$nextTick(() => { |
| | | if (this.$refs.MapContainer && this.$refs.MapContainer.initAddEntity) { |
| | | this.$refs.MapContainer.initAddEntity('point', this.currentDetail.location); |
| | | this.$refs.MapContainer.initAddEntity('point', this.currentDetail.location) |
| | | } |
| | | }); |
| | | }) |
| | | }, |
| | | |
| | | getStepHandler(status) { |
| | | const step = this.stepInfos.find(step => step.status === status); |
| | | return step ? step.name : ''; |
| | | 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); |
| | | 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; |
| | | 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; |
| | | getStepCreateTime (status) { |
| | | const step = this.stepInfos.find(step => step.status === status) |
| | | return step ? step.create_time : null |
| | | }, |
| | | getActiveStep() { |
| | | getActiveStep () { |
| | | // 步骤索引适配 |
| | | const arr = this.stepStatusList; |
| | | const index = arr.indexOf(String(this.currentDetail.status)); |
| | | return index !== -1 ? index + 2 : 1; |
| | | 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("地图选址功能暂未实现"); |
| | | 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}`); |
| | | handlePreview (file) { |
| | | this.$message.info(`预览图片:${file.name}`) |
| | | }, |
| | | |
| | | handleRemove(file) { |
| | | this.$message.info(`移除图片:${file.name}`); |
| | | handleRemove (file) { |
| | | this.$message.info(`移除图片:${file.name}`) |
| | | }, |
| | | |
| | | refreshChange() { |
| | | if (this.isFetching) return; |
| | | this.fetchTableData(); |
| | | refreshChange () { |
| | | if (this.isFetching) return |
| | | this.fetchTableData() |
| | | }, |
| | | |
| | | onLoad() { |
| | | if (this.isFetching) return; |
| | | this.fetchTableData(); |
| | | onLoad () { |
| | | if (this.isFetching) return |
| | | this.fetchTableData() |
| | | }, |
| | | |
| | | async exportData() { |
| | | async exportData () { |
| | | // 修改导出方法,添加选中数据的处理 |
| | | try { |
| | | this.loading = true; |
| | | this.loading = true |
| | | |
| | | // 如果有选中的数据,则只导出选中的数据 |
| | | let exportData = []; |
| | | let exportData = [] |
| | | if (this.selections.length > 0) { |
| | | exportData = this.selections.map(item => ({ |
| | | 工单编号: item.orderNumber || '', |
| | |
| | | 创建人: item.creator || '', |
| | | 处理人: item.handler || '', |
| | | 工单状态: this.mapStatus(item.status) |
| | | })); |
| | | })) |
| | | } else { |
| | | // 原有的导出全部数据的逻辑 |
| | | const currentTab = this.tabs.find(tab => tab.name === this.activeTab); |
| | | const currentTab = this.tabs.find(tab => tab.name === this.activeTab) |
| | | |
| | | // 使用与查询列表相同的参数构造逻辑 |
| | | const params = { |
| | |
| | | end_date: this.filters.dateRange?.[1] ? this.formatDate(this.filters.dateRange[1]) : undefined, |
| | | current: 1, |
| | | size: 10 |
| | | }; |
| | | |
| | | const response = await getList(params); |
| | | if (!response?.data?.data?.records) { |
| | | throw new Error('接口返回数据格式不正确'); |
| | | } |
| | | |
| | | const { records } = response.data.data; |
| | | const response = await getList(params) |
| | | if (!response?.data?.data?.records) { |
| | | throw new Error('接口返回数据格式不正确') |
| | | } |
| | | |
| | | const { records } = response.data.data |
| | | |
| | | // 使用与查询列表相同的过滤逻辑 |
| | | let filteredRecords = records; |
| | | let filteredRecords = records |
| | | if (currentTab?.name === 'myTickets') { |
| | | filteredRecords = records.filter(item => |
| | | String(item.create_user_id) === String(item.user_id) |
| | | ); |
| | | ) |
| | | } |
| | | |
| | | exportData = filteredRecords.map(item => { |
| | | const longitude = Number(item.longitude) || 0; |
| | | const latitude = Number(item.latitude) || 0; |
| | | const longitude = Number(item.longitude) || 0 |
| | | const latitude = Number(item.latitude) || 0 |
| | | return { |
| | | 工单编号: item.event_num || '', |
| | | 工单名称: item.event_name || '', |
| | |
| | | 创建人: item.create_user || '', |
| | | 处理人: item.update_user || '', |
| | | 工单状态: this.mapStatus(Number(item.status || 0)) |
| | | }; |
| | | }); |
| | | } |
| | | }) |
| | | } |
| | | |
| | | if (exportData.length === 0) { |
| | | this.$message.warning('没有数据可供导出'); |
| | | return; |
| | | this.$message.warning('没有数据可供导出') |
| | | return |
| | | } |
| | | |
| | | const headers = [ |
| | |
| | | '创建人', |
| | | '处理人', |
| | | '工单状态' |
| | | ]; |
| | | ] |
| | | |
| | | export_json_to_excel(headers, exportData, '工单数据'); |
| | | this.$message.success('数据导出成功'); |
| | | export_json_to_excel(headers, exportData, '工单数据') |
| | | this.$message.success('数据导出成功') |
| | | } catch (error) { |
| | | this.$message.error(error.message || '导出失败,请稍后重试'); |
| | | this.$message.error(error.message || '导出失败,请稍后重试') |
| | | } finally { |
| | | this.loading = false; |
| | | this.loading = false |
| | | } |
| | | }, |
| | | |
| | | handleDepartmentChange(deptId) { |
| | | this.form.handler = ''; |
| | | handleDepartmentChange (deptId) { |
| | | this.form.handler = '' |
| | | }, |
| | | |
| | | handleDispatchDepartmentChange(deptId) { |
| | | this.dispatchForm.handler = ''; // 清空处理人选择 |
| | | handleDispatchDepartmentChange (deptId) { |
| | | this.dispatchForm.handler = '' // 清空处理人选择 |
| | | }, |
| | | |
| | | // 文件改变时的钩子 |
| | | handleFileChange(file, fileList) { |
| | | this.form.photos = fileList; |
| | | this.currentDetail.photos = fileList; |
| | | handleFileChange (file, fileList) { |
| | | this.form.photos = fileList |
| | | this.currentDetail.photos = fileList |
| | | }, |
| | | |
| | | // 文件移除时的钩子 |
| | | handleUploadRemove(file, fileList) { |
| | | this.form.photos = fileList; |
| | | this.currentDetail.photos = fileList; |
| | | 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; |
| | | beforeUpload (file) { |
| | | const isImage = file.type.includes('image') |
| | | const isLt5M = file.size / 1024 / 1024 < 5 |
| | | |
| | | if (!isImage) { |
| | | this.$message.error('只能上传图片文件!'); |
| | | return false; |
| | | this.$message.error('只能上传图片文件!') |
| | | return false |
| | | } |
| | | if (!isLt5M) { |
| | | this.$message.error('图片大小不能超过5MB!'); |
| | | return false; |
| | | this.$message.error('图片大小不能超过5MB!') |
| | | return false |
| | | } |
| | | return true; |
| | | return true |
| | | }, |
| | | |
| | | async approveTicket() { |
| | | if (this.approveLoading) return; |
| | | this.approveLoading = 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 file = this.currentDetail.file || null // 如果没有文件,则为 null |
| | | |
| | | const response = await flowEvent(data, file); |
| | | const response = await flowEvent(data, file) |
| | | if (response.data.code === 0) { |
| | | this.$message.success('工单已通过'); |
| | | this.detailVisible = false; |
| | | this.fetchTableData(); |
| | | this.$message.success('工单已通过') |
| | | this.detailVisible = false |
| | | this.fetchTableData() |
| | | } else { |
| | | throw new Error(response.data.msg || '操作失败'); |
| | | throw new Error(response.data.msg || '操作失败') |
| | | } |
| | | } catch (error) { |
| | | this.$message.error(error.message || '操作失败,请稍后重试'); |
| | | this.$message.error(error.message || '操作失败,请稍后重试') |
| | | } finally { |
| | | this.approveLoading = false; |
| | | this.approveLoading = false |
| | | } |
| | | }, |
| | | async rejectTicket() { |
| | | if (this.rejectLoading) return; |
| | | this.rejectLoading = true; |
| | | 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); |
| | | const response = await flowEvent(data) |
| | | if (response.data.code === 0) { |
| | | this.$message.success('工单未通过'); |
| | | this.detailVisible = false; |
| | | this.fetchTableData(); |
| | | this.$message.success('工单未通过') |
| | | this.detailVisible = false |
| | | this.fetchTableData() |
| | | } else { |
| | | throw new Error(response.data.msg || '操作失败'); |
| | | throw new Error(response.data.msg || '操作失败') |
| | | } |
| | | } catch (error) { |
| | | this.$message.error(error.message || '操作失败,请稍后重试'); |
| | | this.$message.error(error.message || '操作失败,请稍后重试') |
| | | } finally { |
| | | this.rejectLoading = false; |
| | | this.rejectLoading = false |
| | | } |
| | | }, |
| | | async submitProcessing() { |
| | | async submitProcessing () { |
| | | if (this.currentDetail.status !== 3) { |
| | | this.$message.warning('只有处理中状态的工单可以提交处理详情'); |
| | | return; |
| | | this.$message.warning('只有处理中状态的工单可以提交处理详情') |
| | | return |
| | | |
| | | } |
| | | |
| | |
| | | id: this.currentDetail.id, // 当前工单 ID |
| | | status: this.currentDetail.status, // 当前工单状态 |
| | | processing_details: this.currentDetail.processingDetail, // 事件处理详情 |
| | | }; |
| | | } |
| | | |
| | | // 如果有图片,添加 file 参数 |
| | | const file = this.currentDetail.photos?.[0]?.raw || null; |
| | | const file = this.currentDetail.photos?.[0]?.raw || null |
| | | |
| | | const response = await flowEvent(data, file); |
| | | const response = await flowEvent(data, file) |
| | | if (response.data.code === 0) { |
| | | this.$message.success('处理详情提交成功'); |
| | | this.detailVisible = false; |
| | | this.fetchTableData(); |
| | | this.$message.success('处理详情提交成功') |
| | | this.detailVisible = false |
| | | this.fetchTableData() |
| | | } else { |
| | | throw new Error(response.data.msg || '提交失败'); |
| | | throw new Error(response.data.msg || '提交失败') |
| | | } |
| | | } catch (error) { |
| | | console.error('处理详情提交失败:', error); |
| | | this.$message.error(error.message || '提交失败,请稍后重试'); |
| | | console.error('处理详情提交失败:', error) |
| | | this.$message.error(error.message || '提交失败,请稍后重试') |
| | | } |
| | | }, |
| | | markAsCompleted() { |
| | | this.$message.success("工单已标记为完成"); |
| | | markAsCompleted () { |
| | | this.$message.success("工单已标记为完成") |
| | | }, |
| | | async completeTicket() { |
| | | if (this.completeLoading) return; |
| | | this.completeLoading = true; |
| | | async completeTicket () { |
| | | if (this.completeLoading) return |
| | | this.completeLoading = true |
| | | try { |
| | | if (!this.currentDetail.processingDetail) { |
| | | this.$message.warning('请先填写事件处理详情'); |
| | | return; |
| | | this.$message.warning('请先填写事件处理详情') |
| | | return |
| | | } |
| | | |
| | | const data = { |
| | |
| | | status: this.currentDetail.status, |
| | | processingDetails: this.currentDetail.processingDetail, |
| | | eventNum: this.currentDetail.orderNumber |
| | | }; |
| | | } |
| | | |
| | | // 如果有上传的图片,添加到请求中 |
| | | const file = this.currentDetail.photos?.[0]?.raw || null; |
| | | const file = this.currentDetail.photos?.[0]?.raw || null |
| | | |
| | | const response = await flowEvent(data, file); |
| | | const response = await flowEvent(data, file) |
| | | |
| | | if (response.data.code === 0) { |
| | | this.$message.success('工单已完成'); |
| | | this.detailVisible = false; |
| | | this.fetchTableData(); // 刷新列表数据 |
| | | this.$message.success('工单已完成') |
| | | this.detailVisible = false |
| | | this.fetchTableData() // 刷新列表数据 |
| | | } else { |
| | | throw new Error(response.data.msg || '操作失败'); |
| | | throw new Error(response.data.msg || '操作失败') |
| | | } |
| | | } catch (error) { |
| | | console.error('完成工单失败:', error); |
| | | this.$message.error(error.message || '操作失败,请稍后重试'); |
| | | console.error('完成工单失败:', error) |
| | | this.$message.error(error.message || '操作失败,请稍后重试') |
| | | } finally { |
| | | this.completeLoading = false; |
| | | this.completeLoading = false |
| | | } |
| | | }, |
| | | async approveAndDispatch() { |
| | | if (this.dispatchLoading) return; |
| | | async approveAndDispatch () { |
| | | if (this.dispatchLoading) return |
| | | |
| | | // 添加必填项检查 |
| | | if (!this.currentDetail.orderName || !this.currentDetail.orderName.trim()) { |
| | | this.$message.warning('请填写工单名称'); |
| | | return; |
| | | this.$message.warning('请填写工单名称') |
| | | return |
| | | } |
| | | if (!this.currentDetail.type) { |
| | | this.$message.warning('请选择工单类型'); |
| | | return; |
| | | this.$message.warning('请选择工单类型') |
| | | return |
| | | } |
| | | if (!this.currentDetail.content || !this.currentDetail.content.trim()) { |
| | | this.$message.warning('请填写工单内容'); |
| | | return; |
| | | this.$message.warning('请填写工单内容') |
| | | return |
| | | } |
| | | |
| | | // 通过验证后,打开派发对话框 |
| | | this.dispatchDialogVisible = true; |
| | | this.dispatchDialogVisible = true |
| | | }, |
| | | hasProcessingBtnPermission() { |
| | | hasProcessingBtnPermission () { |
| | | // undefined 或 false 都返回 false,只有 true 返回 true |
| | | console.log('权限检查:', this.permission); |
| | | return this.permission && this.permission.tickets_processing_btn === true; |
| | | console.log('权限检查:', this.permission) |
| | | return this.permission && this.permission.tickets_processing_btn === true |
| | | }, |
| | | hasProcessedAndOverBtnPermission() { |
| | | hasProcessedAndOverBtnPermission () { |
| | | // undefined 或 false 都返回 false,只有 true 返回 true |
| | | console.log('权限检查:', this.permission); |
| | | return this.permission && this.permission.tickets_view_processedAndOver === true; |
| | | console.log('权限检查:', this.permission) |
| | | return this.permission && this.permission.tickets_view_processedAndOver === true |
| | | }, |
| | | hasReviewBtnPermission() { |
| | | hasReviewBtnPermission () { |
| | | // undefined 或 false 都返回 false,只有 true 返回 true |
| | | console.log('权限检查:', this.permission); |
| | | return this.permission && this.permission.tickets_review_btn === true; |
| | | console.log('权限检查:', this.permission) |
| | | return this.permission && this.permission.tickets_review_btn === true |
| | | }, |
| | | async submitDispatch() { |
| | | if (this.dispatchLoading) return; |
| | | async submitDispatch () { |
| | | if (this.dispatchLoading) return |
| | | if (!this.currentDetail.orderName || !this.currentDetail.orderName.trim()) { |
| | | this.$message.warning('请填写工单名称'); |
| | | return; |
| | | this.$message.warning('请填写工单名称') |
| | | return |
| | | } |
| | | if (!this.currentDetail.type) { |
| | | this.$message.warning('请选择工单类型'); |
| | | return; |
| | | this.$message.warning('请选择工单类型') |
| | | return |
| | | } |
| | | if (!this.currentDetail.content || !this.currentDetail.content.trim()) { |
| | | this.$message.warning('请填写工单内容'); |
| | | return; |
| | | this.$message.warning('请填写工单内容') |
| | | return |
| | | } |
| | | if (!this.dispatchForm.department) { |
| | | this.$message.warning('请选择部门'); |
| | | return; |
| | | this.$message.warning('请选择部门') |
| | | return |
| | | } |
| | | if (!this.dispatchForm.handler) { |
| | | this.$message.warning('请选择处理人'); |
| | | return; |
| | | this.$message.warning('请选择处理人') |
| | | return |
| | | } |
| | | this.dispatchLoading = true; |
| | | this.dispatchLoading = true |
| | | this.$refs.dispatchForm.validate(async (valid) => { |
| | | if (valid) { |
| | | try { |
| | |
| | | content: this.currentDetail.content, // 使用 content 替代原来的 remark |
| | | createDept: this.dispatchForm.department, // 派发部门 ID |
| | | updateUser: this.dispatchForm.handler, // 处理人 ID |
| | | }; |
| | | } |
| | | |
| | | const file = this.currentDetail.file || null; // 如果没有文件,则为 null |
| | | const file = this.currentDetail.file || null // 如果没有文件,则为 null |
| | | |
| | | const response = await flowEvent(data, file); |
| | | const response = await flowEvent(data, file) |
| | | if (response.data.code === 0) { |
| | | this.$message.success('工单已成功派发'); |
| | | this.dispatchDialogVisible = false; |
| | | this.detailVisible = false; |
| | | this.fetchTableData(); |
| | | this.$message.success('工单已成功派发') |
| | | this.dispatchDialogVisible = false |
| | | this.detailVisible = false |
| | | this.fetchTableData() |
| | | } else { |
| | | throw new Error(response.data.msg || '派发失败'); |
| | | throw new Error(response.data.msg || '派发失败') |
| | | } |
| | | } catch (error) { |
| | | console.error('派发失败:', error); |
| | | this.$message.error(error.message || '派发失败,请稍后重试'); |
| | | console.error('派发失败:', error) |
| | | this.$message.error(error.message || '派发失败,请稍后重试') |
| | | } finally { |
| | | this.dispatchLoading = false; |
| | | this.dispatchLoading = false |
| | | } |
| | | } else { |
| | | this.dispatchLoading = false; |
| | | this.dispatchLoading = false |
| | | } |
| | | }); |
| | | }) |
| | | }, |
| | | async finalizeTicket() { |
| | | if (this.finalizeLoading) return; |
| | | this.finalizeLoading = true; |
| | | async finalizeTicket () { |
| | | if (this.finalizeLoading) return |
| | | this.finalizeLoading = true |
| | | try { |
| | | // 检查是否上传了图片 |
| | | if (!this.currentDetail.photos || !this.currentDetail.photos.length) { |
| | | this.$message.warning('请上传事件处理照片,或飞行任务结束核验工单是否完结'); |
| | | return; |
| | | this.$message.warning('请上传事件处理照片,或飞行任务结束核验工单是否完结') |
| | | return |
| | | } |
| | | |
| | | const data = { |
| | | id: this.currentDetail.id, |
| | | status: this.currentDetail.status, |
| | | eventNum: this.currentDetail.orderNumber, |
| | | }; |
| | | } |
| | | |
| | | const file = this.currentDetail.photos[0].raw; |
| | | const file = this.currentDetail.photos[0].raw |
| | | |
| | | const response = await flowEvent(data, file); |
| | | const response = await flowEvent(data, file) |
| | | |
| | | if (response.data.code === 0) { |
| | | this.$message.success('工单已完结'); |
| | | this.detailVisible = false; |
| | | this.fetchTableData(); |
| | | this.$message.success('工单已完结') |
| | | this.detailVisible = false |
| | | this.fetchTableData() |
| | | } else { |
| | | throw new Error(response.data.msg || '操作失败'); |
| | | throw new Error(response.data.msg || '操作失败') |
| | | } |
| | | } catch (error) { |
| | | console.error('完结工单失败:', error); |
| | | this.$message.error(error.message || '操作失败,请稍后重试'); |
| | | console.error('完结工单失败:', error) |
| | | this.$message.error(error.message || '操作失败,请稍后重试') |
| | | } finally { |
| | | this.finalizeLoading = false; |
| | | this.finalizeLoading = false |
| | | } |
| | | }, |
| | | |
| | | // 添加编辑方法 |
| | | handleEdit(row) { |
| | | console.log('编辑原始数据:', row); |
| | | handleEdit (row) { |
| | | console.log('编辑原始数据:', row) |
| | | |
| | | // 尝试从row.dept_id或通过部门名称查找对应的部门ID |
| | | let deptId = row.dept_id; // 优先使用原始数据中的dept_id |
| | | let deptId = row.dept_id // 优先使用原始数据中的dept_id |
| | | |
| | | // 如果没有dept_id,则通过部门名称查找 |
| | | if (!deptId) { |
| | | // 输出所有可用的部门数据用于调试 |
| | | console.log('可用部门列表:', this.departments); |
| | | console.log('当前部门名称:', row.department); |
| | | 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; |
| | | ) |
| | | deptId = deptInfo?.value |
| | | } |
| | | |
| | | // 获取工单类型值 - 从types中找到匹配的值 |
| | | const typeValue = this.types.find(t => t.label === row.type)?.value || row.event_dict_key; |
| | | const typeValue = this.types.find(t => t.label === row.type)?.value || row.event_dict_key |
| | | |
| | | // 获取处理人ID - 使用userNameToIdMap映射 |
| | | const handlerId = this.userNameToIdMap[row.handler] || row.handler; |
| | | const handlerId = this.userNameToIdMap[row.handler] || row.handler |
| | | |
| | | console.log('数据映射:', { |
| | | 部门名称: row.department, |
| | |
| | | 处理人ID: handlerId, |
| | | 原始工单类型: row.type, |
| | | 映射后类型值: typeValue |
| | | }); |
| | | }) |
| | | |
| | | let algorithmArr = []; |
| | | let algorithmArr = [] |
| | | if (Array.isArray(row.aiType)) { |
| | | algorithmArr = row.aiType; |
| | | algorithmArr = row.aiType |
| | | } else if (typeof row.aiType === 'string' && row.aiType) { |
| | | algorithmArr = row.aiType.split(',').map(i => i.trim()); |
| | | algorithmArr = row.aiType.split(',').map(i => i.trim()) |
| | | } |
| | | this.form = { |
| | | id: row.id, |
| | |
| | | address: row.address || '', |
| | | content: row.content, |
| | | photos: [], |
| | | }; |
| | | } |
| | | this.form.location = Array.isArray(row.location) && row.location.length >= 2 |
| | | ? [ |
| | | Number(row.location[0]), |
| | | Number(row.location[1]), |
| | | row.location[2] || row.address || '' |
| | | ] |
| | | : []; |
| | | this.form.address = this.form.location[2] || ''; |
| | | : [] |
| | | 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])]; |
| | | this.mapParams.center = [Number(this.form.location[0]), Number(this.form.location[1])] |
| | | } else { |
| | | this.mapParams.center = null; // 没有经纬度时用默认 |
| | | this.mapParams.center = null // 没有经纬度时用默认 |
| | | } |
| | | // 如果有图片,添加到表单中 |
| | | if (row.photo_url) { |
| | | this.form.photos = [{ |
| | | name: 'existing-photo', |
| | | url: row.photo_url |
| | | }]; |
| | | }] |
| | | } |
| | | |
| | | this.dialogVisible = true; |
| | | this.dialogVisible = true |
| | | }, |
| | | // 添加删除方法 |
| | | handleDelete(row) { |
| | | handleDelete (row) { |
| | | this.$confirm('确认删除该工单?', '提示', { |
| | | confirmButtonText: '确定', |
| | | cancelButtonText: '取消', |
| | |
| | | id: row.id, |
| | | status: 0, |
| | | isDelete: 1 |
| | | }); |
| | | }) |
| | | |
| | | if (response.data.code === 0) { |
| | | this.$message.success('删除成功'); |
| | | this.fetchTableData(); |
| | | this.$message.success('删除成功') |
| | | this.fetchTableData() |
| | | } else { |
| | | throw new Error(response.data.msg || '删除失败'); |
| | | throw new Error(response.data.msg || '删除失败') |
| | | } |
| | | } catch (error) { |
| | | console.error('删除失败:', error); |
| | | this.$message.error(error.message || '删除失败,请稍后重试'); |
| | | console.error('删除失败:', error) |
| | | this.$message.error(error.message || '删除失败,请稍后重试') |
| | | } |
| | | }).catch(() => { }); |
| | | }).catch(() => { }) |
| | | }, |
| | | |
| | | // 添加选择变化处理方法 |
| | | handleSelectionChange(selection) { |
| | | this.selections = selection; |
| | | console.log('已选择的行:', selection); |
| | | handleSelectionChange (selection) { |
| | | this.selections = selection |
| | | console.log('已选择的行:', selection) |
| | | }, |
| | | |
| | | // 添加全选方法 |
| | | handleSelectAll(val) { |
| | | this.$refs.avueCrud.toggleSelection(val); |
| | | handleSelectAll (val) { |
| | | this.$refs.avueCrud.toggleSelection(val) |
| | | }, |
| | | |
| | | // 添加单行选择方法 |
| | | handleSelect(selection, row) { |
| | | console.log('选中行变化:', selection, row); |
| | | handleSelect (selection, row) { |
| | | console.log('选中行变化:', selection, row) |
| | | }, |
| | | |
| | | // 如果需要手动选中某些行 |
| | | setSelection(rows) { |
| | | setSelection (rows) { |
| | | this.$nextTick(() => { |
| | | rows.forEach(row => { |
| | | this.$refs.avueCrud.toggleSelection(row, true); |
| | | }); |
| | | }); |
| | | this.$refs.avueCrud.toggleSelection(row, true) |
| | | }) |
| | | }) |
| | | }, |
| | | |
| | | // 清空选择 |
| | | clearSelection() { |
| | | this.$refs.avueCrud.clearSelection(); |
| | | clearSelection () { |
| | | this.$refs.avueCrud.clearSelection() |
| | | }, |
| | | |
| | | // 打开审核对话框 |
| | | openReviewDialog() { |
| | | openReviewDialog () { |
| | | if (this.selections.length === 0) { |
| | | this.$message.warning('请先选择要审核的工单'); |
| | | return; |
| | | this.$message.warning('请先选择要审核的工单') |
| | | return |
| | | } |
| | | this.currentImageIndex = 1; |
| | | this.updateCurrentReviewImage(); |
| | | this.reviewDialogVisible = true; |
| | | this.currentImageIndex = 1 |
| | | this.updateCurrentReviewImage() |
| | | this.reviewDialogVisible = true |
| | | }, |
| | | |
| | | // 更新当前审核图片 |
| | | updateCurrentReviewImage() { |
| | | updateCurrentReviewImage () { |
| | | // 修正索引范围 |
| | | if (!this.selections || this.selections.length === 0) { |
| | | this.currentReviewImage = ''; |
| | | this.currentImageIndex = 1; |
| | | return; |
| | | this.currentReviewImage = '' |
| | | this.currentImageIndex = 1 |
| | | return |
| | | } |
| | | // 如果当前索引超出范围,自动回退到最后一张 |
| | | if (this.currentImageIndex > this.selections.length) { |
| | | this.currentImageIndex = this.selections.length; |
| | | this.currentImageIndex = this.selections.length |
| | | } |
| | | if (this.currentImageIndex < 1) { |
| | | this.currentImageIndex = 1; |
| | | this.currentImageIndex = 1 |
| | | } |
| | | const index = this.currentImageIndex - 1; |
| | | const index = this.currentImageIndex - 1 |
| | | if (index >= 0 && index < this.selections.length) { |
| | | const currentItem = this.selections[index]; |
| | | this.currentReviewImage = currentItem.photo_url || ''; |
| | | const currentItem = this.selections[index] |
| | | this.currentReviewImage = currentItem.photo_url || '' |
| | | } else { |
| | | this.currentReviewImage = ''; |
| | | this.currentReviewImage = '' |
| | | } |
| | | }, |
| | | |
| | | // 处理图片分页变化 |
| | | handleImagePageChange(page) { |
| | | handleImagePageChange (page) { |
| | | if (page > 0 && page <= this.selections.length) { |
| | | this.currentImageIndex = page; |
| | | this.updateCurrentReviewImage(); |
| | | this.currentImageIndex = page |
| | | this.updateCurrentReviewImage() |
| | | } |
| | | }, |
| | | |
| | | // 批量审核通过 |
| | | async handleBatchApprove() { |
| | | async handleBatchApprove () { |
| | | try { |
| | | if (this.selections.length === 0) { |
| | | this.$message.warning('没有选中的工单'); |
| | | return; |
| | | this.$message.warning('没有选中的工单') |
| | | return |
| | | } |
| | | |
| | | const currentItem = this.selections[this.currentImageIndex - 1]; |
| | | const currentItem = this.selections[this.currentImageIndex - 1] |
| | | if (!currentItem) { |
| | | this.$message.warning('当前工单数据无效'); |
| | | return; |
| | | this.$message.warning('当前工单数据无效') |
| | | return |
| | | } |
| | | |
| | | await this.$confirm('确认审核通过当前工单?', '提示', { |
| | | confirmButtonText: '确定', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }); |
| | | }) |
| | | |
| | | const data = { |
| | | id: currentItem.id, |
| | | status: currentItem.status, |
| | | isPass: 0, |
| | | eventNum: currentItem.orderNumber, |
| | | }; |
| | | } |
| | | console.log('删除前:', this.selections) |
| | | const response = await flowEvent(data); |
| | | const response = await flowEvent(data) |
| | | if (response.data.code === 0) { |
| | | this.$message.success('工单审核通过'); |
| | | this.$message.success('工单审核通过') |
| | | |
| | | // 创建新的数组而不是修改原数组 |
| | | const newSelections = [...this.selections]; |
| | | newSelections.splice(this.currentImageIndex - 1, 1); |
| | | const newSelections = [...this.selections] |
| | | newSelections.splice(this.currentImageIndex - 1, 1) |
| | | |
| | | // 修正索引并更新图片 |
| | | if (newSelections.length > 0) { |
| | | if (this.currentImageIndex > this.selections.length) { |
| | | this.currentImageIndex = this.selections.length; |
| | | this.currentImageIndex = this.selections.length |
| | | } |
| | | this.updateCurrentReviewImage(); |
| | | this.updateCurrentReviewImage() |
| | | } else { |
| | | this.reviewDialogVisible = false; |
| | | this.currentImageIndex = 1; |
| | | this.currentReviewImage = ''; |
| | | this.fetchTableData(); |
| | | this.reviewDialogVisible = false |
| | | this.currentImageIndex = 1 |
| | | this.currentReviewImage = '' |
| | | this.fetchTableData() |
| | | } |
| | | |
| | | // 刷新表格数据 |
| | | // this.fetchTableData(); |
| | | this.selections = newSelections; |
| | | this.selections = newSelections |
| | | |
| | | } else { |
| | | throw new Error(response.data.msg || '审核失败'); |
| | | throw new Error(response.data.msg || '审核失败') |
| | | } |
| | | } catch (error) { |
| | | if (error === 'cancel') return; |
| | | this.$message.error(error.message || '审核失败,请稍后重试'); |
| | | if (error === 'cancel') return |
| | | this.$message.error(error.message || '审核失败,请稍后重试') |
| | | } |
| | | }, |
| | | |
| | | cancleBatchReject() { |
| | | this.reviewDialogVisible = false; |
| | | this.selections = []; |
| | | this.currentImageIndex = 1; |
| | | this.currentReviewImage = ''; |
| | | this.fetchTableData(); |
| | | cancleBatchReject () { |
| | | this.reviewDialogVisible = false |
| | | this.selections = [] |
| | | this.currentImageIndex = 1 |
| | | this.currentReviewImage = '' |
| | | this.fetchTableData() |
| | | }, |
| | | // 批量审核不通过 |
| | | async handleBatchReject() { |
| | | async handleBatchReject () { |
| | | try { |
| | | if (this.selections.length === 0) { |
| | | this.$message.warning('没有选中的工单'); |
| | | return; |
| | | this.$message.warning('没有选中的工单') |
| | | return |
| | | } |
| | | |
| | | const currentItem = this.selections[this.currentImageIndex - 1]; |
| | | const currentItem = this.selections[this.currentImageIndex - 1] |
| | | if (!currentItem) { |
| | | this.$message.warning('当前工单数据无效'); |
| | | return; |
| | | this.$message.warning('当前工单数据无效') |
| | | return |
| | | } |
| | | |
| | | await this.$confirm('确认该工单审核不通过?', '提示', { |
| | | confirmButtonText: '确定', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }); |
| | | }) |
| | | |
| | | const data = { |
| | | id: currentItem.id, |
| | |
| | | isPass: 1, |
| | | eventNum: currentItem.orderNumber, |
| | | eventName: currentItem.orderName, |
| | | }; |
| | | } |
| | | |
| | | const response = await flowEvent(data); |
| | | const response = await flowEvent(data) |
| | | if (response.data.code === 0) { |
| | | this.$message.success('工单审核不通过'); |
| | | this.$message.success('工单审核不通过') |
| | | |
| | | // 创建新的数组而不是修改原数组 |
| | | const newSelections = [...this.selections]; |
| | | newSelections.splice(this.currentImageIndex - 1, 1); |
| | | this.selections = newSelections; |
| | | 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.currentImageIndex = this.selections.length |
| | | } |
| | | this.updateCurrentReviewImage(); |
| | | this.updateCurrentReviewImage() |
| | | } else { |
| | | this.reviewDialogVisible = false; |
| | | this.currentImageIndex = 1; |
| | | this.currentReviewImage = ''; |
| | | this.fetchTableData(); |
| | | this.reviewDialogVisible = false |
| | | this.currentImageIndex = 1 |
| | | this.currentReviewImage = '' |
| | | this.fetchTableData() |
| | | } |
| | | |
| | | // 刷新表格数据 |
| | | // this.fetchTableData(); |
| | | } else { |
| | | throw new Error(response.data.msg || '驳回失败'); |
| | | throw new Error(response.data.msg || '驳回失败') |
| | | } |
| | | } catch (error) { |
| | | if (error === 'cancel') return; |
| | | this.$message.error(error.message || '驳回失败,请稍后重试'); |
| | | if (error === 'cancel') return |
| | | this.$message.error(error.message || '驳回失败,请稍后重试') |
| | | } |
| | | }, |
| | | |
| | | // 获取所有图片列表用于预览 |
| | | getImageList() { |
| | | getImageList () { |
| | | return this.selections |
| | | .map(item => this.getPreviewUrl(item.photo_url)) |
| | | .filter(url => url); // 过滤掉空值 |
| | | .filter(url => url) // 过滤掉空值 |
| | | }, |
| | | |
| | | // 处理图片点击 |
| | | handleImageClick() { |
| | | handleImageClick () { |
| | | // 图片点击事件由 el-image 的预览功能处理 |
| | | }, |
| | | |
| | | // 处理上一张图片 |
| | | handlePrevImage() { |
| | | handlePrevImage () { |
| | | if (this.currentImageIndex > 1) { |
| | | this.currentImageIndex--; |
| | | this.updateCurrentReviewImage(); |
| | | this.currentImageIndex-- |
| | | this.updateCurrentReviewImage() |
| | | } |
| | | }, |
| | | |
| | | // 处理下一张图片 |
| | | handleNextImage() { |
| | | handleNextImage () { |
| | | if (this.currentImageIndex < this.selections.length) { |
| | | this.currentImageIndex++; |
| | | this.updateCurrentReviewImage(); |
| | | this.currentImageIndex++ |
| | | this.updateCurrentReviewImage() |
| | | } |
| | | }, |
| | | |
| | |
| | | * @param {string} url 原图地址 |
| | | * @returns {string} 缩略图地址 |
| | | */ |
| | | getThumbUrl(url) { |
| | | if (!url) return ''; |
| | | const lastDot = url.lastIndexOf('.'); |
| | | if (lastDot === -1) return url; |
| | | return url.slice(0, lastDot) + '_small' + url.slice(lastDot); |
| | | getThumbUrl (url) { |
| | | if (!url) return '' |
| | | const lastDot = url.lastIndexOf('.') |
| | | if (lastDot === -1) return url |
| | | return url.slice(0, lastDot) + '_small' + url.slice(lastDot) |
| | | }, |
| | | |
| | | // 添加新方法:获取预览图地址 |
| | | getPreviewUrl(url) { |
| | | if (!url) return ''; |
| | | const lastDot = url.lastIndexOf('.'); |
| | | if (lastDot === -1) return url; |
| | | return url.slice(0, lastDot) + '_show' + url.slice(lastDot); |
| | | getPreviewUrl (url) { |
| | | if (!url) return '' |
| | | const lastDot = url.lastIndexOf('.') |
| | | if (lastDot === -1) return url |
| | | return url.slice(0, lastDot) + '_show' + url.slice(lastDot) |
| | | }, |
| | | }, |
| | | }; |
| | | } |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | |
| | | |
| | | :deep(.el-image) { |
| | | width: 100% !important; |
| | | max-height: 100%; |
| | | max-width: 100%; |
| | | |
| | | .el-image__inner { |
| | | width: 100%; |