51 changed files with 4032 additions and 330 deletions
@ -0,0 +1,58 @@ |
|||
import { ID, IDS, PageQuery, commonExport } from '@/api/base'; |
|||
import { defHttp } from '@/utils/http/axios'; |
|||
import { Dayjs } from 'dayjs'; |
|||
|
|||
enum Api { |
|||
root = '/workflow/leave', |
|||
list = '/workflow/leave/list', |
|||
export = '/workflow/leave/export', |
|||
} |
|||
|
|||
export interface Leave { |
|||
id: string; |
|||
leaveType: string; |
|||
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) { |
|||
return defHttp.get<Leave[]>({ url: Api.list, params }); |
|||
} |
|||
|
|||
export function exportExcel(data: any) { |
|||
return commonExport(Api.export, data); |
|||
} |
|||
|
|||
export function getInfo(id: ID) { |
|||
return defHttp.get<Leave>({ url: `${Api.root}/${id}` }); |
|||
} |
|||
|
|||
export function add(data: any) { |
|||
return defHttp.post<Resp>({ url: Api.root, data }); |
|||
} |
|||
|
|||
export function update(data: any) { |
|||
return defHttp.put<Resp>({ url: Api.root, data }); |
|||
} |
|||
|
|||
export function removeByIds(ids: IDS) { |
|||
return defHttp.deleteWithMsg<void>({ url: `${Api.root}/${ids.join(',')}` }); |
|||
} |
@ -0,0 +1,119 @@ |
|||
import { BasicColumn } from '@/components/Table'; |
|||
import { FormSchema } from '@/components/Form'; |
|||
|
|||
export const formSchemas: FormSchema[] = [ |
|||
{ |
|||
field: 'projectName', |
|||
label: '项目名称', |
|||
component: 'Select', |
|||
componentProps: { |
|||
options: [ |
|||
{ |
|||
value: '1', |
|||
label: '2323', |
|||
}, |
|||
{ |
|||
value: '2', |
|||
label: '2323', |
|||
}, |
|||
{ |
|||
value: '3', |
|||
label: '2323', |
|||
}, |
|||
], |
|||
}, |
|||
}, |
|||
{ |
|||
field: 'ioCompany', |
|||
label: '运维单位', |
|||
component: 'Select', |
|||
componentProps: { |
|||
options: [ |
|||
{ |
|||
value: '1', |
|||
label: '2323', |
|||
}, |
|||
{ |
|||
value: '2', |
|||
label: '2323', |
|||
}, |
|||
{ |
|||
value: '3', |
|||
label: '2323', |
|||
}, |
|||
], |
|||
}, |
|||
}, |
|||
{ |
|||
field: 'plaDate', |
|||
label: '计划日期', |
|||
component: 'RangePicker', |
|||
}, |
|||
{ |
|||
field: 'deliverContent', |
|||
label: '交付内容', |
|||
component: 'Input', |
|||
componentProps: { |
|||
placeholder: '请输入', |
|||
}, |
|||
}, |
|||
{ |
|||
field: 'serviceProject', |
|||
label: '服务项目', |
|||
component: 'Input', |
|||
componentProps: { |
|||
placeholder: '请输入', |
|||
}, |
|||
}, |
|||
{ |
|||
field: 'code', |
|||
label: '代码', |
|||
component: 'Input', |
|||
componentProps: { |
|||
placeholder: '请输入', |
|||
}, |
|||
}, |
|||
{ |
|||
field: 'serviceContent', |
|||
label: '服务内容', |
|||
component: 'Input', |
|||
componentProps: { |
|||
placeholder: '请输入', |
|||
}, |
|||
}, |
|||
]; |
|||
|
|||
export const columns: BasicColumn[] = [ |
|||
{ |
|||
title: '项目名称', |
|||
dataIndex: 'projectName', |
|||
}, |
|||
{ |
|||
title: '服务项目', |
|||
dataIndex: 'serviceProject', |
|||
}, |
|||
{ |
|||
title: '计划描述', |
|||
dataIndex: 'description', |
|||
}, |
|||
{ |
|||
title: '交付内容', |
|||
dataIndex: 'deliverContent', |
|||
}, |
|||
{ |
|||
title: '代码', |
|||
dataIndex: 'code', |
|||
}, |
|||
{ |
|||
title: '开始日期', |
|||
dataIndex: 'startDate', |
|||
}, |
|||
{ |
|||
title: '结束日期', |
|||
dataIndex: 'endDate', |
|||
}, |
|||
{ |
|||
title: '状态', |
|||
dataIndex: 'status', |
|||
}, |
|||
]; |
@ -0,0 +1,164 @@ |
|||
<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.startDate }}</div> |
|||
</a-col> |
|||
<a-col :span="12"> |
|||
<div><span class="titleLabel">结束日期:</span>{{ detail.endDate }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">巡检部位:</span>{{ detail.inspectionPart }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">服务内容:</span>{{ detail.serviceContent }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">代码:</span>{{ detail.code }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">交付内容:</span>{{ detail.deliverContent }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">服务项目:</span>{{ detail.serviceProject }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
</a-tab-pane> |
|||
<a-tab-pane key="2" tab="处理信息"> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">是否异常:</span>{{ detail.isUnusual }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">处理结果:</span>{{ detail.handleResult }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">描述:</span>{{ detail.description }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">处理前图片:</span>{{ detail.beforeHandleImg }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">处理后图片:</span>{{ detail.AfterHandleImg }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
</a-tab-pane> |
|||
</a-tabs> |
|||
</a-drawer> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { reactive, ref } from 'vue'; |
|||
// import { getInfo } from './api'; |
|||
export default { |
|||
setup() { |
|||
//抽屉详情 |
|||
let detail = reactive({ |
|||
projectName: '', |
|||
contractName: '', |
|||
startDate: '', |
|||
endDate: '', |
|||
inspectionPart: '', |
|||
serviceContent: '', |
|||
code: '', |
|||
deliverContent: '', |
|||
serviceProject: '', |
|||
isUnusual: '', |
|||
handleResult: '', |
|||
description: '', |
|||
beforeHandleImg: '', |
|||
AfterHandleImg: '', |
|||
}); |
|||
|
|||
// 打开抽屉的方法 |
|||
const visible = ref(false); |
|||
// const showDrawer = async(id) => { |
|||
// const data = await getInfo(id) |
|||
// for(let i in detail){ |
|||
// detail[i] = data[i] |
|||
// } |
|||
// visible.value = true; |
|||
// console.log(detail) |
|||
// }; |
|||
const showDrawer = () => { |
|||
visible.value = true; |
|||
}; |
|||
// 关闭抽屉的方法 |
|||
const onClose = () => { |
|||
visible.value = false; |
|||
}; |
|||
const activeKey = ref('1'); |
|||
|
|||
return { |
|||
visible, |
|||
showDrawer, |
|||
onClose, |
|||
activeKey, |
|||
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,60 @@ |
|||
<template> |
|||
<PageWrapper dense> |
|||
<BasicTable @register="registerTable"> |
|||
<template #toolbar> |
|||
<a-button type="primary" @click="goDetail">上报</a-button> |
|||
</template> |
|||
<template #bodyCell="{ column, record }"> |
|||
<template v-if="column && record && column.key === 'action'"> </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 } from './api'; |
|||
import { formSchemas, columns } from './data'; |
|||
import detailDrawer from './detailDrawer.vue'; |
|||
import { ref } from 'vue'; |
|||
|
|||
defineOptions({ name: 'Patroling' }); |
|||
|
|||
const [registerTable] = useTable({ |
|||
rowSelection: { |
|||
type: 'checkbox', |
|||
}, |
|||
title: '全部列表', |
|||
api: list, |
|||
showIndexColumn: true, |
|||
rowKey: 'id', |
|||
useSearchForm: true, |
|||
formConfig: { |
|||
schemas: formSchemas, |
|||
name: 'allDelayPatrol', |
|||
baseColProps: { |
|||
xs: 24, |
|||
sm: 24, |
|||
md: 24, |
|||
lg: 6, |
|||
}, |
|||
}, |
|||
columns: columns, |
|||
actionColumn: { |
|||
width: 200, |
|||
title: '操作', |
|||
key: 'action', |
|||
fixed: 'right', |
|||
}, |
|||
}); |
|||
|
|||
//抽屉 |
|||
const detailDrawerRef = ref(); |
|||
const goDetail = () => { |
|||
detailDrawerRef.value.showDrawer(); |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped></style> |
@ -0,0 +1,58 @@ |
|||
import { ID, IDS, PageQuery, commonExport } from '@/api/base'; |
|||
import { defHttp } from '@/utils/http/axios'; |
|||
import { Dayjs } from 'dayjs'; |
|||
|
|||
enum Api { |
|||
root = '/workflow/leave', |
|||
list = '/workflow/leave/list', |
|||
export = '/workflow/leave/export', |
|||
} |
|||
|
|||
export interface Leave { |
|||
id: string; |
|||
leaveType: string; |
|||
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) { |
|||
return defHttp.get<Leave[]>({ url: Api.list, params }); |
|||
} |
|||
|
|||
export function exportExcel(data: any) { |
|||
return commonExport(Api.export, data); |
|||
} |
|||
|
|||
export function getInfo(id: ID) { |
|||
return defHttp.get<Leave>({ url: `${Api.root}/${id}` }); |
|||
} |
|||
|
|||
export function add(data: any) { |
|||
return defHttp.post<Resp>({ url: Api.root, data }); |
|||
} |
|||
|
|||
export function update(data: any) { |
|||
return defHttp.put<Resp>({ url: Api.root, data }); |
|||
} |
|||
|
|||
export function removeByIds(ids: IDS) { |
|||
return defHttp.deleteWithMsg<void>({ url: `${Api.root}/${ids.join(',')}` }); |
|||
} |
@ -0,0 +1,119 @@ |
|||
import { BasicColumn } from '@/components/Table'; |
|||
import { FormSchema } from '@/components/Form'; |
|||
|
|||
export const formSchemas: FormSchema[] = [ |
|||
{ |
|||
field: 'projectName', |
|||
label: '项目名称', |
|||
component: 'Select', |
|||
componentProps: { |
|||
options: [ |
|||
{ |
|||
value: '1', |
|||
label: '2323', |
|||
}, |
|||
{ |
|||
value: '2', |
|||
label: '2323', |
|||
}, |
|||
{ |
|||
value: '3', |
|||
label: '2323', |
|||
}, |
|||
], |
|||
}, |
|||
}, |
|||
{ |
|||
field: 'ioCompany', |
|||
label: '运维单位', |
|||
component: 'Select', |
|||
componentProps: { |
|||
options: [ |
|||
{ |
|||
value: '1', |
|||
label: '2323', |
|||
}, |
|||
{ |
|||
value: '2', |
|||
label: '2323', |
|||
}, |
|||
{ |
|||
value: '3', |
|||
label: '2323', |
|||
}, |
|||
], |
|||
}, |
|||
}, |
|||
{ |
|||
field: 'plaDate', |
|||
label: '计划日期', |
|||
component: 'RangePicker', |
|||
}, |
|||
{ |
|||
field: 'deliverContent', |
|||
label: '交付内容', |
|||
component: 'Input', |
|||
componentProps: { |
|||
placeholder: '请输入', |
|||
}, |
|||
}, |
|||
{ |
|||
field: 'serviceProject', |
|||
label: '服务项目', |
|||
component: 'Input', |
|||
componentProps: { |
|||
placeholder: '请输入', |
|||
}, |
|||
}, |
|||
{ |
|||
field: 'code', |
|||
label: '代码', |
|||
component: 'Input', |
|||
componentProps: { |
|||
placeholder: '请输入', |
|||
}, |
|||
}, |
|||
{ |
|||
field: 'serviceContent', |
|||
label: '服务内容', |
|||
component: 'Input', |
|||
componentProps: { |
|||
placeholder: '请输入', |
|||
}, |
|||
}, |
|||
]; |
|||
|
|||
export const columns: BasicColumn[] = [ |
|||
{ |
|||
title: '项目名称', |
|||
dataIndex: 'projectName', |
|||
}, |
|||
{ |
|||
title: '服务项目', |
|||
dataIndex: 'serviceProject', |
|||
}, |
|||
{ |
|||
title: '计划描述', |
|||
dataIndex: 'description', |
|||
}, |
|||
{ |
|||
title: '交付内容', |
|||
dataIndex: 'deliverContent', |
|||
}, |
|||
{ |
|||
title: '代码', |
|||
dataIndex: 'code', |
|||
}, |
|||
{ |
|||
title: '开始日期', |
|||
dataIndex: 'startDate', |
|||
}, |
|||
{ |
|||
title: '结束日期', |
|||
dataIndex: 'endDate', |
|||
}, |
|||
{ |
|||
title: '状态', |
|||
dataIndex: 'status', |
|||
}, |
|||
]; |
@ -0,0 +1,164 @@ |
|||
<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.startDate }}</div> |
|||
</a-col> |
|||
<a-col :span="12"> |
|||
<div><span class="titleLabel">结束日期:</span>{{ detail.endDate }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">巡检部位:</span>{{ detail.inspectionPart }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">服务内容:</span>{{ detail.serviceContent }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">代码:</span>{{ detail.code }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">交付内容:</span>{{ detail.deliverContent }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">服务项目:</span>{{ detail.serviceProject }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
</a-tab-pane> |
|||
<a-tab-pane key="2" tab="处理信息"> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">是否异常:</span>{{ detail.isUnusual }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">处理结果:</span>{{ detail.handleResult }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">描述:</span>{{ detail.description }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">处理前图片:</span>{{ detail.beforeHandleImg }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">处理后图片:</span>{{ detail.AfterHandleImg }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
</a-tab-pane> |
|||
</a-tabs> |
|||
</a-drawer> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { reactive, ref } from 'vue'; |
|||
|
|||
export default { |
|||
setup() { |
|||
//抽屉详情 |
|||
let detail = reactive({ |
|||
projectName: '', |
|||
contractName: '', |
|||
startDate: '', |
|||
endDate: '', |
|||
inspectionPart: '', |
|||
serviceContent: '', |
|||
code: '', |
|||
deliverContent: '', |
|||
serviceProject: '', |
|||
isUnusual: '', |
|||
handleResult: '', |
|||
description: '', |
|||
beforeHandleImg: '', |
|||
AfterHandleImg: '', |
|||
}); |
|||
|
|||
// 打开抽屉的方法 |
|||
const visible = ref(false); |
|||
// const showDrawer = async(id) => { |
|||
// const data = await getInfo(id) |
|||
// for(let i in detail){ |
|||
// detail[i] = data[i] |
|||
// } |
|||
// visible.value = true; |
|||
// console.log(detail) |
|||
// }; |
|||
const showDrawer = () => { |
|||
visible.value = true; |
|||
}; |
|||
// 关闭抽屉的方法 |
|||
const onClose = () => { |
|||
visible.value = false; |
|||
}; |
|||
const activeKey = ref('1'); |
|||
|
|||
return { |
|||
visible, |
|||
showDrawer, |
|||
onClose, |
|||
activeKey, |
|||
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,160 @@ |
|||
<template> |
|||
<PageWrapper dense> |
|||
<a-row> |
|||
<a-col :span="4" style="margin-top: 1%"> |
|||
<a-tree |
|||
:show-line="true" |
|||
:show-icon="true" |
|||
:default-expanded-keys="['0-0-0']" |
|||
:tree-data="treeData" |
|||
@select="onSelect" |
|||
> |
|||
<template #icon><carry-out-outlined /></template> |
|||
<template #title="{ dataRef }"> |
|||
<template v-if="dataRef.key === '0-0-0-1'"> |
|||
<div>multiple line title</div> |
|||
<div>multiple line title</div> |
|||
</template> |
|||
<template v-else>{{ dataRef.title }}</template> |
|||
</template> |
|||
<template #switcherIcon="{ dataRef, defaultIcon }"> |
|||
<SmileTwoTone v-if="dataRef.key === '0-0-2'" /> |
|||
<component :is="defaultIcon" v-else /> |
|||
</template> |
|||
</a-tree> |
|||
</a-col> |
|||
<a-col :span="20"> |
|||
<BasicTable @register="registerTable"> |
|||
<template #toolbar> |
|||
<a-button type="primary" @click="goDetail">上报</a-button> |
|||
</template> |
|||
<template #bodyCell="{ column, record }"> |
|||
<template v-if="column && record && column.key === 'action'"> </template> |
|||
</template> |
|||
</BasicTable> |
|||
<detailDrawer ref="detailDrawerRef" /> |
|||
</a-col> |
|||
</a-row> |
|||
</PageWrapper> |
|||
</template> |
|||
|
|||
<script setup lang="ts"> |
|||
import { PageWrapper } from '@/components/Page'; |
|||
import { BasicTable, useTable } from '@/components/Table'; |
|||
import { list } from './api'; |
|||
import { formSchemas, columns } from './data'; |
|||
import detailDrawer from './detailDrawer.vue'; |
|||
import { ref } from 'vue'; |
|||
|
|||
defineOptions({ name: 'Patroling' }); |
|||
|
|||
const [registerTable, { reload }] = useTable({ |
|||
rowSelection: { |
|||
type: 'checkbox', |
|||
}, |
|||
title: '待审核列表', |
|||
api: list, |
|||
showIndexColumn: true, |
|||
rowKey: 'id', |
|||
useSearchForm: true, |
|||
formConfig: { |
|||
schemas: formSchemas, |
|||
name: 'waitAudit', |
|||
baseColProps: { |
|||
xs: 24, |
|||
sm: 24, |
|||
md: 24, |
|||
lg: 6, |
|||
}, |
|||
}, |
|||
columns: columns, |
|||
actionColumn: { |
|||
width: 200, |
|||
title: '操作', |
|||
key: 'action', |
|||
fixed: 'right', |
|||
}, |
|||
}); |
|||
|
|||
//tree |
|||
const treeData = ref([ |
|||
{ |
|||
title: 'parent 1', |
|||
key: '0-0', |
|||
children: [ |
|||
{ |
|||
title: 'parent 1-0', |
|||
key: '0-0-0', |
|||
children: [ |
|||
{ |
|||
title: 'leaf', |
|||
key: '0-0-0-0', |
|||
}, |
|||
{ |
|||
key: '0-0-0-1', |
|||
}, |
|||
{ |
|||
title: 'leaf', |
|||
key: '0-0-0-2', |
|||
}, |
|||
], |
|||
}, |
|||
{ |
|||
title: 'parent 1-1', |
|||
key: '0-0-1', |
|||
children: [ |
|||
{ |
|||
title: 'leaf', |
|||
key: '0-0-1-0', |
|||
}, |
|||
], |
|||
}, |
|||
{ |
|||
title: 'parent 1-2', |
|||
key: '0-0-2', |
|||
children: [ |
|||
{ |
|||
title: 'leaf 1', |
|||
key: '0-0-2-0', |
|||
}, |
|||
{ |
|||
title: 'leaf 2', |
|||
key: '0-0-2-1', |
|||
}, |
|||
], |
|||
}, |
|||
], |
|||
}, |
|||
{ |
|||
title: 'parent 2', |
|||
key: '0-1', |
|||
children: [ |
|||
{ |
|||
title: 'parent 2-0', |
|||
key: '0-1-0', |
|||
children: [ |
|||
{ |
|||
title: 'leaf', |
|||
key: '0-1-0-0', |
|||
}, |
|||
{ |
|||
title: 'leaf', |
|||
key: '0-1-0-1', |
|||
}, |
|||
], |
|||
}, |
|||
], |
|||
}, |
|||
]); |
|||
const onSelect = (selectedKeys: any, info: any) => { |
|||
console.log('selected', selectedKeys, info); |
|||
reload(); |
|||
}; |
|||
//抽屉 |
|||
const detailDrawerRef = ref(); |
|||
const goDetail = () => { |
|||
detailDrawerRef.value.showDrawer(); |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped></style> |
@ -0,0 +1,58 @@ |
|||
import { ID, IDS, PageQuery, commonExport } from '@/api/base'; |
|||
import { defHttp } from '@/utils/http/axios'; |
|||
import { Dayjs } from 'dayjs'; |
|||
|
|||
enum Api { |
|||
root = '/workflow/leave', |
|||
list = '/workflow/leave/list', |
|||
export = '/workflow/leave/export', |
|||
} |
|||
|
|||
export interface Leave { |
|||
id: string; |
|||
leaveType: string; |
|||
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) { |
|||
return defHttp.get<Leave[]>({ url: Api.list, params }); |
|||
} |
|||
|
|||
export function exportExcel(data: any) { |
|||
return commonExport(Api.export, data); |
|||
} |
|||
|
|||
export function getInfo(id: ID) { |
|||
return defHttp.get<Leave>({ url: `${Api.root}/${id}` }); |
|||
} |
|||
|
|||
export function add(data: any) { |
|||
return defHttp.post<Resp>({ url: Api.root, data }); |
|||
} |
|||
|
|||
export function update(data: any) { |
|||
return defHttp.put<Resp>({ url: Api.root, data }); |
|||
} |
|||
|
|||
export function removeByIds(ids: IDS) { |
|||
return defHttp.deleteWithMsg<void>({ url: `${Api.root}/${ids.join(',')}` }); |
|||
} |
@ -0,0 +1,119 @@ |
|||
import { BasicColumn } from '@/components/Table'; |
|||
import { FormSchema } from '@/components/Form'; |
|||
|
|||
export const formSchemas: FormSchema[] = [ |
|||
{ |
|||
field: 'projectName', |
|||
label: '项目名称', |
|||
component: 'Select', |
|||
componentProps: { |
|||
options: [ |
|||
{ |
|||
value: '1', |
|||
label: '2323', |
|||
}, |
|||
{ |
|||
value: '2', |
|||
label: '2323', |
|||
}, |
|||
{ |
|||
value: '3', |
|||
label: '2323', |
|||
}, |
|||
], |
|||
}, |
|||
}, |
|||
{ |
|||
field: 'ioCompany', |
|||
label: '运维单位', |
|||
component: 'Select', |
|||
componentProps: { |
|||
options: [ |
|||
{ |
|||
value: '1', |
|||
label: '2323', |
|||
}, |
|||
{ |
|||
value: '2', |
|||
label: '2323', |
|||
}, |
|||
{ |
|||
value: '3', |
|||
label: '2323', |
|||
}, |
|||
], |
|||
}, |
|||
}, |
|||
{ |
|||
field: 'plaDate', |
|||
label: '计划日期', |
|||
component: 'RangePicker', |
|||
}, |
|||
{ |
|||
field: 'deliverContent', |
|||
label: '交付内容', |
|||
component: 'Input', |
|||
componentProps: { |
|||
placeholder: '请输入', |
|||
}, |
|||
}, |
|||
{ |
|||
field: 'serviceProject', |
|||
label: '服务项目', |
|||
component: 'Input', |
|||
componentProps: { |
|||
placeholder: '请输入', |
|||
}, |
|||
}, |
|||
{ |
|||
field: 'code', |
|||
label: '代码', |
|||
component: 'Input', |
|||
componentProps: { |
|||
placeholder: '请输入', |
|||
}, |
|||
}, |
|||
{ |
|||
field: 'serviceContent', |
|||
label: '服务内容', |
|||
component: 'Input', |
|||
componentProps: { |
|||
placeholder: '请输入', |
|||
}, |
|||
}, |
|||
]; |
|||
|
|||
export const columns: BasicColumn[] = [ |
|||
{ |
|||
title: '项目名称', |
|||
dataIndex: 'projectName', |
|||
}, |
|||
{ |
|||
title: '服务项目', |
|||
dataIndex: 'serviceProject', |
|||
}, |
|||
{ |
|||
title: '计划描述', |
|||
dataIndex: 'description', |
|||
}, |
|||
{ |
|||
title: '交付内容', |
|||
dataIndex: 'deliverContent', |
|||
}, |
|||
{ |
|||
title: '代码', |
|||
dataIndex: 'code', |
|||
}, |
|||
{ |
|||
title: '开始日期', |
|||
dataIndex: 'startDate', |
|||
}, |
|||
{ |
|||
title: '结束日期', |
|||
dataIndex: 'endDate', |
|||
}, |
|||
{ |
|||
title: '状态', |
|||
dataIndex: 'status', |
|||
}, |
|||
]; |
@ -0,0 +1,164 @@ |
|||
<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.startDate }}</div> |
|||
</a-col> |
|||
<a-col :span="12"> |
|||
<div><span class="titleLabel">结束日期:</span>{{ detail.endDate }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">巡检部位:</span>{{ detail.inspectionPart }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">服务内容:</span>{{ detail.serviceContent }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">代码:</span>{{ detail.code }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">交付内容:</span>{{ detail.deliverContent }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">服务项目:</span>{{ detail.serviceProject }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
</a-tab-pane> |
|||
<a-tab-pane key="2" tab="处理信息"> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">是否异常:</span>{{ detail.isUnusual }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">处理结果:</span>{{ detail.handleResult }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">描述:</span>{{ detail.description }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">处理前图片:</span>{{ detail.beforeHandleImg }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">处理后图片:</span>{{ detail.AfterHandleImg }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
</a-tab-pane> |
|||
</a-tabs> |
|||
</a-drawer> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { reactive, ref } from 'vue'; |
|||
// import { getInfo } from './api'; |
|||
export default { |
|||
setup() { |
|||
//抽屉详情 |
|||
let detail = reactive({ |
|||
projectName: '', |
|||
contractName: '', |
|||
startDate: '', |
|||
endDate: '', |
|||
inspectionPart: '', |
|||
serviceContent: '', |
|||
code: '', |
|||
deliverContent: '', |
|||
serviceProject: '', |
|||
isUnusual: '', |
|||
handleResult: '', |
|||
description: '', |
|||
beforeHandleImg: '', |
|||
AfterHandleImg: '', |
|||
}); |
|||
|
|||
// 打开抽屉的方法 |
|||
const visible = ref(false); |
|||
// const showDrawer = async(id) => { |
|||
// const data = await getInfo(id) |
|||
// for(let i in detail){ |
|||
// detail[i] = data[i] |
|||
// } |
|||
// visible.value = true; |
|||
// console.log(detail) |
|||
// }; |
|||
const showDrawer = () => { |
|||
visible.value = true; |
|||
}; |
|||
// 关闭抽屉的方法 |
|||
const onClose = () => { |
|||
visible.value = false; |
|||
}; |
|||
const activeKey = ref('1'); |
|||
|
|||
return { |
|||
visible, |
|||
showDrawer, |
|||
onClose, |
|||
activeKey, |
|||
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,60 @@ |
|||
<template> |
|||
<PageWrapper dense> |
|||
<BasicTable @register="registerTable"> |
|||
<template #toolbar> |
|||
<a-button type="primary" @click="goDetail">上报</a-button> |
|||
</template> |
|||
<template #bodyCell="{ column, record }"> |
|||
<template v-if="column && record && column.key === 'action'"> </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 } from './api'; |
|||
import { formSchemas, columns } from './data'; |
|||
import detailDrawer from './detailDrawer.vue'; |
|||
import { ref } from 'vue'; |
|||
|
|||
defineOptions({ name: 'Patroling' }); |
|||
|
|||
const [registerTable] = useTable({ |
|||
rowSelection: { |
|||
type: 'checkbox', |
|||
}, |
|||
title: '待巡检列表', |
|||
api: list, |
|||
showIndexColumn: true, |
|||
rowKey: 'id', |
|||
useSearchForm: true, |
|||
formConfig: { |
|||
schemas: formSchemas, |
|||
name: 'waitPatrol', |
|||
baseColProps: { |
|||
xs: 24, |
|||
sm: 24, |
|||
md: 24, |
|||
lg: 6, |
|||
}, |
|||
}, |
|||
columns: columns, |
|||
actionColumn: { |
|||
width: 200, |
|||
title: '操作', |
|||
key: 'action', |
|||
fixed: 'right', |
|||
}, |
|||
}); |
|||
|
|||
//抽屉 |
|||
const detailDrawerRef = ref(); |
|||
const goDetail = () => { |
|||
detailDrawerRef.value.showDrawer(); |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped></style> |
@ -0,0 +1,58 @@ |
|||
import { ID, IDS, PageQuery, commonExport } from '@/api/base'; |
|||
import { defHttp } from '@/utils/http/axios'; |
|||
import { Dayjs } from 'dayjs'; |
|||
|
|||
enum Api { |
|||
root = '/workflow/leave', |
|||
list = '/workflow/leave/list', |
|||
export = '/workflow/leave/export', |
|||
} |
|||
|
|||
export interface Leave { |
|||
id: string; |
|||
leaveType: string; |
|||
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) { |
|||
return defHttp.get<Leave[]>({ url: Api.list, params }); |
|||
} |
|||
|
|||
export function exportExcel(data: any) { |
|||
return commonExport(Api.export, data); |
|||
} |
|||
|
|||
export function getInfo(id: ID) { |
|||
return defHttp.get<Leave>({ url: `${Api.root}/${id}` }); |
|||
} |
|||
|
|||
export function add(data: any) { |
|||
return defHttp.post<Resp>({ url: Api.root, data }); |
|||
} |
|||
|
|||
export function update(data: any) { |
|||
return defHttp.put<Resp>({ url: Api.root, data }); |
|||
} |
|||
|
|||
export function removeByIds(ids: IDS) { |
|||
return defHttp.deleteWithMsg<void>({ url: `${Api.root}/${ids.join(',')}` }); |
|||
} |
@ -0,0 +1,87 @@ |
|||
import { BasicColumn } from '@/components/Table'; |
|||
import { FormSchema } from '@/components/Form'; |
|||
|
|||
export const formSchemas: FormSchema[] = [ |
|||
{ |
|||
field: 'projectName', |
|||
label: '项目名称', |
|||
component: 'Select', |
|||
componentProps: { |
|||
options: [ |
|||
{ |
|||
value: '1', |
|||
label: '2323', |
|||
}, |
|||
{ |
|||
value: '2', |
|||
label: '2323', |
|||
}, |
|||
{ |
|||
value: '3', |
|||
label: '2323', |
|||
}, |
|||
], |
|||
}, |
|||
}, |
|||
{ |
|||
field: 'ioCompany', |
|||
label: '运维单位', |
|||
component: 'Select', |
|||
componentProps: { |
|||
options: [ |
|||
{ |
|||
value: '1', |
|||
label: '2323', |
|||
}, |
|||
{ |
|||
value: '2', |
|||
label: '2323', |
|||
}, |
|||
{ |
|||
value: '3', |
|||
label: '2323', |
|||
}, |
|||
], |
|||
}, |
|||
}, |
|||
{ |
|||
field: 'plaDate', |
|||
label: '计划日期', |
|||
component: 'RangePicker', |
|||
}, |
|||
]; |
|||
|
|||
export const columns: BasicColumn[] = [ |
|||
{ |
|||
title: '合同名称', |
|||
dataIndex: 'contractName', |
|||
}, |
|||
{ |
|||
title: '项目名称', |
|||
dataIndex: 'projectName', |
|||
}, |
|||
{ |
|||
title: '计划描述', |
|||
dataIndex: 'description', |
|||
}, |
|||
{ |
|||
title: '开始日期', |
|||
dataIndex: 'startDate', |
|||
}, |
|||
{ |
|||
title: '结束日期', |
|||
dataIndex: 'endDate', |
|||
}, |
|||
{ |
|||
title: '频次', |
|||
dataIndex: 'frequency', |
|||
}, |
|||
{ |
|||
title: '状态', |
|||
dataIndex: 'status', |
|||
}, |
|||
{ |
|||
title: '完成情况', |
|||
dataIndex: 'progress', |
|||
}, |
|||
]; |
@ -0,0 +1,152 @@ |
|||
<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="24"> |
|||
<div><span class="titleLabel">运维单位:</span>{{ detail.ioCompany }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="12"> |
|||
<div><span class="titleLabel">开始日期:</span>{{ detail.startDate }}</div> |
|||
</a-col> |
|||
<a-col :span="12"> |
|||
<div><span class="titleLabel">结束日期:</span>{{ detail.endDate }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="12"> |
|||
<div><span class="titleLabel">频次:</span>{{ detail.frequency }}</div> |
|||
</a-col> |
|||
<a-col :span="12"> |
|||
<div><span class="titleLabel">完成情况:</span>{{ detail.progress }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">计划描述:</span>{{ detail.description }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
</a-tab-pane> |
|||
<a-tab-pane key="2" tab="完成情况"> |
|||
<a-table :dataSource="finishStatus" :columns="finishColumns" bordered /> |
|||
</a-tab-pane> |
|||
</a-tabs> |
|||
</a-drawer> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { reactive, ref } from 'vue'; |
|||
// import { getInfo } from './allPatrolapi'; |
|||
export default { |
|||
setup() { |
|||
//抽屉详情 |
|||
let detail = reactive({ |
|||
projectName: '', |
|||
contractName: '', |
|||
ioCompany: '', |
|||
startDate: '', |
|||
endDate: '', |
|||
frequency: null, |
|||
progress: '', |
|||
description: '', |
|||
}); |
|||
const finishStatus = ref([]); |
|||
const finishColumns = [ |
|||
{ |
|||
title: '开始日期', |
|||
dataIndex: 'startDate', |
|||
key: 'startDate', |
|||
}, |
|||
{ |
|||
title: '结束日期', |
|||
dataIndex: 'endDate', |
|||
key: 'endDate', |
|||
}, |
|||
{ |
|||
title: '状态', |
|||
dataIndex: 'status', |
|||
key: 'status', |
|||
}, |
|||
{ |
|||
title: '完成日期', |
|||
dataIndex: 'finishDate', |
|||
key: 'finishDate ', |
|||
}, |
|||
]; |
|||
|
|||
// 打开抽屉的方法 |
|||
const visible = ref(false); |
|||
// const showDrawer = async(id) => { |
|||
// const data = await getInfo(id) |
|||
// for(let i in detail){ |
|||
// detail[i] = data[i] |
|||
// } |
|||
// visible.value = true; |
|||
// console.log(detail) |
|||
// }; |
|||
const showDrawer = () => { |
|||
visible.value = true; |
|||
}; |
|||
// 关闭抽屉的方法 |
|||
const onClose = () => { |
|||
visible.value = false; |
|||
}; |
|||
const activeKey = ref('1'); |
|||
|
|||
return { |
|||
visible, |
|||
showDrawer, |
|||
onClose, |
|||
activeKey, |
|||
finishStatus, |
|||
finishColumns, |
|||
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,152 @@ |
|||
<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="24"> |
|||
<div><span class="titleLabel">运维单位:</span>{{ detail.ioCompany }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="12"> |
|||
<div><span class="titleLabel">开始日期:</span>{{ detail.startDate }}</div> |
|||
</a-col> |
|||
<a-col :span="12"> |
|||
<div><span class="titleLabel">结束日期:</span>{{ detail.endDate }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="12"> |
|||
<div><span class="titleLabel">频次:</span>{{ detail.frequency }}</div> |
|||
</a-col> |
|||
<a-col :span="12"> |
|||
<div><span class="titleLabel">完成情况:</span>{{ detail.progress }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">计划描述:</span>{{ detail.description }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
</a-tab-pane> |
|||
<a-tab-pane key="2" tab="完成情况"> |
|||
<a-table :dataSource="finishStatus" :columns="finishColumns" bordered /> |
|||
</a-tab-pane> |
|||
</a-tabs> |
|||
</a-drawer> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { reactive, ref } from 'vue'; |
|||
// import { getInfo } from './api'; |
|||
export default { |
|||
setup() { |
|||
//抽屉详情 |
|||
let detail = reactive({ |
|||
projectName: '', |
|||
contractName: '', |
|||
ioCompany: '', |
|||
startDate: '', |
|||
endDate: '', |
|||
frequency: null, |
|||
progress: '', |
|||
description: '', |
|||
}); |
|||
const finishStatus = ref([]); |
|||
const finishColumns = [ |
|||
{ |
|||
title: '开始日期', |
|||
dataIndex: 'startDate', |
|||
key: 'startDate', |
|||
}, |
|||
{ |
|||
title: '结束日期', |
|||
dataIndex: 'endDate', |
|||
key: 'endDate', |
|||
}, |
|||
{ |
|||
title: '状态', |
|||
dataIndex: 'status', |
|||
key: 'status', |
|||
}, |
|||
{ |
|||
title: '完成日期', |
|||
dataIndex: 'finishDate', |
|||
key: 'finishDate ', |
|||
}, |
|||
]; |
|||
|
|||
// 打开抽屉的方法 |
|||
const visible = ref(false); |
|||
// const showDrawer = async(id) => { |
|||
// const data = await getInfo(id) |
|||
// for(let i in detail){ |
|||
// detail[i] = data[i] |
|||
// } |
|||
// visible.value = true; |
|||
// console.log(detail) |
|||
// }; |
|||
const showDrawer = () => { |
|||
visible.value = true; |
|||
}; |
|||
// 关闭抽屉的方法 |
|||
const onClose = () => { |
|||
visible.value = false; |
|||
}; |
|||
const activeKey = ref('1'); |
|||
|
|||
return { |
|||
visible, |
|||
showDrawer, |
|||
onClose, |
|||
activeKey, |
|||
finishStatus, |
|||
finishColumns, |
|||
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,58 @@ |
|||
import { ID, IDS, PageQuery, commonExport } from '@/api/base'; |
|||
import { defHttp } from '@/utils/http/axios'; |
|||
import { Dayjs } from 'dayjs'; |
|||
|
|||
enum Api { |
|||
root = '/workflow/leave', |
|||
list = '/workflow/leave/list', |
|||
export = '/workflow/leave/export', |
|||
} |
|||
|
|||
export interface Leave { |
|||
id: string; |
|||
leaveType: string; |
|||
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) { |
|||
return defHttp.get<Leave[]>({ url: Api.list, params }); |
|||
} |
|||
|
|||
export function exportExcel(data: any) { |
|||
return commonExport(Api.export, data); |
|||
} |
|||
|
|||
export function getInfo(id: ID) { |
|||
return defHttp.get<Leave>({ url: `${Api.root}/${id}` }); |
|||
} |
|||
|
|||
export function add(data: any) { |
|||
return defHttp.post<Resp>({ url: Api.root, data }); |
|||
} |
|||
|
|||
export function update(data: any) { |
|||
return defHttp.put<Resp>({ url: Api.root, data }); |
|||
} |
|||
|
|||
export function removeByIds(ids: IDS) { |
|||
return defHttp.deleteWithMsg<void>({ url: `${Api.root}/${ids.join(',')}` }); |
|||
} |
@ -0,0 +1,64 @@ |
|||
<template> |
|||
<PageWrapper dense> |
|||
<BasicTable @register="registerTable"> |
|||
<template #toolbar> |
|||
<a-button type="primary" @click="handleAdd(1)">新增前端日报</a-button> |
|||
<a-button type="primary" @click="handleAdd(2)">新增后端日报</a-button> |
|||
<a-button type="primary" @click="handleAdd">编辑</a-button> |
|||
<a-button type="primary" @click="handleAdd">删除</a-button> |
|||
<a-button type="primary" @click="handleAdd">同步日常巡检</a-button> |
|||
<a-button type="primary" @click="handleAdd">日报资料导出</a-button> |
|||
</template> |
|||
<template #bodyCell="{ column, record }"> |
|||
<template v-if="column && record && column.key === 'action'"> </template> |
|||
</template> |
|||
</BasicTable> |
|||
<reportModal ref="reportModalRef" /> |
|||
</PageWrapper> |
|||
</template> |
|||
|
|||
<script setup lang="ts"> |
|||
import { PageWrapper } from '@/components/Page'; |
|||
import { BasicTable, useTable } from '@/components/Table'; |
|||
import { list } from './api'; |
|||
import { formSchemas, columns } from './patrolReportdata'; |
|||
import reportModal from './reportModal.vue'; |
|||
import { ref } from 'vue'; |
|||
|
|||
defineOptions({ name: 'PatrolReport' }); |
|||
const [registerTable] = useTable({ |
|||
rowSelection: { |
|||
type: 'checkbox', |
|||
}, |
|||
title: '巡检日报', |
|||
api: list, |
|||
showIndexColumn: true, |
|||
rowKey: 'id', |
|||
useSearchForm: true, |
|||
formConfig: { |
|||
schemas: formSchemas, |
|||
name: 'patrolReport', |
|||
baseColProps: { |
|||
xs: 24, |
|||
sm: 24, |
|||
md: 24, |
|||
lg: 6, |
|||
}, |
|||
}, |
|||
columns: columns, |
|||
actionColumn: { |
|||
width: 200, |
|||
title: '操作', |
|||
key: 'action', |
|||
fixed: 'right', |
|||
}, |
|||
}); |
|||
|
|||
//弹窗 |
|||
const reportModalRef = ref(); |
|||
const handleAdd = (type: any) => { |
|||
reportModalRef.value.showModal(type); |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped></style> |
@ -0,0 +1,57 @@ |
|||
import { BasicColumn } from '@/components/Table'; |
|||
import { FormSchema } from '@/components/Form'; |
|||
|
|||
export const columns: BasicColumn[] = [ |
|||
{ |
|||
title: '项目名称', |
|||
dataIndex: 'projectName', |
|||
}, |
|||
{ |
|||
title: '巡检单位', |
|||
dataIndex: 'inspectionUnit', |
|||
}, |
|||
{ |
|||
title: '类型', |
|||
dataIndex: 'type', |
|||
}, |
|||
{ |
|||
title: '巡检时间', |
|||
dataIndex: 'inspectionTime', |
|||
}, |
|||
{ |
|||
title: '巡检人员', |
|||
dataIndex: 'inspectionPeople', |
|||
}, |
|||
]; |
|||
|
|||
export const formSchemas: FormSchema[] = [ |
|||
{ |
|||
field: 'projectName', |
|||
label: '项目名称', |
|||
component: 'Select', |
|||
componentProps: { |
|||
options: [ |
|||
{ |
|||
value: '1', |
|||
label: '2323', |
|||
}, |
|||
{ |
|||
value: '2', |
|||
label: '2323', |
|||
}, |
|||
{ |
|||
value: '3', |
|||
label: '2323', |
|||
}, |
|||
], |
|||
}, |
|||
}, |
|||
{ |
|||
field: 'inspectionPeople', |
|||
label: '巡检人员', |
|||
component: 'Input', |
|||
componentProps: { |
|||
placeholder: '输入巡检人员', |
|||
}, |
|||
}, |
|||
]; |
@ -0,0 +1,200 @@ |
|||
<template> |
|||
<a-modal v-model:open="visible" :title="title" @ok="handleOk" width="50%"> |
|||
<a-form :model="form" layout="vertical"> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="项目名称" name="projectName"> |
|||
<a-select |
|||
v-model:value="form.projectName" |
|||
:options="projectNameOptions" |
|||
placeholder="请选择" |
|||
/> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="巡检部位" name="inspectionPart"> |
|||
<a-input v-model:value="form.inspectionPart" placeholder="请输入" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="巡检时间" name="inspectionTime"> |
|||
<a-date-picker |
|||
:show-time="{ format: 'HH:mm:ss' }" |
|||
v-model:value="form.inspectionTime" |
|||
placeholder="请选择" |
|||
/> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<div v-if="title != '新增后端巡查日报'"> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="平台在线率" name="platformOnlineRate"> |
|||
<a-input v-model:value="form.platformOnlineRate" placeholder="请输入" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="巡检情况" name="inspectionStatus"> |
|||
<a-textarea v-model:value="form.inspectionStatus" :rows="4" placeholder="请输入" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="问题处理" name="problemHandleDesc"> |
|||
<a-textarea v-model:value="form.problemHandleDesc" :rows="4" placeholder="请输入" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
</div> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="附件" name="attachment"> |
|||
<a-upload |
|||
v-model:file-list="attachmentList" |
|||
action="https://www.mocky.io/v2/5cc8019d300000980a055e76" |
|||
> |
|||
<a-button> Upload </a-button> |
|||
</a-upload> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="巡检照片" name="inspectionPhoto"> |
|||
<a-upload |
|||
v-model:file-list="inspectionPhotoList" |
|||
action="https://www.mocky.io/v2/5cc8019d300000980a055e76" |
|||
> |
|||
<a-button> Upload </a-button> |
|||
</a-upload> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<div v-if="title == '新增后端巡查日报'"> |
|||
<a-table :dataSource="inspectionReportTable" :columns="inspectionReportColumns" bordered> |
|||
<template #bodyCell="{ column }"> |
|||
<template v-if="column.key === 'action'"> |
|||
<a-button type="link">查看</a-button> |
|||
</template> |
|||
</template> |
|||
</a-table> |
|||
</div> |
|||
</a-form> |
|||
</a-modal> |
|||
</template> |
|||
|
|||
<script> |
|||
import { reactive, ref } from 'vue'; |
|||
|
|||
export default { |
|||
setup() { |
|||
//文件列表 |
|||
const title = ref('新增前端巡检日报'); |
|||
const attachmentList = ref([]); |
|||
const inspectionPhotoList = ref([]); |
|||
const visible = ref(false); |
|||
const form = reactive({ |
|||
projectName: '', |
|||
inspectionPart: '', |
|||
inspectionTime: '', |
|||
platformOnlineRate: null, |
|||
problemHandleDesc: '', |
|||
inspectionStatus: null, |
|||
attachment: '', |
|||
inspectionPhoto: '', |
|||
}); |
|||
//弹窗列表 |
|||
const inspectionReportTable = ref([]); |
|||
const inspectionReportColumns = [ |
|||
{ |
|||
title: '设备地址', |
|||
dataIndex: 'deviceLocation', |
|||
key: 'deviceLocation', |
|||
}, |
|||
{ |
|||
title: '设备名称', |
|||
dataIndex: 'deviceName', |
|||
key: 'deviceName', |
|||
}, |
|||
{ |
|||
title: '型号', |
|||
dataIndex: 'type', |
|||
key: 'type', |
|||
}, |
|||
{ |
|||
title: 'IP地址', |
|||
dataIndex: 'ip', |
|||
key: 'ip', |
|||
}, |
|||
{ |
|||
title: '检查结果', |
|||
dataIndex: 'inspectionResult', |
|||
key: 'inspectionResult', |
|||
}, |
|||
{ |
|||
title: '详细记录', |
|||
dataIndex: 'detailLog', |
|||
key: 'detailLog', |
|||
}, |
|||
]; |
|||
//下拉框 |
|||
const projectNameOptions = [ |
|||
{ |
|||
value: '1', |
|||
label: 'a', |
|||
}, |
|||
{ |
|||
value: '2', |
|||
label: 'b', |
|||
}, |
|||
{ |
|||
value: '3', |
|||
label: 'c', |
|||
}, |
|||
]; |
|||
const showModal = (type, id) => { |
|||
if (type == 1) { |
|||
title.value = '新增前端巡查日报'; |
|||
} else if (type == 2) { |
|||
title.value = '新增后端巡查日报'; |
|||
console.log(id); |
|||
} |
|||
visible.value = true; |
|||
}; |
|||
|
|||
const handleOk = () => { |
|||
console.log('Form Data:', form); |
|||
// 在此处可以添加表单验证逻辑 |
|||
visible.value = false; |
|||
}; |
|||
|
|||
return { |
|||
visible, |
|||
title, |
|||
form, |
|||
showModal, |
|||
handleOk, |
|||
attachmentList, |
|||
inspectionPhotoList, |
|||
projectNameOptions, |
|||
inspectionReportTable, |
|||
inspectionReportColumns, |
|||
}; |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped> |
|||
/* 可选样式调整 */ |
|||
.ant-modal-body { |
|||
max-width: 600px; |
|||
margin: 0 auto; |
|||
} |
|||
</style> |
@ -1,58 +1,32 @@ |
|||
import { ID, IDS, PageQuery, commonExport } from '@/api/base'; |
|||
import { PageQuery, commonExport } from '@/api/base'; |
|||
import { defHttp } from '@/utils/http/axios'; |
|||
import { Dayjs } from 'dayjs'; |
|||
|
|||
enum Api { |
|||
root = '/workflow/leave', |
|||
list = '/workflow/leave/list', |
|||
root = '/platform/workOrder', |
|||
list = '/platform/workOrder/list', |
|||
export = '/workflow/leave/export', |
|||
} |
|||
|
|||
export interface Leave { |
|||
id: string; |
|||
leaveType: string; |
|||
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) { |
|||
return defHttp.get<Leave[]>({ url: Api.list, params }); |
|||
return defHttp.get({ url: Api.list, params }); |
|||
} |
|||
|
|||
export function exportExcel(data: any) { |
|||
return commonExport(Api.export, data); |
|||
} |
|||
|
|||
export function getInfo(id: ID) { |
|||
return defHttp.get<Leave>({ url: `${Api.root}/${id}` }); |
|||
export function getInfo(id: any) { |
|||
return defHttp.get({ url: `${Api.root}/${id}` }); |
|||
} |
|||
|
|||
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) { |
|||
return defHttp.put<Resp>({ url: Api.root, data }); |
|||
return defHttp.put({ url: Api.root, data }); |
|||
} |
|||
|
|||
export function removeByIds(ids: IDS) { |
|||
return defHttp.deleteWithMsg<void>({ url: `${Api.root}/${ids.join(',')}` }); |
|||
export function removeByIds(ids: any) { |
|||
return defHttp.deleteWithMsg({ url: `${Api.root}/${ids.join(',')}` }); |
|||
} |
|||
|
@ -1,58 +1,32 @@ |
|||
import { ID, IDS, PageQuery, commonExport } from '@/api/base'; |
|||
import { PageQuery, commonExport } from '@/api/base'; |
|||
import { defHttp } from '@/utils/http/axios'; |
|||
import { Dayjs } from 'dayjs'; |
|||
|
|||
enum Api { |
|||
root = '/workflow/leave', |
|||
list = '/workflow/leave/list', |
|||
root = '/platform/workOrder', |
|||
list = '/platform/workOrder/list', |
|||
export = '/workflow/leave/export', |
|||
} |
|||
|
|||
export interface Leave { |
|||
id: string; |
|||
leaveType: string; |
|||
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) { |
|||
return defHttp.get<Leave[]>({ url: Api.list, params }); |
|||
return defHttp.get({ url: Api.list, params }); |
|||
} |
|||
|
|||
export function exportExcel(data: any) { |
|||
return commonExport(Api.export, data); |
|||
} |
|||
|
|||
export function getInfo(id: ID) { |
|||
return defHttp.get<Leave>({ url: `${Api.root}/${id}` }); |
|||
export function getInfo(id: any) { |
|||
return defHttp.get({ url: `${Api.root}/${id}` }); |
|||
} |
|||
|
|||
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) { |
|||
return defHttp.put<Resp>({ url: Api.root, data }); |
|||
return defHttp.put({ url: Api.root, data }); |
|||
} |
|||
|
|||
export function removeByIds(ids: IDS) { |
|||
return defHttp.deleteWithMsg<void>({ url: `${Api.root}/${ids.join(',')}` }); |
|||
export function removeByIds(ids: any) { |
|||
return defHttp.deleteWithMsg({ url: `${Api.root}/${ids.join(',')}` }); |
|||
} |
|||
|
@ -0,0 +1,119 @@ |
|||
<template> |
|||
<a-modal v-model:open="visible" :title="title" @ok="handleOk" width="50%"> |
|||
<a-form :model="form" layout="vertical"> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="名称" name="name"> |
|||
<a-input v-model:value="form.name" placeholder="请输入" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="状态" name="status"> |
|||
<a-select v-model:value="form.status" :options="statusOptions" placeholder="请选择" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="规格" name="standards"> |
|||
<a-input v-model:value="form.standards" placeholder="请输入" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="单价(元)" name="price"> |
|||
<a-input v-model:value="form.price" placeholder="请输入" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="数量" name="amount"> |
|||
<a-input v-model:value="form.amount" placeholder="请输入" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="单位" name="unit"> |
|||
<a-input v-model:value="form.unit" placeholder="请输入" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="备注" name="remark"> |
|||
<a-textarea v-model:value="form.remark" :rows="4" placeholder="请输入" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
</a-form> |
|||
</a-modal> |
|||
</template> |
|||
|
|||
<script> |
|||
import { reactive, ref } from 'vue'; |
|||
|
|||
export default { |
|||
setup() { |
|||
//文件列表 |
|||
const title = ref('新增'); |
|||
const visible = ref(false); |
|||
const form = reactive({ |
|||
name: '', |
|||
status: null, |
|||
remark: '', |
|||
unit: '', |
|||
price: '', |
|||
amount: '', |
|||
standards: '', |
|||
}); |
|||
//下拉框 |
|||
const statusOptions = [ |
|||
{ |
|||
value: 0, |
|||
label: '禁用', |
|||
}, |
|||
{ |
|||
value: 1, |
|||
label: '启用', |
|||
}, |
|||
]; |
|||
const showModal = (type, id) => { |
|||
if (type == 1) { |
|||
title.value = '新增'; |
|||
} else if (type == 2) { |
|||
title.value = '编辑'; |
|||
console.log(id); |
|||
} |
|||
visible.value = true; |
|||
}; |
|||
|
|||
const handleOk = () => { |
|||
console.log('Form Data:', form); |
|||
// 在此处可以添加表单验证逻辑 |
|||
visible.value = false; |
|||
}; |
|||
|
|||
return { |
|||
visible, |
|||
title, |
|||
form, |
|||
showModal, |
|||
handleOk, |
|||
statusOptions, |
|||
}; |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped> |
|||
/* 可选样式调整 */ |
|||
.ant-modal-body { |
|||
max-width: 600px; |
|||
margin: 0 auto; |
|||
} |
|||
</style> |
@ -0,0 +1,58 @@ |
|||
import { ID, IDS, PageQuery, commonExport } from '@/api/base'; |
|||
import { defHttp } from '@/utils/http/axios'; |
|||
import { Dayjs } from 'dayjs'; |
|||
|
|||
enum Api { |
|||
root = '/workflow/leave', |
|||
list = '/workflow/leave/list', |
|||
export = '/workflow/leave/export', |
|||
} |
|||
|
|||
export interface Leave { |
|||
id: string; |
|||
leaveType: string; |
|||
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) { |
|||
return defHttp.get<Leave[]>({ url: Api.list, params }); |
|||
} |
|||
|
|||
export function exportExcel(data: any) { |
|||
return commonExport(Api.export, data); |
|||
} |
|||
|
|||
export function getInfo(id: ID) { |
|||
return defHttp.get<Leave>({ url: `${Api.root}/${id}` }); |
|||
} |
|||
|
|||
export function add(data: any) { |
|||
return defHttp.post<Resp>({ url: Api.root, data }); |
|||
} |
|||
|
|||
export function update(data: any) { |
|||
return defHttp.put<Resp>({ url: Api.root, data }); |
|||
} |
|||
|
|||
export function removeByIds(ids: IDS) { |
|||
return defHttp.deleteWithMsg<void>({ url: `${Api.root}/${ids.join(',')}` }); |
|||
} |
@ -0,0 +1,48 @@ |
|||
import { BasicColumn } from '@/components/Table'; |
|||
import { FormSchema } from '@/components/Form'; |
|||
|
|||
export const formSchemas: FormSchema[] = [ |
|||
{ |
|||
field: 'name', |
|||
label: '名称', |
|||
component: 'Input', |
|||
componentProps: { |
|||
placeholder: '请输入', |
|||
}, |
|||
}, |
|||
]; |
|||
|
|||
export const columns: BasicColumn[] = [ |
|||
{ |
|||
title: '名称', |
|||
dataIndex: 'name', |
|||
}, |
|||
{ |
|||
title: '规格', |
|||
dataIndex: 'standards', |
|||
}, |
|||
{ |
|||
title: '单价(元)', |
|||
dataIndex: 'price', |
|||
}, |
|||
{ |
|||
title: '数量', |
|||
dataIndex: 'amount', |
|||
}, |
|||
{ |
|||
title: '单位', |
|||
dataIndex: 'unit', |
|||
}, |
|||
{ |
|||
title: '状态', |
|||
dataIndex: 'status', |
|||
}, |
|||
{ |
|||
title: '创建日期', |
|||
dataIndex: 'createDate', |
|||
}, |
|||
{ |
|||
title: '备注', |
|||
dataIndex: 'remark', |
|||
}, |
|||
]; |
@ -0,0 +1,171 @@ |
|||
<template> |
|||
<PageWrapper dense> |
|||
<a-row> |
|||
<a-col :span="4" style="margin-top: 1%"> |
|||
<a-tree |
|||
:show-line="true" |
|||
:show-icon="true" |
|||
:depoint-expanded-keys="['0-0-0']" |
|||
:tree-data="treeData" |
|||
@select="onSelect" |
|||
> |
|||
<template #icon><carry-out-outlined /></template> |
|||
<template #title="{ dataRef }"> |
|||
<template v-if="dataRef.key === '0-0-0-1'"> |
|||
<div>multiple line title</div> |
|||
<div>multiple line title</div> |
|||
</template> |
|||
<template v-else>{{ dataRef.title }}</template> |
|||
</template> |
|||
<template #switcherIcon="{ dataRef, depointIcon }"> |
|||
<SmileTwoTone v-if="dataRef.key === '0-0-2'" /> |
|||
<component :is="depointIcon" v-else /> |
|||
</template> |
|||
</a-tree> |
|||
</a-col> |
|||
<a-col :span="20"> |
|||
<BasicTable @register="registerTable"> |
|||
<template #toolbar> |
|||
<a-button type="primary" @click="handleAdd">新增</a-button> |
|||
<a-button type="primary" @click="handleAdd">导入</a-button> |
|||
<a-button type="primary" @click="handleAdd">导出</a-button> |
|||
</template> |
|||
<template #bodyCell="{ column, record }"> |
|||
<template v-if="column && record && column.key === 'action'"> |
|||
<a-button type="link" @click="handleEdit(record.id)">编辑</a-button> |
|||
<a-button type="link" @click="handleDelete(record.id)">删除</a-button> |
|||
<a-button type="link" @click="handleEdit(record.id)">禁用/启用</a-button> |
|||
</template> |
|||
</template> |
|||
</BasicTable> |
|||
<addModal ref="addModalRef" /> |
|||
</a-col> |
|||
</a-row> |
|||
</PageWrapper> |
|||
</template> |
|||
|
|||
<script setup lang="ts"> |
|||
import { PageWrapper } from '@/components/Page'; |
|||
import { BasicTable, useTable } from '@/components/Table'; |
|||
import { list } from './api'; |
|||
import { formSchemas, columns } from './data'; |
|||
import addModal from './addModal.vue'; |
|||
import { ref } from 'vue'; |
|||
|
|||
defineOptions({ name: 'Meterial' }); |
|||
|
|||
const [registerTable, { reload }] = useTable({ |
|||
rowSelection: { |
|||
type: 'checkbox', |
|||
}, |
|||
title: '材料库', |
|||
api: list, |
|||
showIndexColumn: true, |
|||
rowKey: 'id', |
|||
useSearchForm: true, |
|||
formConfig: { |
|||
schemas: formSchemas, |
|||
name: 'meterial', |
|||
baseColProps: { |
|||
xs: 24, |
|||
sm: 24, |
|||
md: 24, |
|||
lg: 6, |
|||
}, |
|||
}, |
|||
columns: columns, |
|||
actionColumn: { |
|||
width: 200, |
|||
title: '操作', |
|||
key: 'action', |
|||
fixed: 'right', |
|||
}, |
|||
}); |
|||
//新增编辑弹窗 |
|||
const addModalRef = ref(); |
|||
const handleAdd = () => { |
|||
addModalRef.value.showModal(1); |
|||
}; |
|||
const handleEdit = (id: any) => { |
|||
addModalRef.value.showModal(2, id); |
|||
}; |
|||
const handleDelete = (id: any) => { |
|||
addModalRef.value.showModal(2, id); |
|||
}; |
|||
//tree |
|||
const treeData = ref([ |
|||
{ |
|||
title: 'parent 1', |
|||
key: '0-0', |
|||
children: [ |
|||
{ |
|||
title: 'parent 1-0', |
|||
key: '0-0-0', |
|||
children: [ |
|||
{ |
|||
title: 'leaf', |
|||
key: '0-0-0-0', |
|||
}, |
|||
{ |
|||
key: '0-0-0-1', |
|||
}, |
|||
{ |
|||
title: 'leaf', |
|||
key: '0-0-0-2', |
|||
}, |
|||
], |
|||
}, |
|||
{ |
|||
title: 'parent 1-1', |
|||
key: '0-0-1', |
|||
children: [ |
|||
{ |
|||
title: 'leaf', |
|||
key: '0-0-1-0', |
|||
}, |
|||
], |
|||
}, |
|||
{ |
|||
title: 'parent 1-2', |
|||
key: '0-0-2', |
|||
children: [ |
|||
{ |
|||
title: 'leaf 1', |
|||
key: '0-0-2-0', |
|||
}, |
|||
{ |
|||
title: 'leaf 2', |
|||
key: '0-0-2-1', |
|||
}, |
|||
], |
|||
}, |
|||
], |
|||
}, |
|||
{ |
|||
title: 'parent 2', |
|||
key: '0-1', |
|||
children: [ |
|||
{ |
|||
title: 'parent 2-0', |
|||
key: '0-1-0', |
|||
children: [ |
|||
{ |
|||
title: 'leaf', |
|||
key: '0-1-0-0', |
|||
}, |
|||
{ |
|||
title: 'leaf', |
|||
key: '0-1-0-1', |
|||
}, |
|||
], |
|||
}, |
|||
], |
|||
}, |
|||
]); |
|||
const onSelect = (selectedKeys: any, info: any) => { |
|||
console.log('selected', selectedKeys, info); |
|||
reload(); |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped></style> |
@ -0,0 +1,123 @@ |
|||
<template> |
|||
<a-modal v-model:open="visible" :title="title" @ok="handleOk" width="50%"> |
|||
<a-form :model="form" layout="vertical"> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="项目名称" name="projectName"> |
|||
<a-select |
|||
v-model:value="form.projectName" |
|||
:options="projectNameOptions" |
|||
placeholder="请选择" |
|||
/> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="所属机构" name="organizationName"> |
|||
<a-select |
|||
v-model:value="form.organizationName" |
|||
:options="projectNameOptions" |
|||
placeholder="请选择" |
|||
/> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="维护单位" name="maintenanceUnit"> |
|||
<a-input v-model:value="form.maintenanceUnit" placeholder="请输入" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="名称" name="pointName"> |
|||
<a-input v-model:value="form.pointName" placeholder="请输入" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="地点" name="address"> |
|||
<a-input v-model:value="form.address" placeholder="请输入" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="备注" name="remark"> |
|||
<a-textarea v-model:value="form.remark" :rows="4" placeholder="请输入" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
</a-form> |
|||
</a-modal> |
|||
</template> |
|||
|
|||
<script> |
|||
import { reactive, ref } from 'vue'; |
|||
|
|||
export default { |
|||
setup() { |
|||
//文件列表 |
|||
const title = ref('新增'); |
|||
const visible = ref(false); |
|||
const form = reactive({ |
|||
projectName: '', |
|||
organizationName: '', |
|||
remark: '', |
|||
maintenanceUnit: '', |
|||
address: '', |
|||
pointName: '', |
|||
}); |
|||
//下拉框 |
|||
const projectNameOptions = [ |
|||
{ |
|||
value: '1', |
|||
label: 'a', |
|||
}, |
|||
{ |
|||
value: '2', |
|||
label: 'b', |
|||
}, |
|||
{ |
|||
value: '3', |
|||
label: 'c', |
|||
}, |
|||
]; |
|||
const showModal = (type, id) => { |
|||
if (type == 1) { |
|||
title.value = '新增'; |
|||
} else if (type == 2) { |
|||
title.value = '编辑'; |
|||
console.log(id); |
|||
} |
|||
visible.value = true; |
|||
}; |
|||
|
|||
const handleOk = () => { |
|||
console.log('Form Data:', form); |
|||
// 在此处可以添加表单验证逻辑 |
|||
visible.value = false; |
|||
}; |
|||
|
|||
return { |
|||
visible, |
|||
title, |
|||
form, |
|||
showModal, |
|||
handleOk, |
|||
projectNameOptions, |
|||
}; |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped> |
|||
/* 可选样式调整 */ |
|||
.ant-modal-body { |
|||
max-width: 600px; |
|||
margin: 0 auto; |
|||
} |
|||
</style> |
@ -0,0 +1,58 @@ |
|||
import { ID, IDS, PageQuery, commonExport } from '@/api/base'; |
|||
import { defHttp } from '@/utils/http/axios'; |
|||
import { Dayjs } from 'dayjs'; |
|||
|
|||
enum Api { |
|||
root = '/workflow/leave', |
|||
list = '/workflow/leave/list', |
|||
export = '/workflow/leave/export', |
|||
} |
|||
|
|||
export interface Leave { |
|||
id: string; |
|||
leaveType: string; |
|||
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) { |
|||
return defHttp.get<Leave[]>({ url: Api.list, params }); |
|||
} |
|||
|
|||
export function exportExcel(data: any) { |
|||
return commonExport(Api.export, data); |
|||
} |
|||
|
|||
export function getInfo(id: ID) { |
|||
return defHttp.get<Leave>({ url: `${Api.root}/${id}` }); |
|||
} |
|||
|
|||
export function add(data: any) { |
|||
return defHttp.post<Resp>({ url: Api.root, data }); |
|||
} |
|||
|
|||
export function update(data: any) { |
|||
return defHttp.put<Resp>({ url: Api.root, data }); |
|||
} |
|||
|
|||
export function removeByIds(ids: IDS) { |
|||
return defHttp.deleteWithMsg<void>({ url: `${Api.root}/${ids.join(',')}` }); |
|||
} |
@ -0,0 +1,32 @@ |
|||
import { BasicColumn } from '@/components/Table'; |
|||
import { FormSchema } from '@/components/Form'; |
|||
|
|||
export const formSchemas: FormSchema[] = [ |
|||
{ |
|||
field: 'pointName', |
|||
label: '点位名称', |
|||
component: 'Input', |
|||
componentProps: { |
|||
placeholder: '请输入', |
|||
}, |
|||
}, |
|||
]; |
|||
|
|||
export const columns: BasicColumn[] = [ |
|||
{ |
|||
title: '点位名称', |
|||
dataIndex: 'pointName', |
|||
}, |
|||
{ |
|||
title: '地址', |
|||
dataIndex: 'address', |
|||
}, |
|||
{ |
|||
title: '所属机构', |
|||
dataIndex: 'organizationName', |
|||
}, |
|||
{ |
|||
title: '维护单位', |
|||
dataIndex: 'maintenanceUnit', |
|||
}, |
|||
]; |
@ -0,0 +1,117 @@ |
|||
<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.organizationName }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">点位名称:</span>{{ detail.pointName }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">地址:</span>{{ detail.address }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">经度:</span>{{ detail.longitude }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<div><span class="titleLabel">纬度:</span>{{ detail.latitude }}</div> |
|||
</a-col> |
|||
</a-row> |
|||
</a-tab-pane> |
|||
</a-tabs> |
|||
</a-drawer> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { reactive, ref } from 'vue'; |
|||
// import { getInfo } from './api'; |
|||
|
|||
export default { |
|||
setup() { |
|||
//抽屉详情 |
|||
let detail = reactive({ |
|||
projectName: '', |
|||
organizationName: '', |
|||
pointName: '', |
|||
address: '', |
|||
longitude: '', |
|||
latitude: '', |
|||
}); |
|||
|
|||
// 打开抽屉的方法 |
|||
const visible = ref(false); |
|||
// const showDrawer = async(id) => { |
|||
// const data = await getInfo(id) |
|||
// for(let i in detail){ |
|||
// detail[i] = data[i] |
|||
// } |
|||
// visible.value = true; |
|||
// console.log(detail) |
|||
// }; |
|||
const showDrawer = () => { |
|||
visible.value = true; |
|||
}; |
|||
// 关闭抽屉的方法 |
|||
const onClose = () => { |
|||
visible.value = false; |
|||
}; |
|||
const activeKey = ref('1'); |
|||
|
|||
return { |
|||
visible, |
|||
showDrawer, |
|||
onClose, |
|||
activeKey, |
|||
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,186 @@ |
|||
<template> |
|||
<PageWrapper dense> |
|||
<a-row> |
|||
<a-col :span="4" style="margin-top: 1%"> |
|||
<a-tree |
|||
:show-line="true" |
|||
:show-icon="true" |
|||
:depoint-expanded-keys="['0-0-0']" |
|||
:tree-data="treeData" |
|||
@select="onSelect" |
|||
> |
|||
<template #icon><carry-out-outlined /></template> |
|||
<template #title="{ dataRef }"> |
|||
<template v-if="dataRef.key === '0-0-0-1'"> |
|||
<div>multiple line title</div> |
|||
<div>multiple line title</div> |
|||
</template> |
|||
<template v-else>{{ dataRef.title }}</template> |
|||
</template> |
|||
<template #switcherIcon="{ dataRef, depointIcon }"> |
|||
<SmileTwoTone v-if="dataRef.key === '0-0-2'" /> |
|||
<component :is="depointIcon" v-else /> |
|||
</template> |
|||
</a-tree> |
|||
</a-col> |
|||
<a-col :span="20"> |
|||
<BasicTable @register="registerTable"> |
|||
<template #toolbar> |
|||
<a-button type="primary" @click="handleAdd">新增</a-button> |
|||
<a-button type="primary" @click="goDetail">导入</a-button> |
|||
<a-button type="primary" @click="showpointModal">点位上报</a-button> |
|||
<a-button type="primary" @click="goDetail">点位导出</a-button> |
|||
</template> |
|||
<template #bodyCell="{ column, record }"> |
|||
<template v-if="column && record && column.key === 'action'"> |
|||
<a-button type="link" @click="handleEdit(record.id)">编辑</a-button> |
|||
<a-button type="link" @click="handleDelete(record.id)">删除</a-button> |
|||
</template> |
|||
</template> |
|||
</BasicTable> |
|||
<detailDrawer ref="detailDrawerRef" /> |
|||
<addModal ref="addModalRef" /> |
|||
<pointModal ref="pointModalRef" /> |
|||
</a-col> |
|||
</a-row> |
|||
</PageWrapper> |
|||
</template> |
|||
|
|||
<script setup lang="ts"> |
|||
import { PageWrapper } from '@/components/Page'; |
|||
import { BasicTable, useTable } from '@/components/Table'; |
|||
import { list } from './api'; |
|||
import { formSchemas, columns } from './data'; |
|||
import detailDrawer from './detailDrawer.vue'; |
|||
import addModal from './addModal.vue'; |
|||
import { ref } from 'vue'; |
|||
import pointModal from './pointModal.vue'; |
|||
|
|||
defineOptions({ name: 'Point' }); |
|||
|
|||
const [registerTable, { reload }] = useTable({ |
|||
rowSelection: { |
|||
type: 'checkbox', |
|||
}, |
|||
title: '点位信息', |
|||
api: list, |
|||
showIndexColumn: true, |
|||
rowKey: 'id', |
|||
useSearchForm: true, |
|||
formConfig: { |
|||
schemas: formSchemas, |
|||
name: 'point', |
|||
baseColProps: { |
|||
xs: 24, |
|||
sm: 24, |
|||
md: 24, |
|||
lg: 6, |
|||
}, |
|||
}, |
|||
columns: columns, |
|||
actionColumn: { |
|||
width: 200, |
|||
title: '操作', |
|||
key: 'action', |
|||
fixed: 'right', |
|||
}, |
|||
}); |
|||
//新增编辑弹窗 |
|||
const addModalRef = ref(); |
|||
const handleAdd = () => { |
|||
addModalRef.value.showModal(1); |
|||
}; |
|||
const handleEdit = (id: any) => { |
|||
addModalRef.value.showModal(2, id); |
|||
}; |
|||
const handleDelete = (id: any) => { |
|||
addModalRef.value.showModal(2, id); |
|||
}; |
|||
//点位上报 |
|||
//弹窗内容 |
|||
const pointModalRef = ref(); |
|||
const showpointModal = () => { |
|||
pointModalRef.value.showModal(); |
|||
}; |
|||
//tree |
|||
const treeData = ref([ |
|||
{ |
|||
title: 'parent 1', |
|||
key: '0-0', |
|||
children: [ |
|||
{ |
|||
title: 'parent 1-0', |
|||
key: '0-0-0', |
|||
children: [ |
|||
{ |
|||
title: 'leaf', |
|||
key: '0-0-0-0', |
|||
}, |
|||
{ |
|||
key: '0-0-0-1', |
|||
}, |
|||
{ |
|||
title: 'leaf', |
|||
key: '0-0-0-2', |
|||
}, |
|||
], |
|||
}, |
|||
{ |
|||
title: 'parent 1-1', |
|||
key: '0-0-1', |
|||
children: [ |
|||
{ |
|||
title: 'leaf', |
|||
key: '0-0-1-0', |
|||
}, |
|||
], |
|||
}, |
|||
{ |
|||
title: 'parent 1-2', |
|||
key: '0-0-2', |
|||
children: [ |
|||
{ |
|||
title: 'leaf 1', |
|||
key: '0-0-2-0', |
|||
}, |
|||
{ |
|||
title: 'leaf 2', |
|||
key: '0-0-2-1', |
|||
}, |
|||
], |
|||
}, |
|||
], |
|||
}, |
|||
{ |
|||
title: 'parent 2', |
|||
key: '0-1', |
|||
children: [ |
|||
{ |
|||
title: 'parent 2-0', |
|||
key: '0-1-0', |
|||
children: [ |
|||
{ |
|||
title: 'leaf', |
|||
key: '0-1-0-0', |
|||
}, |
|||
{ |
|||
title: 'leaf', |
|||
key: '0-1-0-1', |
|||
}, |
|||
], |
|||
}, |
|||
], |
|||
}, |
|||
]); |
|||
const onSelect = (selectedKeys: any, info: any) => { |
|||
console.log('selected', selectedKeys, info); |
|||
reload(); |
|||
}; |
|||
//抽屉 |
|||
const detailDrawerRef = ref(); |
|||
const goDetail = () => { |
|||
detailDrawerRef.value.showDrawer(); |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped></style> |
@ -0,0 +1,206 @@ |
|||
<template> |
|||
<a-modal v-model:open="visible" title="工单上报" @ok="handleOk" width="70%"> |
|||
<a-form :model="form" layout="vertical"> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="所属项目" name="projectName"> |
|||
<a-input v-model:value="form.projectName" placeholder="所属项目" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="12"> |
|||
<a-form-item label="是否事故" name="isAccident"> |
|||
<a-radio-group v-model:value="form.isAccident"> |
|||
<a-radio :value="1">是</a-radio> |
|||
<a-radio :value="0">否</a-radio> |
|||
</a-radio-group> |
|||
</a-form-item> |
|||
</a-col> |
|||
<a-col :span="12"> |
|||
<a-form-item label="报修人员" name="repairer"> |
|||
<a-input v-model:value="form.repairer" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="12"> |
|||
<a-form-item label="响应级别"> |
|||
<a-select v-model:value="form.responseLevel" :options="responseLevelOptions" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
<a-col :span="12"> |
|||
<a-form-item label="响应时限"> |
|||
<a-input v-model:value="form.responseTime" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="12"> |
|||
<a-form-item label="故障大类" name="faultCategory"> |
|||
<a-select v-model:value="form.faultCategory" :options="[{ value: '前端' }]" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
<a-col :span="12"> |
|||
<a-form-item label="故障小类" name="faultSubcategory"> |
|||
<a-select v-model:value="form.faultSubcategory" :options="faultSubcategoryOptions" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="12"> |
|||
<a-form-item label="故障机构" name="institution"> |
|||
<a-select v-model:value="form.institution" :options="institutionOptions" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
<a-col :span="12"> |
|||
<a-form-item label="故障地点" name="faultLocation"> |
|||
<a-input v-model:value="form.faultLocation" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="故障描述" name="faultDescription"> |
|||
<a-textarea v-model:value="form.faultDescription" :rows="4" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="12"> |
|||
<a-form-item label="是否派遣" name="isDispatched"> |
|||
<a-radio-group v-model:value="form.isDispatched"> |
|||
<a-radio :value="1">是</a-radio> |
|||
<a-radio :value="0">否</a-radio> |
|||
</a-radio-group> |
|||
</a-form-item> |
|||
</a-col> |
|||
<a-col :span="12" v-if="form.isDispatched == 1"> |
|||
<a-form-item label="维护要求" name="maintenanceRequirement"> |
|||
<a-select |
|||
v-model:value="form.maintenanceRequirement" |
|||
:options="maintenanceRequirementOptions" |
|||
/> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]" v-if="form.isDispatched == 1"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="派遣意见" name="dispatchOpinion"> |
|||
<a-textarea v-model:value="form.dispatchOpinion" :rows="4" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
</a-form> |
|||
</a-modal> |
|||
</template> |
|||
|
|||
<script> |
|||
import { reactive, ref } from 'vue'; |
|||
|
|||
export default { |
|||
setup() { |
|||
const visible = ref(false); |
|||
const form = reactive({ |
|||
projectName: '', |
|||
isAccident: null, |
|||
repairer: '', |
|||
responseTime: '', |
|||
responseLevel: '', |
|||
faultCategory: '', |
|||
faultSubcategory: '', |
|||
institution: '', |
|||
faultLocation: '', |
|||
faultDescription: '', |
|||
isDispatched: null, |
|||
maintenanceRequirement: '', |
|||
dispatchOpinion: '', |
|||
}); |
|||
//下拉框 |
|||
const responseLevelOptions = [ |
|||
{ |
|||
value: 0, |
|||
label: '常规', |
|||
}, |
|||
{ |
|||
value: 1, |
|||
label: '紧急', |
|||
}, |
|||
{ |
|||
value: 2, |
|||
label: '特级', |
|||
}, |
|||
]; |
|||
const maintenanceRequirementOptions = [ |
|||
{ |
|||
value: 0, |
|||
label: '常规', |
|||
}, |
|||
{ |
|||
value: 1, |
|||
label: '紧急', |
|||
}, |
|||
{ |
|||
value: 2, |
|||
label: '特级', |
|||
}, |
|||
]; |
|||
const institutionOptions = [ |
|||
{ |
|||
value: 0, |
|||
label: '常规', |
|||
}, |
|||
{ |
|||
value: 1, |
|||
label: '紧急', |
|||
}, |
|||
{ |
|||
value: 2, |
|||
label: '特级', |
|||
}, |
|||
]; |
|||
const faultSubcategoryOptions = [ |
|||
{ |
|||
value: 0, |
|||
label: '常规', |
|||
}, |
|||
{ |
|||
value: 1, |
|||
label: '紧急', |
|||
}, |
|||
{ |
|||
value: 2, |
|||
label: '特级', |
|||
}, |
|||
]; |
|||
const showModal = () => { |
|||
visible.value = true; |
|||
}; |
|||
|
|||
const handleOk = () => { |
|||
console.log('Form Data:', form); |
|||
// 在此处可以添加工单上报验证逻辑 |
|||
visible.value = false; |
|||
}; |
|||
|
|||
return { |
|||
visible, |
|||
form, |
|||
showModal, |
|||
handleOk, |
|||
responseLevelOptions, |
|||
maintenanceRequirementOptions, |
|||
institutionOptions, |
|||
faultSubcategoryOptions, |
|||
}; |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped> |
|||
/* 可选样式调整 */ |
|||
.ant-modal-body { |
|||
max-width: 600px; |
|||
margin: 0 auto; |
|||
} |
|||
</style> |
@ -0,0 +1,119 @@ |
|||
<template> |
|||
<a-modal v-model:open="visible" :title="title" @ok="handleOk" width="50%"> |
|||
<a-form :model="form" layout="vertical"> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="名称" name="name"> |
|||
<a-input v-model:value="form.name" placeholder="请输入" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="状态" name="status"> |
|||
<a-select v-model:value="form.status" :options="statusOptions" placeholder="请选择" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="规格" name="standards"> |
|||
<a-input v-model:value="form.standards" placeholder="请输入" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="单价(元)" name="price"> |
|||
<a-input v-model:value="form.price" placeholder="请输入" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="数量" name="amount"> |
|||
<a-input v-model:value="form.amount" placeholder="请输入" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="单位" name="unit"> |
|||
<a-input v-model:value="form.unit" placeholder="请输入" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="备注" name="remark"> |
|||
<a-textarea v-model:value="form.remark" :rows="4" placeholder="请输入" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
</a-form> |
|||
</a-modal> |
|||
</template> |
|||
|
|||
<script> |
|||
import { reactive, ref } from 'vue'; |
|||
|
|||
export default { |
|||
setup() { |
|||
//文件列表 |
|||
const title = ref('新增'); |
|||
const visible = ref(false); |
|||
const form = reactive({ |
|||
name: '', |
|||
status: null, |
|||
remark: '', |
|||
unit: '', |
|||
price: '', |
|||
amount: '', |
|||
standards: '', |
|||
}); |
|||
//下拉框 |
|||
const statusOptions = [ |
|||
{ |
|||
value: 0, |
|||
label: '禁用', |
|||
}, |
|||
{ |
|||
value: 1, |
|||
label: '启用', |
|||
}, |
|||
]; |
|||
const showModal = (type, id) => { |
|||
if (type == 1) { |
|||
title.value = '新增'; |
|||
} else if (type == 2) { |
|||
title.value = '编辑'; |
|||
console.log(id); |
|||
} |
|||
visible.value = true; |
|||
}; |
|||
|
|||
const handleOk = () => { |
|||
console.log('Form Data:', form); |
|||
// 在此处可以添加表单验证逻辑 |
|||
visible.value = false; |
|||
}; |
|||
|
|||
return { |
|||
visible, |
|||
title, |
|||
form, |
|||
showModal, |
|||
handleOk, |
|||
statusOptions, |
|||
}; |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped> |
|||
/* 可选样式调整 */ |
|||
.ant-modal-body { |
|||
max-width: 600px; |
|||
margin: 0 auto; |
|||
} |
|||
</style> |
@ -0,0 +1,58 @@ |
|||
import { ID, IDS, PageQuery, commonExport } from '@/api/base'; |
|||
import { defHttp } from '@/utils/http/axios'; |
|||
import { Dayjs } from 'dayjs'; |
|||
|
|||
enum Api { |
|||
root = '/workflow/leave', |
|||
list = '/workflow/leave/list', |
|||
export = '/workflow/leave/export', |
|||
} |
|||
|
|||
export interface Leave { |
|||
id: string; |
|||
leaveType: string; |
|||
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) { |
|||
return defHttp.get<Leave[]>({ url: Api.list, params }); |
|||
} |
|||
|
|||
export function exportExcel(data: any) { |
|||
return commonExport(Api.export, data); |
|||
} |
|||
|
|||
export function getInfo(id: ID) { |
|||
return defHttp.get<Leave>({ url: `${Api.root}/${id}` }); |
|||
} |
|||
|
|||
export function add(data: any) { |
|||
return defHttp.post<Resp>({ url: Api.root, data }); |
|||
} |
|||
|
|||
export function update(data: any) { |
|||
return defHttp.put<Resp>({ url: Api.root, data }); |
|||
} |
|||
|
|||
export function removeByIds(ids: IDS) { |
|||
return defHttp.deleteWithMsg<void>({ url: `${Api.root}/${ids.join(',')}` }); |
|||
} |
@ -0,0 +1,69 @@ |
|||
import { BasicColumn } from '@/components/Table'; |
|||
import { FormSchema } from '@/components/Form'; |
|||
|
|||
export const formSchemas: FormSchema[] = [ |
|||
{ |
|||
field: 'installAddress', |
|||
label: '安装地点', |
|||
component: 'Input', |
|||
componentProps: { |
|||
placeholder: '请输入', |
|||
}, |
|||
}, |
|||
{ |
|||
field: 'status', |
|||
label: '状态', |
|||
component: 'Select', |
|||
componentProps: { |
|||
options: [ |
|||
{ |
|||
value: '1', |
|||
label: '2323', |
|||
}, |
|||
{ |
|||
value: '2', |
|||
label: '2323', |
|||
}, |
|||
{ |
|||
value: '3', |
|||
label: '2323', |
|||
}, |
|||
], |
|||
}, |
|||
}, |
|||
]; |
|||
|
|||
export const columns: BasicColumn[] = [ |
|||
{ |
|||
title: '编号', |
|||
dataIndex: 'code', |
|||
}, |
|||
{ |
|||
title: '名称', |
|||
dataIndex: 'name', |
|||
}, |
|||
{ |
|||
title: '安装地点', |
|||
dataIndex: 'installAddress', |
|||
}, |
|||
{ |
|||
title: '安装方式', |
|||
dataIndex: 'installType', |
|||
}, |
|||
{ |
|||
title: '状态', |
|||
dataIndex: 'status', |
|||
}, |
|||
{ |
|||
title: '规格参数', |
|||
dataIndex: 'standards', |
|||
}, |
|||
{ |
|||
title: '入库日期', |
|||
dataIndex: 'inDate', |
|||
}, |
|||
{ |
|||
title: '二维码', |
|||
dataIndex: 'qrCode', |
|||
}, |
|||
]; |
@ -0,0 +1,175 @@ |
|||
<template> |
|||
<PageWrapper dense> |
|||
<a-row> |
|||
<a-col :span="4" style="margin-top: 1%"> |
|||
<a-tree |
|||
:show-line="true" |
|||
:show-icon="true" |
|||
:depoint-expanded-keys="['0-0-0']" |
|||
:tree-data="treeData" |
|||
@select="onSelect" |
|||
> |
|||
<template #icon><carry-out-outlined /></template> |
|||
<template #title="{ dataRef }"> |
|||
<template v-if="dataRef.key === '0-0-0-1'"> |
|||
<div>multiple line title</div> |
|||
<div>multiple line title</div> |
|||
</template> |
|||
<template v-else>{{ dataRef.title }}</template> |
|||
</template> |
|||
<template #switcherIcon="{ dataRef, depointIcon }"> |
|||
<SmileTwoTone v-if="dataRef.key === '0-0-2'" /> |
|||
<component :is="depointIcon" v-else /> |
|||
</template> |
|||
</a-tree> |
|||
</a-col> |
|||
<a-col :span="20"> |
|||
<BasicTable @register="registerTable"> |
|||
<template #toolbar> |
|||
<a-button type="primary" @click="handleAdd">新增</a-button> |
|||
<a-button type="primary" @click="handleAdd">导入</a-button> |
|||
<a-button type="primary" @click="handleAdd">导出excel</a-button> |
|||
<a-button type="primary" @click="handleAdd">记录</a-button> |
|||
<a-button type="primary" @click="handleAdd">跳转二维码</a-button> |
|||
<a-button type="primary" @click="handleAdd">故障上报</a-button> |
|||
</template> |
|||
<template #bodyCell="{ column, record }"> |
|||
<template v-if="column && record && column.key === 'action'"> |
|||
<a-button type="link" @click="handleEdit(record.id)">详情</a-button> |
|||
<a-button type="link" @click="handleEdit(record.id)">编辑</a-button> |
|||
<a-button type="link" @click="handleDelete(record.id)">删除</a-button> |
|||
<a-button type="link" @click="handleEdit(record.id)">禁用/启用</a-button> |
|||
</template> |
|||
</template> |
|||
</BasicTable> |
|||
<addModal ref="addModalRef" /> |
|||
</a-col> |
|||
</a-row> |
|||
</PageWrapper> |
|||
</template> |
|||
|
|||
<script setup lang="ts"> |
|||
import { PageWrapper } from '@/components/Page'; |
|||
import { BasicTable, useTable } from '@/components/Table'; |
|||
import { list } from './api'; |
|||
import { formSchemas, columns } from './data'; |
|||
import addModal from './addModal.vue'; |
|||
import { ref } from 'vue'; |
|||
|
|||
defineOptions({ name: 'PropertyList' }); |
|||
|
|||
const [registerTable, { reload }] = useTable({ |
|||
rowSelection: { |
|||
type: 'checkbox', |
|||
}, |
|||
title: '资产列表', |
|||
api: list, |
|||
showIndexColumn: true, |
|||
rowKey: 'id', |
|||
useSearchForm: true, |
|||
formConfig: { |
|||
schemas: formSchemas, |
|||
name: 'propertyList', |
|||
baseColProps: { |
|||
xs: 24, |
|||
sm: 24, |
|||
md: 24, |
|||
lg: 6, |
|||
}, |
|||
}, |
|||
columns: columns, |
|||
actionColumn: { |
|||
width: 200, |
|||
title: '操作', |
|||
key: 'action', |
|||
fixed: 'right', |
|||
}, |
|||
}); |
|||
//新增编辑弹窗 |
|||
const addModalRef = ref(); |
|||
const handleAdd = () => { |
|||
addModalRef.value.showModal(1); |
|||
}; |
|||
const handleEdit = (id: any) => { |
|||
addModalRef.value.showModal(2, id); |
|||
}; |
|||
const handleDelete = (id: any) => { |
|||
addModalRef.value.showModal(2, id); |
|||
}; |
|||
//tree |
|||
const treeData = ref([ |
|||
{ |
|||
title: 'parent 1', |
|||
key: '0-0', |
|||
children: [ |
|||
{ |
|||
title: 'parent 1-0', |
|||
key: '0-0-0', |
|||
children: [ |
|||
{ |
|||
title: 'leaf', |
|||
key: '0-0-0-0', |
|||
}, |
|||
{ |
|||
key: '0-0-0-1', |
|||
}, |
|||
{ |
|||
title: 'leaf', |
|||
key: '0-0-0-2', |
|||
}, |
|||
], |
|||
}, |
|||
{ |
|||
title: 'parent 1-1', |
|||
key: '0-0-1', |
|||
children: [ |
|||
{ |
|||
title: 'leaf', |
|||
key: '0-0-1-0', |
|||
}, |
|||
], |
|||
}, |
|||
{ |
|||
title: 'parent 1-2', |
|||
key: '0-0-2', |
|||
children: [ |
|||
{ |
|||
title: 'leaf 1', |
|||
key: '0-0-2-0', |
|||
}, |
|||
{ |
|||
title: 'leaf 2', |
|||
key: '0-0-2-1', |
|||
}, |
|||
], |
|||
}, |
|||
], |
|||
}, |
|||
{ |
|||
title: 'parent 2', |
|||
key: '0-1', |
|||
children: [ |
|||
{ |
|||
title: 'parent 2-0', |
|||
key: '0-1-0', |
|||
children: [ |
|||
{ |
|||
title: 'leaf', |
|||
key: '0-1-0-0', |
|||
}, |
|||
{ |
|||
title: 'leaf', |
|||
key: '0-1-0-1', |
|||
}, |
|||
], |
|||
}, |
|||
], |
|||
}, |
|||
]); |
|||
const onSelect = (selectedKeys: any, info: any) => { |
|||
console.log('selected', selectedKeys, info); |
|||
reload(); |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped></style> |
Loading…
Reference in new issue