| | |
| | | <template> |
| | | <basic-container> |
| | | <el-tabs v-model="activeTab" @tab-click="handleTabChange"> |
| | | <el-tab-pane v-for="tab in tabs" :key="tab.name" :label="`${tab.label} (${tab.count})`" :name="tab.name"> |
| | | <el-tab-pane |
| | | v-for="tab in tabs" |
| | | :key="tab.name" |
| | | :label="`${tab.label} (${tab.count})`" |
| | | :name="tab.name" |
| | | > |
| | | <div class="tab-content"> |
| | | <!-- 查询条件筛选栏 --> |
| | | <div class="filter-bar"> |
| | |
| | | class="filter-item" |
| | | clearable |
| | | > |
| | | <el-option |
| | | <el-option |
| | | v-for="item in departments" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | /> |
| | | <el-date-picker |
| | | v-model="filters.dateRange" |
| | | type="daterange" |
| | | range-separator="至" |
| | | start-placeholder="开始日期" |
| | | end-placeholder="结束日期" |
| | | class="date-picker" |
| | | value-format="yyyy-MM-dd" |
| | | /> |
| | | |
| | | v-model="filters.dateRange" |
| | | type="daterange" |
| | | range-separator="至" |
| | | start-placeholder="开始日期" |
| | | end-placeholder="结束日期" |
| | | class="date-picker" |
| | | value-format="yyyy-MM-dd" |
| | | /> |
| | | </el-select> |
| | | |
| | | <el-select |
| | | <el-select |
| | | v-model="filters.ai_types" |
| | | placeholder="关联算法" |
| | | class="filter-item" |
| | |
| | | :value="item.value" |
| | | /> |
| | | </el-select> |
| | | |
| | | |
| | | <el-select |
| | | v-model="filters.status" |
| | | placeholder="请选择工单状态" |
| | |
| | | :data="tableData" |
| | | :option="option" |
| | | :page.sync="pagination" |
| | | v-model:page="page" |
| | | ref="crud" |
| | | :table-loading="loading" |
| | | @current-change="handlePaginationChange" |
| | | @size-change="handlePaginationChange" |
| | | @refresh-change="refreshChange" |
| | | @on-load="onLoad" |
| | | @search-change="searchChange" |
| | | > |
| | | <template #menu-left> |
| | | <el-button |
| | | type="primary" |
| | | icon="el-icon-plus" |
| | | @click="handleAdd" |
| | | >新建工单</el-button> |
| | | <el-button |
| | | type="success" |
| | | plain |
| | | icon="el-icon-download" |
| | | @click="exportData" |
| | | >导出</el-button> |
| | | <el-button type="primary" icon="el-icon-plus" @click="handleAdd">新建工单</el-button> |
| | | <el-button type="success" plain icon="el-icon-download" @click="exportData" |
| | | >导出</el-button |
| | | > |
| | | </template> |
| | | |
| | | <template #menu="{ row }"> |
| | | <el-button |
| | | type="text" |
| | | icon="el-icon-view" |
| | | @click="handleViewDetail(row)" |
| | | >详情</el-button> |
| | | <div v-if="row.status == 1 && userInfo.user_id != row.create_user"> |
| | | <el-button type="text" icon="el-icon-view" @click="handleViewDetail(row)" |
| | | >审核</el-button |
| | | > |
| | | </div> |
| | | |
| | | <div v-if="userInfo.user_id == row.create_user"> |
| | | <!--待审核状态--> |
| | | <div v-if="row.status == 1"> |
| | | <el-button type="text" icon="el-icon-view" @click="orderLogRecall(row.id)" |
| | | >撤回</el-button |
| | | > |
| | | </div> |
| | | <!--已驳回--> |
| | | <div v-if="row.status == 2"> |
| | | <el-button type="text" icon="el-icon-view" @click="rejectDetail(row.id)" |
| | | >驳回原因</el-button |
| | | > |
| | | </div> |
| | | <el-button type="text" icon="el-icon-view" @click="handleViewDetail(row)" |
| | | >详情</el-button |
| | | > |
| | | </div> |
| | | </template> |
| | | <template #status="{ row }"> |
| | | <el-tag :type="getStatusTagType(row.status)">{{ mapStatus(row.status) }}</el-tag> |
| | |
| | | </el-tabs> |
| | | |
| | | <!-- 新建工单对话框 --> |
| | | <el-dialog v-model="dialogVisible" title="新建工单" width="70%" :close-on-click-modal="false" @close="resetForm"> |
| | | <el-dialog |
| | | v-model="dialogVisible" |
| | | title="新建工单" |
| | | width="70%" |
| | | :close-on-click-modal="false" |
| | | @close="resetForm" |
| | | > |
| | | <el-form :model="form" :rules="rules" ref="form" label-width="100px"> |
| | | <el-row :gutter="20"> |
| | | <el-col :span="12"> |
| | |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="工单类型" prop="type"> |
| | | <el-select v-model="form.type" placeholder="请选择工单类型"> |
| | | <el-option v-for="item in types" :key="item.value" :label="item.label" :value="item.value" /> |
| | | <el-form-item label="关联航线" prop="file_id"> |
| | | <el-select v-model="form.file_id" placeholder="请选择航线"> |
| | | <el-option |
| | | v-for="item in handlers" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="20"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="处理人员" prop="handler"> |
| | | <el-select v-model="form.handler" placeholder="请选择处理人员"> |
| | | <el-option v-for="item in handlers" :key="item.value" :label="item.label" :value="item.value" /> |
| | | <el-form-item label="关联机巢" prop="device_sns"> |
| | | <el-select v-model="form.device_sns" placeholder="请选择机巢" multiple> |
| | | <el-option |
| | | v-for="item in handlers" |
| | | :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="algorithm"> |
| | | <el-select v-model="form.algorithm" placeholder="请选择关联算法"> |
| | | <el-option v-for="item in algorithms" :key="item.value" :label="item.label" :value="item.value" /> |
| | | <el-form-item label="关联算法" prop="ai_types"> |
| | | <el-select v-model="form.ai_types" placeholder="请选择关联算法" multiple> |
| | | <el-option |
| | | v-for="item in ai_types" |
| | | :key="item.dictKey" |
| | | :label="item.dictValue" |
| | | :value="item.dictKey" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | |
| | | <el-row :gutter="20"> |
| | | <el-col :span="24"> |
| | | <el-form-item label="位置选择"> |
| | | <el-button @click="openMap">地图选址</el-button> |
| | | <span v-if="form.location" style="margin-left: 10px;"> |
| | | 已选择位置: {{ formatLocation(form.location) }} |
| | | </span> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="20"> |
| | | <el-col :span="24"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="工单内容" prop="content"> |
| | | <el-input type="textarea" v-model="form.content" rows="4" placeholder="请输入工单内容"></el-input> |
| | | <el-input |
| | | type="textarea" |
| | | v-model="form.content" |
| | | rows="4" |
| | | placeholder="请输入工单内容" |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="20"> |
| | | <el-col :span="24"> |
| | | <el-form-item label="上传图片"> |
| | | <el-upload |
| | | action="/api/upload" |
| | | list-type="picture-card" |
| | | :on-preview="handleUploadPreview" |
| | | :on-remove="handleUploadRemove" |
| | | :on-success="handleUploadSuccess" |
| | | :on-error="handleUploadError" |
| | | :file-list="form.photos" |
| | | :limit="5" |
| | | :multiple="true" |
| | | accept="image/*" |
| | | :before-upload="beforeUpload" |
| | | > |
| | | <i class="el-icon-plus"></i> |
| | | <div slot="tip" class="el-upload__tip"> |
| | | 上传工单相关图片(支持jpg/png格式),最多5张,单张不超过5MB |
| | | </div> |
| | | </el-upload> |
| | | |
| | | <el-col :span="6"> |
| | | <el-form-item label="周期频次" prop="date_range"> |
| | | <el-date-picker |
| | | v-model="form.date_range" |
| | | type="daterange" |
| | | range-separator="至" |
| | | start-placeholder="开始日期" |
| | | end-placeholder="结束日期" |
| | | class="date-picker" |
| | | /> |
| | | </el-form-item> |
| | | |
| | | <el-button type="danger" @click="submitForm(1)">发布</el-button> |
| | | <el-button type="primary" @click="submitForm(0)">存草稿</el-button> |
| | | </el-col> |
| | | <el-col :span="3"> |
| | | <el-select v-model="form.rep_fre_type" placeholder="请选择频次"> |
| | | <el-option v-for="item in cycles" :key="item" :label="item" :value="item" /> |
| | | </el-select> |
| | | </el-col> |
| | | |
| | | <el-col :span="3"> |
| | | <el-time-picker |
| | | v-model="form.deal_time" |
| | | prop="deal_time" |
| | | value-format="HH:mm" |
| | | :picker-options="{ |
| | | selectableRange: '00:00 - 23:59', |
| | | }" |
| | | /> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <div slot="footer"> |
| | | <el-button @click="dialogVisible = false">取消</el-button> |
| | | <el-button type="primary" @click="submitForm">提交</el-button> |
| | | </div> |
| | | </el-dialog> |
| | | |
| | | <!-- 工单详情对话框 --> |
| | | <el-dialog v-model="detailVisible" title="工单详情" width="80%" append-to-body> |
| | | <el-row :gutter="20"> |
| | | <el-col :span="12"> |
| | | <el-form label-width="100px"> |
| | | <el-form-item label="上传照片"> |
| | | <el-upload |
| | | action="/api/upload" |
| | | list-type="picture-card" |
| | | :on-preview="handlePreview" |
| | | :on-remove="handleRemove" |
| | | :file-list="currentDetail.photos" |
| | | > |
| | | <i class="el-icon-plus"></i> |
| | | </el-upload> |
| | | <div class="el-upload__tip"> |
| | | 上传相关照片(jpg、jpeg、png),单张不超过5M |
| | | </div> |
| | | <el-dialog |
| | | v-model="detailVisible" |
| | | title="工单详情" |
| | | width="70%" |
| | | :close-on-click-modal="false" |
| | | @close="resetForm" |
| | | > |
| | | <el-form :model="form" ref="form" label-width="100px"> |
| | | <el-row :gutter="20"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="工单名称" prop="name"> |
| | | <el-input v-model="form.name" placeholder="请输入工单名称"></el-input> |
| | | </el-form-item> |
| | | </el-form> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form label-width="100px" class="detail-form"> |
| | | <el-form-item label="工单编号"> |
| | | <span>{{ currentDetail.orderNumber }}</span> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="关联航线" prop="file_id"> |
| | | <el-select v-model="form.file_id" placeholder="请选择航线"> |
| | | <el-option |
| | | v-for="item in handlers" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="任务名称"> |
| | | <span>{{ currentDetail.orderName }}</span> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="20"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="关联机巢" prop="device_sns"> |
| | | <el-select v-model="form.device_sns" placeholder="请选择机巢" multiple> |
| | | <el-option |
| | | v-for="item in handlers" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="工单状态"> |
| | | <el-tag :type="getStatusTagType(currentDetail.status)"> |
| | | {{ mapStatus(currentDetail.status) }} |
| | | </el-tag> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="关联算法" prop="ai_types"> |
| | | <el-select v-model="form.ai_types" placeholder="请选择关联算法" multiple> |
| | | <el-option |
| | | v-for="item in ai_types" |
| | | :key="item.dictKey" |
| | | :label="item.dictValue" |
| | | :value="item.dictKey" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="发起时间"> |
| | | <span>{{ currentDetail.startTime }}</span> |
| | | </el-col> |
| | | </el-row> |
| | | |
| | | <el-row :gutter="20"> |
| | | <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-form-item label="发起人"> |
| | | <span>{{ currentDetail.creator }}</span> |
| | | </el-col> |
| | | |
| | | <el-col :span="6"> |
| | | <el-form-item label="周期频次" prop="date_range"> |
| | | <el-date-picker |
| | | v-model="form.date_range" |
| | | type="daterange" |
| | | range-separator="至" |
| | | start-placeholder="开始日期" |
| | | end-placeholder="结束日期" |
| | | class="date-picker" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="经纬度"> |
| | | <span>{{ currentDetail.keyData }}</span> |
| | | </el-form-item> |
| | | <el-form-item label="详细地址"> |
| | | <span>{{ currentDetail.address }}</span> |
| | | </el-form-item> |
| | | </el-form> |
| | | </el-col> |
| | | </el-row> |
| | | <template #footer> |
| | | <el-button @click="detailVisible = false">关闭</el-button> |
| | | </template> |
| | | |
| | | <el-button |
| | | type="danger" |
| | | v-if="form.status == 0|| form.status == 2 && userInfo.user_id == form.create_user" |
| | | @click="submitForm(1)" |
| | | >发布</el-button |
| | | > |
| | | <el-button |
| | | type="primary" |
| | | v-if="form.status == 1 && userInfo.user_id != form.create_user" |
| | | @click="orderLogPass(form.id)" |
| | | >通过</el-button |
| | | > |
| | | <el-button |
| | | type="danger" |
| | | v-if="form.status == 1 && userInfo.user_id != form.create_user" |
| | | @click="orderLogReject(form.id)" |
| | | >驳回</el-button |
| | | > |
| | | </el-col> |
| | | <el-col :span="3"> |
| | | <el-select v-model="form.rep_fre_type" placeholder="请选择频次"> |
| | | <el-option v-for="item in cycles" :key="item" :label="item" :value="item" /> |
| | | </el-select> |
| | | </el-col> |
| | | |
| | | <el-col :span="3"> |
| | | <el-time-picker |
| | | v-model="form.deal_time" |
| | | prop="deal_time" |
| | | value-format="HH:mm" |
| | | :picker-options="{ |
| | | selectableRange: '00:00 - 23:59', |
| | | }" |
| | | /> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | </el-dialog> |
| | | </basic-container> |
| | | </template> |
| | | |
| | | <script> |
| | | import { getList, createTicket, getTicketInfo } from '@/api/tickets/orderLog'; |
| | | import { |
| | | getList, |
| | | saveUpdateOrderLog, |
| | | orderLogDetails, |
| | | orderLogRecall, |
| | | orderLogReject, |
| | | orderLogPass, |
| | | } from '@/api/tickets/orderLog'; |
| | | import { getDictionary } from '@/api/system/dictbiz'; |
| | | import { export_json_to_excel } from '@/utils/exportExcel'; |
| | | import { mapGetters } from 'vuex'; |
| | | |
| | | export default { |
| | | name: "TicketPage", |
| | | name: 'TicketPage', |
| | | data() { |
| | | return { |
| | | activeTab: "all", |
| | | activeTab: 'all', |
| | | |
| | | tabs: [ |
| | | { label: "全部工单", name: "all", value: null, count: 0 }, |
| | | { label: "待审核", name: "pending", value: 1, count: 0 }, |
| | | { label: "已驳回", name: "processing", value: 2, count: 0 }, |
| | | { label: "已通过", name: "inProgress", value: 3, count: 0 }, |
| | | { label: "草稿", name: "completed", value: 0, count: 0 }, |
| | | { label: '全部工单', name: 'all', value: null, count: 0 }, |
| | | { label: '待审核', name: 'pending', value: 1, count: 0 }, |
| | | { label: '已驳回', name: 'processing', value: 2, count: 0 }, |
| | | { label: '已通过', name: 'inProgress', value: 3, count: 0 }, |
| | | { label: '草稿', name: 'completed', value: 0, count: 0 }, |
| | | ], |
| | | filters: { |
| | | key_word: "", |
| | | create_dept: "", |
| | | start_date:null, |
| | | end_date:null, |
| | | file_id: "", |
| | | key_word: '', |
| | | create_dept: '', |
| | | start_date: null, |
| | | end_date: null, |
| | | file_id: '', |
| | | ai_types: [], |
| | | status: "", |
| | | dateRange:null, |
| | | status: '', |
| | | dateRange: null, |
| | | }, |
| | | departments: [], |
| | | types: [], |
| | | ai_types: [], |
| | | handlers: [ |
| | | { label: "处理人A", value: "handlerA" }, |
| | | { label: "处理人B", value: "handlerB" }, |
| | | { label: '处理人A', value: 'handlerA' }, |
| | | { label: '处理人B', value: 'handlerB' }, |
| | | ], |
| | | algorithms: [ |
| | | { label: "算法A", value: "algorithmA" }, |
| | | { label: "算法B", value: "algorithmB" }, |
| | | { label: '算法A', value: 'algorithmA' }, |
| | | { label: '算法B', value: 'algorithmB' }, |
| | | ], |
| | | statuses: [ |
| | | { label: "草稿", value: "0" }, |
| | | { label: "待审核", value: "1" }, |
| | | { label: "已驳回", value: "2" }, |
| | | { label: "已通过", value: "3" }, |
| | | { label: '草稿', value: '0' }, |
| | | { label: '待审核', value: '1' }, |
| | | { label: '已驳回', value: '2' }, |
| | | { label: '已通过', value: '3' }, |
| | | ], |
| | | //周期 |
| | | cycles: ['周一', '周二', '周三', '周四', '周五', '周六', '周日', '周末', '工作日', '每天'], |
| | | |
| | | tableData: [], |
| | | option: { |
| | | border: true, |
| | | stripe: true, |
| | | menuWidth: 150, |
| | | searchShow: true, |
| | | searchBtnText: '搜索', |
| | | searchMenuSpan: 6, |
| | | addBtnText: '新建工单', |
| | | addBtn: false, |
| | | viewBtn: false, |
| | | editBtn: false, |
| | | delBtn: false, |
| | | menu: true, |
| | | cancelBtn: true, |
| | | cancelBtnText: '取消', |
| | | column: [ |
| | | { label: "序号", prop: "id", width: 70 }, |
| | | { label: "工单编号", prop: "job_info_num", width: 150 }, |
| | | { label: "工单名称", prop: "name", width: 150 }, |
| | | { label: "所属单位", prop: "dept_name", width: 100 }, |
| | | { label: "发起时间", prop: "create_time", width: 160 }, |
| | | { label: "工单内容", prop: "content", width: 160 }, |
| | | { label: "关联航线", prop: "wayline_name", width: 160 }, |
| | | { label: "关联算法", prop: "ai_type_str", width: 180 }, |
| | | { label: "创建人", prop: "creator_name", width: 180 }, |
| | | { label: "关联机巢", prop: "device_names", width: 108 }, |
| | | |
| | | { label: "工单周期凭次", prop: "", width: 108, formatter: (row) => this.formatCycleTime(row)}, |
| | | { label: "工单状态", prop: "status", width: 60} |
| | | |
| | | |
| | | { label: '序号', prop: 'id', width: 70 }, |
| | | { label: '工单编号', prop: 'job_info_num', width: 150 }, |
| | | { label: '工单名称', prop: 'name', width: 150 }, |
| | | { label: '所属单位', prop: 'dept_name', width: 100 }, |
| | | { label: '发起时间', prop: 'create_time', width: 160 }, |
| | | { label: '工单内容', prop: 'content', width: 160 }, |
| | | { label: '关联航线', prop: 'wayline_name', width: 160 }, |
| | | { label: '关联算法', prop: 'ai_type_str', width: 180 }, |
| | | { label: '创建人', prop: 'creator_name', width: 180 }, |
| | | { label: '关联机巢', prop: 'device_names', width: 108 }, |
| | | { |
| | | label: '工单周期凭次', |
| | | prop: '', |
| | | width: 108, |
| | | formatter: row => this.formatCycleTime(row), |
| | | }, |
| | | { label: '工单状态', prop: 'status', width: 60 }, |
| | | ], |
| | | }, |
| | | pagination: { |
| | |
| | | pageSize: 10, |
| | | total: 0, |
| | | }, |
| | | page: { |
| | | pageSize: 10, |
| | | currentPage: 1, |
| | | total: 0, |
| | | }, |
| | | dialogVisible: false, |
| | | detailVisible: false, |
| | | currentDetail: {}, |
| | | form: { |
| | | name: '', |
| | | type: '', |
| | | handler: '', |
| | | algorithm: '', |
| | | location: '', |
| | | address: '', |
| | | content: '', |
| | | photos: [], |
| | | }, |
| | | form: {}, |
| | | rules: { |
| | | name: [{ required: true, message: '请输入工单名称', trigger: 'blur' }], |
| | | type: [{ required: true, message: '请选择工单类型', trigger: 'change' }], |
| | | handler: [{ required: true, message: '请选择处理人员', trigger: 'change' }], |
| | | file_id: [{ required: true, message: '需要选择航线', trigger: 'change' }], |
| | | device_sns: [{ required: true, message: '请选择机巢', trigger: 'change' }], |
| | | ai_types: [{ required: true, message: '请选择算法', trigger: 'change' }], |
| | | content: [{ required: true, message: '请输入工单内容', trigger: 'blur' }], |
| | | date_range: [{ required: true, message: '请选择时间不能为空', trigger: 'blur' }], |
| | | rep_fre_type: [{ required: true, message: '请选择周期', trigger: 'blur' }], |
| | | deal_time: [{ required: true, message: '请选择执行时间', trigger: 'blur' }], |
| | | }, |
| | | loading: false, |
| | | globalCounts: {}, |
| | |
| | | async created() { |
| | | this.loadAMapScripts(); |
| | | this.fetchDropdownData(); |
| | | var response=await getDictionary({ code: 'SF' }); |
| | | this.ai_types= response.data.data; |
| | | |
| | | var response = await getDictionary({ code: 'SF' }); |
| | | this.ai_types = response.data.data; |
| | | }, |
| | | mounted() { |
| | | this.fetchTableData(); |
| | | }, |
| | | |
| | | computed: { |
| | | ...mapGetters(['userInfo']), |
| | | }, |
| | | |
| | | methods: { |
| | | searchChange(params, done) { |
| | | console.log('searchChange'); |
| | | this.query = params; |
| | | this.parentId = ''; |
| | | this.page.currentPage = 1; |
| | | this.onLoad(this.page, params); |
| | | done(); |
| | | }, |
| | | onLoad(page, params = {}) { |
| | | this.loading = true; |
| | | getList(null, Object.assign(params, this.query)).then(res => { |
| | | this.tableData = res.data.data; |
| | | this.loading = false; |
| | | this.selectionClear(); |
| | | }); |
| | | }, |
| | | selectionClear() { |
| | | this.selectionList = []; |
| | | this.$refs.crud.toggleSelection(); |
| | | }, |
| | | async loadAMapScripts() { |
| | | try { |
| | | // await loadAMap(); |
| | |
| | | this.$message.error('地图加载失败,请检查网络或API Key配置'); |
| | | } |
| | | }, |
| | | formatCycleTime(row){ |
| | | return row.begin_time+"-"+row.end_time+" "+row.rep_rule_val; |
| | | }, |
| | | formatCycleTime(row) { |
| | | return row.begin_time + '-' + row.end_time + ' ' + row.rep_rule_val; |
| | | }, |
| | | async fetchDropdownData() { |
| | | try { |
| | | const response = await getTicketInfo(); |
| | | const response = await orderLogDetails(); |
| | | console.log('接口返回数据:', response.data.data); |
| | | const { dept_data, event_type } = response.data.data; |
| | | |
| | |
| | | this.loading = true; |
| | | try { |
| | | const currentTab = this.tabs.find(tab => tab.name === this.activeTab); |
| | | |
| | | |
| | | const params = { |
| | | key_word: this.filters.key_word || undefined, |
| | | create_dept: this.filters.create_dept || undefined, |
| | | ai_types:this.filters.ai_types && this.filters.ai_types.length > 0?[this.filters.ai_types]:null, |
| | | create_dept: this.filters.create_dept || undefined, |
| | | ai_types: |
| | | this.filters.ai_types && this.filters.ai_types.length > 0 |
| | | ? [this.filters.ai_types] |
| | | : null, |
| | | file_id: this.filters.file_id || undefined, |
| | | status: this.filters.status !== "" ? Number(this.filters.status) : currentTab?.value, |
| | | status: this.filters.status !== '' ? Number(this.filters.status) : currentTab?.value, |
| | | dept_id: this.filters.department || undefined, |
| | | start_date: this.filters.dateRange?.[0] ? this.formatDate(this.filters.dateRange[0]) : undefined, |
| | | end_date: this.filters.dateRange?.[1] ? this.formatDate(this.filters.dateRange[1]).replace("00:00:00", "23:59:59") : undefined, |
| | | start_date: this.filters.dateRange?.[0] |
| | | ? this.formatDate(this.filters.dateRange[0]) |
| | | : undefined, |
| | | end_date: this.filters.dateRange?.[1] |
| | | ? this.formatDate(this.filters.dateRange[1]).replace('00:00:00', '23:59:59') |
| | | : undefined, |
| | | current: this.pagination.currentPage, |
| | | size: this.pagination.pageSize, |
| | | }; |
| | | console.log("发送的参数:", params); |
| | | console.log('发送的参数:', params); |
| | | const response = await getList(params); |
| | | if (!response?.data?.data?.records) { |
| | | throw new Error('接口返回数据格式不正确'); |
| | |
| | | |
| | | const { total, records } = response.data.data; |
| | | this.tableData = records.map(item => { |
| | | |
| | | return item; |
| | | }); |
| | | |
| | |
| | | this.pagination.total = total || 0; |
| | | this.updateTabCounts(); |
| | | } catch (error) { |
| | | console.error("获取数据失败:", error); |
| | | this.$message.error(error.message || "获取数据失败"); |
| | | console.error('获取数据失败:', error); |
| | | this.$message.error(error.message || '获取数据失败'); |
| | | this.tableData = []; |
| | | this.pagination.total = 0; |
| | | } finally { |
| | |
| | | |
| | | async uploadFiles(files) { |
| | | const uploadPromises = files.map(file => { |
| | | return new Promise((resolve) => { |
| | | return new Promise(resolve => { |
| | | const formData = new FormData(); |
| | | formData.append('file', file.raw); |
| | | setTimeout(() => { |
| | | resolve({ |
| | | url: URL.createObjectURL(file.raw), |
| | | name: file.name |
| | | name: file.name, |
| | | }); |
| | | }, 1000); |
| | | }); |
| | | }); |
| | | return Promise.all(uploadPromises); |
| | | }, |
| | | |
| | | async submitForm() { |
| | | this.$refs.form.validate(async (valid) => { |
| | | //取消 |
| | | |
| | | async submitForm(status) { |
| | | this.$refs.form.validate(async valid => { |
| | | if (valid) { |
| | | if (!this.form.location || this.form.location.length !== 2) { |
| | | this.$message.warning('请在地图上选择位置'); |
| | | return; |
| | | } |
| | | let dateRange = this.form.date_range; |
| | | console.log('dateRange' + dateRange); |
| | | |
| | | try { |
| | | const unUploadedFiles = this.form.photos.filter(file => file.raw); |
| | | if (unUploadedFiles.length > 0) { |
| | | await this.uploadFiles(unUploadedFiles); |
| | | } |
| | | this.form.begin_time = this.formatDate(dateRange[0]); |
| | | this.form.end_time = this.formatDate(dateRange[1]); |
| | | |
| | | const submitData = { |
| | | ...this.form, |
| | | photos: this.form.photos.map(file => file.url || file.response?.url), |
| | | location: this.form.location.join(','), |
| | | status: 1 |
| | | }; |
| | | const submitData = { |
| | | ...this.form, |
| | | |
| | | await createTicket(submitData); |
| | | this.dialogVisible = false; |
| | | status: status, |
| | | }; |
| | | await saveUpdateOrderLog(submitData); |
| | | let id = this.form.id; |
| | | if (id) { |
| | | this.$message.success('工单发布成功'); |
| | | } else { |
| | | this.$message.success('工单创建成功'); |
| | | this.fetchTableData(); |
| | | } catch (error) { |
| | | console.error('提交失败:', error); |
| | | this.$message.error('工单创建失败: ' + (error.message || '服务器错误')); |
| | | } |
| | | this.dialogVisible = false; |
| | | this.detailVisible = false; |
| | | this.fetchTableData(); |
| | | } |
| | | }); |
| | | }, |
| | | |
| | | //驳回原因显示 |
| | | async rejectDetail(id){ |
| | | const response = await orderLogDetails(id); |
| | | let data=response.data.data; |
| | | this.$confirm(data.remark, '驳回原因', { |
| | | confirmButtonText: '确定', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }).then(() => { |
| | | this.form = { |
| | | ...response.data.data, |
| | | }; |
| | | this.detailVisible = true; |
| | | }) |
| | | |
| | | |
| | | }, |
| | | 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`; |
| | | return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String( |
| | | d.getDate() |
| | | ).padStart(2, '0')} 00:00:00`; |
| | | }, |
| | | |
| | | mapStatus(status) { |
| | | const statusTextMap = { |
| | | 1: "待审核", |
| | | 2: "待处理", |
| | | 3: "处理中", |
| | | 4: "已完成", |
| | | 5: "已完结" |
| | | 0: '草稿', |
| | | 1: '待审核', |
| | | 2: '已驳回', |
| | | 3: '已通过', |
| | | }; |
| | | return statusTextMap[status] || "未知状态"; |
| | | return statusTextMap[status] || '未知状态'; |
| | | }, |
| | | |
| | | getStatusTagType(status) { |
| | | const statusMap = { |
| | | 1: "warning", |
| | | 2: "info", |
| | | 3: "primary", |
| | | 4: "success", |
| | | 5: "danger", |
| | | 1: 'warning', |
| | | 2: 'info', |
| | | 3: 'primary', |
| | | 4: 'success', |
| | | 5: 'danger', |
| | | }; |
| | | return statusMap[status] || "info"; |
| | | return statusMap[status] || 'info'; |
| | | }, |
| | | |
| | | handleTabChange(tab) { |
| | | this.activeTab = tab.props?.name || tab.name; |
| | | this.filters.status = ""; |
| | | this.filters.status = ''; |
| | | this.pagination.currentPage = 1; |
| | | this.fetchTableData(); |
| | | }, |
| | |
| | | |
| | | handleReset() { |
| | | this.filters = { |
| | | keyword: "", |
| | | department: "", |
| | | type: "", |
| | | keyword: '', |
| | | department: '', |
| | | type: '', |
| | | dateRange: [], |
| | | status: "", |
| | | status: '', |
| | | }; |
| | | this.pagination.currentPage = 1; |
| | | this.fetchTableData(); |
| | |
| | | inProgress: 0, |
| | | completed: 0, |
| | | closed: 0, |
| | | myTickets: 0 |
| | | myTickets: 0, |
| | | }; |
| | | |
| | | records.forEach(item => { |
| | |
| | | }, |
| | | |
| | | handleAdd() { |
| | | this.form = {}; |
| | | this.dialogVisible = true; |
| | | }, |
| | | |
| | |
| | | return `${location[0].toFixed(6)}, ${location[1].toFixed(6)}`; |
| | | }, |
| | | |
| | | handleViewDetail(row) { |
| | | this.currentDetail = { |
| | | ...row, |
| | | photos: row.photos || [], |
| | | async handleViewDetail(row) { |
| | | const response = await orderLogDetails(row.id); |
| | | this.form = { |
| | | ...response.data.data, |
| | | }; |
| | | this.detailVisible = true; |
| | | }, |
| | | |
| | | openMap() { |
| | | this.$message.info("地图选址功能暂未实现"); |
| | | this.$message.info('地图选址功能暂未实现'); |
| | | }, |
| | | |
| | | handlePreview(file) { |
| | |
| | | refreshChange() { |
| | | this.fetchTableData(); |
| | | }, |
| | | |
| | | //撤回 |
| | | async orderLogRecall(id) { |
| | | this.$confirm('确定撤回则到草稿箱。', '是否撤回?', { |
| | | confirmButtonText: '确定', |
| | | cancelButtonText: '取消', |
| | | type: 'warning', |
| | | }).then(async () => { |
| | | let reposne = await orderLogRecall(id); |
| | | this.handleSearch(); |
| | | }); |
| | | }, |
| | | onLoad() { |
| | | this.fetchTableData(); |
| | | }, |
| | | |
| | | /** |
| | | * 通过 |
| | | */ |
| | | async orderLogPass(id) { |
| | | let response = await orderLogPass(id); |
| | | let data = response.data.data; |
| | | this.$message.success('审核通过'); |
| | | this.detailVisible = false; |
| | | }, |
| | | /** |
| | | * 驳回 |
| | | */ |
| | | async orderLogReject(id) { |
| | | this.$prompt('','驳回原因',{ |
| | | confirmButtonText: '确定', |
| | | cancelButtonText: '取消', |
| | | }).then(async({ value }) => { |
| | | let response = await orderLogReject(id, value); |
| | | let data = response.data.data; |
| | | this.$message.success('驳回成果'); |
| | | this.detailVisible = false; |
| | | }); |
| | | }, |
| | | async exportData() { |
| | | try { |
| | | this.loading = true; |
| | |
| | | word_order_type: this.filters.type || undefined, |
| | | status: this.filters.status || undefined, |
| | | dept_id: this.filters.department || undefined, |
| | | start_date: this.filters.dateRange?.[0] ? this.formatDate(this.filters.dateRange[0]) : undefined, |
| | | end_date: this.filters.dateRange?.[1] ? this.formatDate(this.filters.dateRange[1]) : undefined, |
| | | start_date: this.filters.dateRange?.[0] |
| | | ? this.formatDate(this.filters.dateRange[0]) |
| | | : undefined, |
| | | end_date: this.filters.dateRange?.[1] |
| | | ? this.formatDate(this.filters.dateRange[1]) |
| | | : undefined, |
| | | }; |
| | | |
| | | const response = await getList(params); |
| | |
| | | })); |
| | | |
| | | export_json_to_excel( |
| | | ['工单编号', '工单名称', '所属单位', '发起时间', '工单内容', '工单类型', '经纬度', '详细地址', '创建人', '处理人', '工单状态'], |
| | | [ |
| | | '工单编号', |
| | | '工单名称', |
| | | '所属单位', |
| | | '发起时间', |
| | | '工单内容', |
| | | '工单类型', |
| | | '经纬度', |
| | | '详细地址', |
| | | '创建人', |
| | | '处理人', |
| | | '工单状态', |
| | | ], |
| | | exportData, |
| | | '工单数据' |
| | | ); |
| | |
| | | handler() { |
| | | this.updateTabCounts(); |
| | | }, |
| | | deep: true |
| | | deep: true, |
| | | }, |
| | | } |
| | | }, |
| | | }; |
| | | </script> |
| | | |
| | |
| | | width: 100%; |
| | | display: flex; |
| | | flex-wrap: wrap; |
| | | |
| | | |
| | | :deep(.el-upload-list__item) { |
| | | transition: all 0.3s ease; |
| | | } |
| | | |
| | | |
| | | :deep(.el-upload-list__item:hover) { |
| | | background-color: #f5f7fa; |
| | | } |