wbc
2 months ago
23 changed files with 629 additions and 183 deletions
@ -1,58 +1,53 @@ |
|||||
import { ID, IDS, PageQuery, commonExport } from '@/api/base'; |
import { PageQuery, commonExport } from '@/api/base'; |
||||
import { defHttp } from '@/utils/http/axios'; |
import { defHttp } from '@/utils/http/axios'; |
||||
import { Dayjs } from 'dayjs'; |
|
||||
|
|
||||
enum Api { |
enum Api { |
||||
root = '/workflow/leave', |
root = '/platform/workOrder', |
||||
list = '/workflow/leave/list', |
list = '/platform/workOrder/list', |
||||
export = '/workflow/leave/export', |
export = '/workflow/leave/export', |
||||
} |
getSubcategoryType = '/platform/subcategoryType/list', |
||||
|
workOrderAdd = '/platform/workOrder/add', |
||||
export interface Leave { |
getProjectInfo = '/platform/projectInfo/getNames', |
||||
id: string; |
getOrganizationType = '/platform/organizationType/list', |
||||
leaveType: string; |
getContractNamesByProjectName = '/platform/contractInfo/getContractNamesByProjectName', |
||||
startDate: string; |
|
||||
endDate: string; |
|
||||
leaveDays: number; |
|
||||
remark: string; |
|
||||
processInstanceVo?: any; |
|
||||
dateTime?: [string, string] | [Dayjs, Dayjs]; |
|
||||
} |
|
||||
|
|
||||
export interface Resp { |
|
||||
createDept: number; |
|
||||
createBy: number; |
|
||||
createTime: string; |
|
||||
updateBy: number; |
|
||||
updateTime: string; |
|
||||
id: string; |
|
||||
leaveType: string; |
|
||||
startDate: string; |
|
||||
endDate: string; |
|
||||
leaveDays: number; |
|
||||
remark?: any; |
|
||||
} |
} |
||||
|
|
||||
export function list(params?: PageQuery) { |
export function list(params?: PageQuery) { |
||||
return defHttp.get<Leave[]>({ url: Api.list, params }); |
return defHttp.get({ url: Api.list, params }); |
||||
} |
} |
||||
|
|
||||
export function exportExcel(data: any) { |
export function exportExcel(data: any) { |
||||
return commonExport(Api.export, data); |
return commonExport(Api.export, data); |
||||
} |
} |
||||
|
|
||||
export function getInfo(id: ID) { |
export function getInfo(id: any) { |
||||
return defHttp.get<Leave>({ url: `${Api.root}/${id}` }); |
return defHttp.get({ url: `${Api.root}/${id}` }); |
||||
} |
} |
||||
|
|
||||
export function add(data: any) { |
export function add(data: any) { |
||||
return defHttp.post<Resp>({ url: Api.root, data }); |
return defHttp.post({ url: Api.root, data }); |
||||
} |
} |
||||
|
|
||||
export function update(data: any) { |
export function update(data: any) { |
||||
return defHttp.put<Resp>({ url: Api.root, data }); |
return defHttp.put({ url: Api.root, data }); |
||||
|
} |
||||
|
|
||||
|
export function removeByIds(ids: any) { |
||||
|
return defHttp.deleteWithMsg({ url: `${Api.root}/${ids.join(',')}` }); |
||||
} |
} |
||||
|
|
||||
export function removeByIds(ids: IDS) { |
export function getSubcategoryType() { |
||||
return defHttp.deleteWithMsg<void>({ url: `${Api.root}/${ids.join(',')}` }); |
return defHttp.get({ url: Api.getSubcategoryType }); |
||||
|
} |
||||
|
export function workOrderAdd(data: any) { |
||||
|
return defHttp.post({ url: Api.workOrderAdd, data }); |
||||
|
} |
||||
|
export function getProjectInfo() { |
||||
|
return defHttp.get({ url: Api.getProjectInfo }); |
||||
|
} |
||||
|
export function getOrganizationType() { |
||||
|
return defHttp.get({ url: Api.getOrganizationType }); |
||||
|
} |
||||
|
export function getContractNamesByProjectName(data:any) { |
||||
|
return defHttp.post({ url: Api.getContractNamesByProjectName,data }); |
||||
} |
} |
||||
@ -1,58 +1,53 @@ |
|||||
import { ID, IDS, PageQuery, commonExport } from '@/api/base'; |
import { PageQuery, commonExport } from '@/api/base'; |
||||
import { defHttp } from '@/utils/http/axios'; |
import { defHttp } from '@/utils/http/axios'; |
||||
import { Dayjs } from 'dayjs'; |
|
||||
|
|
||||
enum Api { |
enum Api { |
||||
root = '/workflow/leave', |
root = '/platform/workOrder', |
||||
list = '/workflow/leave/list', |
list = '/platform/workOrder/list', |
||||
export = '/workflow/leave/export', |
export = '/workflow/leave/export', |
||||
} |
getSubcategoryType = '/platform/subcategoryType/list', |
||||
|
workOrderAdd = '/platform/workOrder/add', |
||||
export interface Leave { |
getProjectInfo = '/platform/projectInfo/getNames', |
||||
id: string; |
getOrganizationType = '/platform/organizationType/list', |
||||
leaveType: string; |
getContractNamesByProjectName = '/platform/contractInfo/getContractNamesByProjectName', |
||||
startDate: string; |
|
||||
endDate: string; |
|
||||
leaveDays: number; |
|
||||
remark: string; |
|
||||
processInstanceVo?: any; |
|
||||
dateTime?: [string, string] | [Dayjs, Dayjs]; |
|
||||
} |
|
||||
|
|
||||
export interface Resp { |
|
||||
createDept: number; |
|
||||
createBy: number; |
|
||||
createTime: string; |
|
||||
updateBy: number; |
|
||||
updateTime: string; |
|
||||
id: string; |
|
||||
leaveType: string; |
|
||||
startDate: string; |
|
||||
endDate: string; |
|
||||
leaveDays: number; |
|
||||
remark?: any; |
|
||||
} |
} |
||||
|
|
||||
export function list(params?: PageQuery) { |
export function list(params?: PageQuery) { |
||||
return defHttp.get<Leave[]>({ url: Api.list, params }); |
return defHttp.get({ url: Api.list, params }); |
||||
} |
} |
||||
|
|
||||
export function exportExcel(data: any) { |
export function exportExcel(data: any) { |
||||
return commonExport(Api.export, data); |
return commonExport(Api.export, data); |
||||
} |
} |
||||
|
|
||||
export function getInfo(id: ID) { |
export function getInfo(id: any) { |
||||
return defHttp.get<Leave>({ url: `${Api.root}/${id}` }); |
return defHttp.get({ url: `${Api.root}/${id}` }); |
||||
} |
} |
||||
|
|
||||
export function add(data: any) { |
export function add(data: any) { |
||||
return defHttp.post<Resp>({ url: Api.root, data }); |
return defHttp.post({ url: Api.root, data }); |
||||
} |
} |
||||
|
|
||||
export function update(data: any) { |
export function update(data: any) { |
||||
return defHttp.put<Resp>({ url: Api.root, data }); |
return defHttp.put({ url: Api.root, data }); |
||||
|
} |
||||
|
|
||||
|
export function removeByIds(ids: any) { |
||||
|
return defHttp.deleteWithMsg({ url: `${Api.root}/${ids.join(',')}` }); |
||||
} |
} |
||||
|
|
||||
export function removeByIds(ids: IDS) { |
export function getSubcategoryType() { |
||||
return defHttp.deleteWithMsg<void>({ url: `${Api.root}/${ids.join(',')}` }); |
return defHttp.get({ url: Api.getSubcategoryType }); |
||||
|
} |
||||
|
export function workOrderAdd(data: any) { |
||||
|
return defHttp.post({ url: Api.workOrderAdd, data }); |
||||
|
} |
||||
|
export function getProjectInfo() { |
||||
|
return defHttp.get({ url: Api.getProjectInfo }); |
||||
|
} |
||||
|
export function getOrganizationType() { |
||||
|
return defHttp.get({ url: Api.getOrganizationType }); |
||||
|
} |
||||
|
export function getContractNamesByProjectName(data:any) { |
||||
|
return defHttp.post({ url: Api.getContractNamesByProjectName,data }); |
||||
} |
} |
||||
@ -0,0 +1,53 @@ |
|||||
|
import { PageQuery, commonExport } from '@/api/base'; |
||||
|
import { defHttp } from '@/utils/http/axios'; |
||||
|
|
||||
|
enum Api { |
||||
|
root = '/platform/workOrder', |
||||
|
list = '/platform/workOrder/list', |
||||
|
export = '/workflow/leave/export', |
||||
|
getSubcategoryType = '/platform/subcategoryType/list', |
||||
|
workOrderAdd = '/platform/workOrder/add', |
||||
|
getProjectInfo = '/platform/projectInfo/getNames', |
||||
|
getOrganizationType = '/platform/organizationType/list', |
||||
|
getContractNamesByProjectName = '/platform/contractInfo/getContractNamesByProjectName', |
||||
|
} |
||||
|
|
||||
|
export function list(params?: PageQuery) { |
||||
|
return defHttp.get({ url: Api.list, params }); |
||||
|
} |
||||
|
|
||||
|
export function exportExcel(data: any) { |
||||
|
return commonExport(Api.export, data); |
||||
|
} |
||||
|
|
||||
|
export function getInfo(id: any) { |
||||
|
return defHttp.get({ url: `${Api.root}/${id}` }); |
||||
|
} |
||||
|
|
||||
|
export function add(data: any) { |
||||
|
return defHttp.post({ url: Api.root, data }); |
||||
|
} |
||||
|
|
||||
|
export function update(data: any) { |
||||
|
return defHttp.put({ url: Api.root, data }); |
||||
|
} |
||||
|
|
||||
|
export function removeByIds(ids: any) { |
||||
|
return defHttp.deleteWithMsg({ url: `${Api.root}/${ids.join(',')}` }); |
||||
|
} |
||||
|
|
||||
|
export function getSubcategoryType() { |
||||
|
return defHttp.get({ url: Api.getSubcategoryType }); |
||||
|
} |
||||
|
export function workOrderAdd(data: any) { |
||||
|
return defHttp.post({ url: Api.workOrderAdd, data }); |
||||
|
} |
||||
|
export function getProjectInfo() { |
||||
|
return defHttp.get({ url: Api.getProjectInfo }); |
||||
|
} |
||||
|
export function getOrganizationType() { |
||||
|
return defHttp.get({ url: Api.getOrganizationType }); |
||||
|
} |
||||
|
export function getContractNamesByProjectName(data:any) { |
||||
|
return defHttp.post({ url: Api.getContractNamesByProjectName,data }); |
||||
|
} |
||||
@ -0,0 +1,50 @@ |
|||||
|
import { BasicColumn } from '@/components/Table'; |
||||
|
import { FormSchema } from '@/components/Form'; |
||||
|
//列表展示
|
||||
|
|
||||
|
export const formSchemas: FormSchema[] = [ |
||||
|
{ |
||||
|
label: '编号', |
||||
|
field: 'id', |
||||
|
component: 'Input', |
||||
|
componentProps: { |
||||
|
placeholder: '输入编号', |
||||
|
}, |
||||
|
}, |
||||
|
{ |
||||
|
field: '[startDate, endDate]', |
||||
|
label: '报修范围', |
||||
|
component: 'RangePicker', |
||||
|
componentProps: { |
||||
|
format: 'YYYY-MM-DD', |
||||
|
valueFormat:'YYYY-MM-DD' |
||||
|
}, |
||||
|
}, |
||||
|
]; |
||||
|
|
||||
|
export const columns: BasicColumn[] = [ |
||||
|
{ |
||||
|
title: '编号', |
||||
|
dataIndex: 'id', |
||||
|
}, |
||||
|
{ |
||||
|
title: '报修时间', |
||||
|
dataIndex: 'repairTime', |
||||
|
}, |
||||
|
{ |
||||
|
title: '响应级别', |
||||
|
dataIndex: 'responseLevel', |
||||
|
}, |
||||
|
{ |
||||
|
title: '故障描述', |
||||
|
dataIndex: 'faultDescription', |
||||
|
}, |
||||
|
{ |
||||
|
title: '故障地点', |
||||
|
dataIndex: 'faultLocation', |
||||
|
}, |
||||
|
{ |
||||
|
title: '剩余时间', |
||||
|
dataIndex: 'restTime', |
||||
|
}, |
||||
|
]; |
||||
@ -0,0 +1,331 @@ |
|||||
|
<template> |
||||
|
<div> |
||||
|
<!-- 抽屉组件 --> |
||||
|
<a-drawer |
||||
|
title="工单详情" |
||||
|
placement="right" |
||||
|
:closable="true" |
||||
|
:open="visible" |
||||
|
@close="onClose" |
||||
|
width="600px" |
||||
|
> |
||||
|
<a-tabs v-model:activeKey="activeKey"> |
||||
|
<a-tab-pane key="1" tab="详细信息"> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="24"> |
||||
|
<div><span class="titleLabel">所属项目：</span>{{ detail.projectName }}</div> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="24"> |
||||
|
<div><span class="titleLabel">所属合同：</span>{{ detail.contractName }}</div> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="12"> |
||||
|
<div><span class="titleLabel">编号：</span>{{ detail.id }}</div> |
||||
|
</a-col> |
||||
|
<a-col :span="12"> |
||||
|
<div><span class="titleLabel">报修人员：</span>{{ detail.repairer }}</div> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="12"> |
||||
|
<div><span class="titleLabel">状态：</span>{{ detail.status }}</div> |
||||
|
</a-col> |
||||
|
<a-col :span="12"> |
||||
|
<div><span class="titleLabel">待处理人：</span>{{ detail.handler }}</div> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="12"> |
||||
|
<div><span class="titleLabel">报修时间：</span>{{ detail.repairTime }}</div> |
||||
|
</a-col> |
||||
|
<a-col :span="12"> |
||||
|
<div><span class="titleLabel">是否事故：</span>{{ detail.isAccident }}</div> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="12"> |
||||
|
<div><span class="titleLabel">故障大类：</span>{{ detail.faultCategory }}</div> |
||||
|
</a-col> |
||||
|
<a-col :span="12"> |
||||
|
<div><span class="titleLabel">故障小类：</span>{{ detail.faultSubcategory }}</div> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="12"> |
||||
|
<div><span class="titleLabel">所属机构：</span>{{ detail.organizationName }}</div> |
||||
|
</a-col> |
||||
|
<a-col :span="12"> |
||||
|
<div><span class="titleLabel">响应级别：</span>{{ detail.responseLevel }}</div> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="24"> |
||||
|
<div><span class="titleLabel">响应时限(小时)：</span>{{ detail.responseTime }}</div> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="24"> |
||||
|
<div><span class="titleLabel">故障地址：</span>{{ detail.faultLocation }}</div> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="24"> |
||||
|
<div><span class="titleLabel">故障描述：</span>{{ detail.faultDescription }}</div> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="24"> |
||||
|
<div><span class="titleLabel">故障图片：</span>{{ detail.faultImg }}</div> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="24"> |
||||
|
<div id="orderHandleDetailMap" style="width: 100%; height: 500px"></div> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
</a-tab-pane> |
||||
|
<a-tab-pane key="2" tab="处理信息" force-render> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="24"> |
||||
|
<div><span class="titleLabel">维修人员：</span>{{ detail.fixPeople }}</div> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="24"> |
||||
|
<div><span class="titleLabel">修复时间：</span>{{ detail.fixTime }}</div> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="24"> |
||||
|
<div><span class="titleLabel">修复结果：</span>{{ detail.fixResult }}</div> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="24"> |
||||
|
<div><span class="titleLabel">费用情况：</span>{{ detail.cost }}</div> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="24"> |
||||
|
<div><span class="titleLabel">处理图片：</span>{{ detail.handleImg }}</div> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
</a-tab-pane> |
||||
|
<a-tab-pane key="3" tab="流程信息"> |
||||
|
<div style="margin-left: 20px"> |
||||
|
<a-timeline> |
||||
|
<a-timeline-item> |
||||
|
<template #dot>故障上报</template> |
||||
|
<div class="timeText">Create a services site 2015-09-01</div> |
||||
|
</a-timeline-item> |
||||
|
<a-timeline-item> |
||||
|
<template #dot>故障派遣</template> |
||||
|
<div class="timeText">Create a services site 2015-09-01</div> |
||||
|
</a-timeline-item> |
||||
|
<a-timeline-item> |
||||
|
<template #dot>故障接单</template> |
||||
|
<div class="timeText">Create a services site 2015-09-01</div> |
||||
|
</a-timeline-item> |
||||
|
<a-timeline-item> |
||||
|
<template #dot>故障处理</template> |
||||
|
<div class="timeText">Create a services site 2015-09-01</div> |
||||
|
</a-timeline-item> |
||||
|
<a-timeline-item> |
||||
|
<template #dot>预审</template> |
||||
|
<div class="timeText">Create a services site 2015-09-01</div> |
||||
|
</a-timeline-item> |
||||
|
<a-timeline-item> |
||||
|
<template #dot>初审</template> |
||||
|
<div class="timeText">Create a services site 2015-09-01</div> |
||||
|
</a-timeline-item> |
||||
|
</a-timeline> |
||||
|
</div> |
||||
|
</a-tab-pane> |
||||
|
<a-tab-pane key="4" tab="历史信息"> |
||||
|
<a-table :dataSource="historyInfo" :columns="historyColumns" bordered> |
||||
|
<template #bodyCell="{ column }"> |
||||
|
<template v-if="column.key === 'action'"> |
||||
|
<a-button type="link">查看</a-button> |
||||
|
</template> |
||||
|
</template> |
||||
|
</a-table> |
||||
|
</a-tab-pane> |
||||
|
<a-tab-pane key="5" tab="延期信息"> |
||||
|
<a-table :dataSource="delayInfo" :columns="delayColumns" bordered> |
||||
|
<template #bodyCell="{ column }"> |
||||
|
<template v-if="column.key === 'action'"> |
||||
|
<a-button type="link">查看</a-button> |
||||
|
</template> |
||||
|
</template> |
||||
|
</a-table> |
||||
|
</a-tab-pane> |
||||
|
</a-tabs> |
||||
|
</a-drawer> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import { reactive, ref } from 'vue'; |
||||
|
import { getInfo } from './api'; |
||||
|
import AMapLoader from '@amap/amap-jsapi-loader'; |
||||
|
export default { |
||||
|
setup(props, { emit }) { |
||||
|
//抽屉详情 |
||||
|
let detail = reactive({ |
||||
|
projectName: '', |
||||
|
contractName: '', |
||||
|
id: '', |
||||
|
status: null, |
||||
|
repairer: '', |
||||
|
handler: '', |
||||
|
repairTime: '', |
||||
|
organizationName: '', |
||||
|
isAccident: null, |
||||
|
faultCategory: '', |
||||
|
faultSubcategory: '', |
||||
|
responseLevel: null, |
||||
|
responseTime: '', |
||||
|
faultLocation: '', |
||||
|
faultDescription: '', |
||||
|
faultImg: '', |
||||
|
fixPeople: '', |
||||
|
fixTime: '', |
||||
|
fixResult: '', |
||||
|
cost: '', |
||||
|
handleImg: '', |
||||
|
longitude:'', |
||||
|
latitude:'' |
||||
|
}); |
||||
|
const historyInfo = ref([]); |
||||
|
const historyColumns = [ |
||||
|
{ |
||||
|
title: '环节', |
||||
|
dataIndex: 'stage', |
||||
|
key: 'stage', |
||||
|
}, |
||||
|
{ |
||||
|
title: '操作', |
||||
|
dataIndex: 'operation', |
||||
|
key: 'operation', |
||||
|
}, |
||||
|
{ |
||||
|
title: '操作人', |
||||
|
dataIndex: 'operator', |
||||
|
key: 'operator', |
||||
|
}, |
||||
|
{ |
||||
|
title: '详细信息', |
||||
|
dataIndex: 'action', |
||||
|
key: 'action ', |
||||
|
}, |
||||
|
]; |
||||
|
const delayInfo = ref([]); |
||||
|
const delayColumns = [ |
||||
|
{ |
||||
|
title: '申请时间', |
||||
|
dataIndex: 'applyTime', |
||||
|
key: 'applyTime', |
||||
|
}, |
||||
|
{ |
||||
|
title: '申请原因', |
||||
|
dataIndex: 'applyReason', |
||||
|
key: 'applyReason', |
||||
|
}, |
||||
|
{ |
||||
|
title: '延期时间', |
||||
|
dataIndex: 'delayTime', |
||||
|
key: 'delayTime', |
||||
|
}, |
||||
|
{ |
||||
|
title: '详细信息', |
||||
|
dataIndex: 'action', |
||||
|
key: 'action ', |
||||
|
}, |
||||
|
]; |
||||
|
|
||||
|
// 打开抽屉的方法 |
||||
|
const visible = ref(false); |
||||
|
const showDrawer = async (id) => { |
||||
|
visible.value = true; |
||||
|
const data = await getInfo(id); |
||||
|
for (let i in detail) { |
||||
|
detail[i] = data[i]; |
||||
|
} |
||||
|
initMap(detail.longitude,detail.latitude,detail.faultLocation) |
||||
|
}; |
||||
|
|
||||
|
// 关闭抽屉的方法 |
||||
|
const onClose = () => { |
||||
|
visible.value = false; |
||||
|
map.value?.destroy() |
||||
|
}; |
||||
|
const activeKey = ref('1'); |
||||
|
|
||||
|
//地图 |
||||
|
const map = ref(null); |
||||
|
const initMap = async (longitude, latitude, organizationName) => { |
||||
|
try { |
||||
|
// 加载高德地图 JavaScript API |
||||
|
await AMapLoader.load({ |
||||
|
key: '786a2e7cc6d4be5ba1d6174a0aa10f2b', |
||||
|
version: '2.0', |
||||
|
plugins: [], |
||||
|
}); |
||||
|
|
||||
|
// 初始化地图 |
||||
|
map.value = new AMap.Map('orderHandleDetailMap', { |
||||
|
zoom: 17, |
||||
|
center: [longitude, latitude], |
||||
|
}); |
||||
|
|
||||
|
// 添加标记（可选） |
||||
|
const marker = new AMap.Marker({ |
||||
|
position: new AMap.LngLat(longitude, latitude), |
||||
|
title: organizationName, |
||||
|
}); |
||||
|
const markerList = [marker]; |
||||
|
map.value.add(markerList); |
||||
|
} catch (error) { |
||||
|
console.error('加载高德地图失败:', error); |
||||
|
} |
||||
|
}; |
||||
|
return { |
||||
|
visible, |
||||
|
showDrawer, |
||||
|
onClose, |
||||
|
activeKey, |
||||
|
historyInfo, |
||||
|
historyColumns, |
||||
|
delayInfo, |
||||
|
delayColumns, |
||||
|
detail, |
||||
|
}; |
||||
|
}, |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style scoped> |
||||
|
/* 可选样式调整 */ |
||||
|
.ant-btn { |
||||
|
margin: 20px; |
||||
|
} |
||||
|
|
||||
|
/* .singerDetail{ |
||||
|
margin-bottom: 10px; |
||||
|
} */ |
||||
|
div { |
||||
|
margin-bottom: 10px; |
||||
|
} |
||||
|
|
||||
|
.timeText { |
||||
|
margin: 0 0 40px 20px; |
||||
|
color: red; |
||||
|
} |
||||
|
|
||||
|
.titleLabel { |
||||
|
color: gray; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,72 @@ |
|||||
|
<template> |
||||
|
<PageWrapper dense> |
||||
|
<BasicTable @register="registerTable"> |
||||
|
<template #bodyCell="{ column, record }"> |
||||
|
<template v-if="column && record && column.key === 'action'"> |
||||
|
<a-button type="link" @click="showDrawer(record.id)">详情</a-button> |
||||
|
</template> |
||||
|
</template> |
||||
|
</BasicTable> |
||||
|
<detailDrawer ref="detailDrawerRef" /> |
||||
|
</PageWrapper> |
||||
|
</template> |
||||
|
|
||||
|
<script setup lang="ts"> |
||||
|
import { PageWrapper } from '@/components/Page'; |
||||
|
import { BasicTable, useTable } from '@/components/Table'; |
||||
|
import { list, getProjectInfo } from './api'; |
||||
|
import { formSchemas, columns } from './data'; |
||||
|
import detailDrawer from './detailDrawer.vue'; |
||||
|
import { ref } from 'vue'; |
||||
|
|
||||
|
const [registerTable] = useTable({ |
||||
|
rowSelection: { |
||||
|
type: 'checkbox', |
||||
|
}, |
||||
|
title: '工单搜索', |
||||
|
api: list, |
||||
|
showIndexColumn: true, |
||||
|
rowKey: 'id', |
||||
|
useSearchForm: true, |
||||
|
formConfig: { |
||||
|
schemas: formSchemas, |
||||
|
name: 'orderSearch', |
||||
|
baseColProps: { |
||||
|
xs: 24, |
||||
|
sm: 24, |
||||
|
md: 24, |
||||
|
lg: 6, |
||||
|
}, |
||||
|
}, |
||||
|
columns: columns, |
||||
|
actionColumn: { |
||||
|
width: 200, |
||||
|
title: '操作', |
||||
|
key: 'action', |
||||
|
fixed: 'right', |
||||
|
}, |
||||
|
}); |
||||
|
|
||||
|
//详情抽屉 |
||||
|
const detailDrawerRef = ref(); |
||||
|
const showDrawer = (id: any) => { |
||||
|
detailDrawerRef.value.showDrawer(id); |
||||
|
}; |
||||
|
const projectOptions = ref([]); |
||||
|
const getProjectOptions = async () => { |
||||
|
const res = await getProjectInfo(); |
||||
|
res.forEach((i: any) => { |
||||
|
i.value = i.projectName; |
||||
|
i.label = i.projectName; |
||||
|
}); |
||||
|
projectOptions.value = res; |
||||
|
formSchemas[0].componentProps.options = projectOptions.value; |
||||
|
}; |
||||
|
const getOptions = () => { |
||||
|
getProjectOptions(); |
||||
|
}; |
||||
|
getOptions(); |
||||
|
// 前往审批记录页面 |
||||
|
</script> |
||||
|
|
||||
|
<style scoped></style> |
||||
Loading…
Reference in new issue