wbc
3 months ago
19 changed files with 697 additions and 256 deletions
@ -0,0 +1,236 @@ |
|||||
|
<template> |
||||
|
<a-modal v-model:open="visible" :title="title" @ok="handleOk" width="80%"> |
||||
|
<a-form :model="form" layout="vertical"> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="12"> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="24"> |
||||
|
<a-form-item label="合同名称" name="contractName"> |
||||
|
<a-input v-model:value="form.contractName" placeholder="请输入" disabled /> |
||||
|
</a-form-item> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="24"> |
||||
|
<a-form-item label="项目名称" name="projectName"> |
||||
|
<a-input v-model:value="form.projectName" placeholder="请输入" disabled /> |
||||
|
</a-form-item> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="24"> |
||||
|
<a-form-item label="运维单位" name="ioCompany"> |
||||
|
<a-input v-model:value="form.ioCompany" placeholder="请输入" disabled /> |
||||
|
</a-form-item> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="24"> |
||||
|
<a-form-item label="频率" name="frequnency"> |
||||
|
<a-input v-model:value="form.frequnency" placeholder="请输入" disabled /> |
||||
|
</a-form-item> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="24"> |
||||
|
<a-form-item label="日期范围" name="dateRange"> |
||||
|
<a-range-picker v-model:value="form.dateRange" /><a-button |
||||
|
style="margin-left: 10px" |
||||
|
type="primary" |
||||
|
@click="createPlan" |
||||
|
>生成</a-button |
||||
|
> |
||||
|
</a-form-item> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="24"> |
||||
|
<a-form-item label="排除周末" name="isWeekend"> |
||||
|
<a-switch v-model:checked="form.isWeekend" /> |
||||
|
</a-form-item> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="24"> |
||||
|
<a-form-item label="计划描述" name="description"> |
||||
|
<a-textarea v-model:value="form.description" :rows="4" placeholder="请输入" /> |
||||
|
</a-form-item> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="24"> |
||||
|
<a-form-item label="巡检点位" name="pointName"> |
||||
|
<a-select |
||||
|
v-model:value="form.pointName" |
||||
|
:options="projectNameOptions" |
||||
|
placeholder="请选择" |
||||
|
/> |
||||
|
</a-form-item> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
</a-col> |
||||
|
<a-col :span="12"> |
||||
|
<a-table |
||||
|
:dataSource="form.finishStatus" |
||||
|
:columns="finishColumns" |
||||
|
bordered |
||||
|
style="margin-top: 2%" |
||||
|
> |
||||
|
<template #bodyCell="{ column, record, index }"> |
||||
|
<template v-if="column && record && column.key === 'action'"> |
||||
|
<a-button type="link" @click="deletePlan(index)">删除</a-button> |
||||
|
</template> |
||||
|
</template> |
||||
|
</a-table> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
</a-form> |
||||
|
</a-modal> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import { reactive, ref } from 'vue'; |
||||
|
import { getInfo } from './api'; |
||||
|
import dayjs from 'dayjs'; |
||||
|
|
||||
|
export default { |
||||
|
setup() { |
||||
|
const title = ref('生成计划'); |
||||
|
const visible = ref(false); |
||||
|
const form = reactive({ |
||||
|
contractName: '', |
||||
|
projectName: '', |
||||
|
ioCompany: '', |
||||
|
dateRange: [], |
||||
|
frequnency: '', |
||||
|
isWeekend: false, |
||||
|
description: '', |
||||
|
pointName: '', |
||||
|
finishStatus: [], |
||||
|
}); |
||||
|
//下拉框 |
||||
|
const projectNameOptions = [ |
||||
|
{ |
||||
|
value: '1', |
||||
|
label: 'a', |
||||
|
}, |
||||
|
{ |
||||
|
value: '2', |
||||
|
label: 'b', |
||||
|
}, |
||||
|
{ |
||||
|
value: '3', |
||||
|
label: 'c', |
||||
|
}, |
||||
|
]; |
||||
|
|
||||
|
const showModal = async (id) => { |
||||
|
visible.value = true; |
||||
|
const data = await getInfo(id); |
||||
|
for (let i in form) { |
||||
|
form[i] = data[i]; |
||||
|
} |
||||
|
}; |
||||
|
|
||||
|
const handleOk = () => { |
||||
|
console.log('Form Data:', form); |
||||
|
// 在此处可以添加表单验证逻辑 |
||||
|
visible.value = false; |
||||
|
}; |
||||
|
//列表 |
||||
|
const finishColumns = [ |
||||
|
{ |
||||
|
title: '开始日期', |
||||
|
dataIndex: 'scheduleStartDate', |
||||
|
key: 'scheduleStartDate', |
||||
|
}, |
||||
|
{ |
||||
|
title: '结束日期', |
||||
|
dataIndex: 'scheduleEndDate', |
||||
|
key: 'scheduleEndDate', |
||||
|
}, |
||||
|
{ |
||||
|
title: '状态', |
||||
|
dataIndex: 'status', |
||||
|
key: 'status', |
||||
|
customRender: ({ text }) => { |
||||
|
if (text == 1) { |
||||
|
return '已完成'; |
||||
|
} else { |
||||
|
return '未完成'; |
||||
|
} |
||||
|
}, |
||||
|
}, |
||||
|
{ |
||||
|
title: '完成日期', |
||||
|
dataIndex: 'finishDate', |
||||
|
key: 'finishDate', |
||||
|
}, |
||||
|
{ |
||||
|
title: '操作', |
||||
|
dataIndex: 'action', |
||||
|
key: 'action', |
||||
|
}, |
||||
|
]; |
||||
|
//生成计划 |
||||
|
const createPlan = () => { |
||||
|
form.finishStatus = []; |
||||
|
const startDate = new Date(form.dateRange[0]); |
||||
|
const endDate = new Date(form.dateRange[1]); |
||||
|
const dates = []; |
||||
|
let currentDate = startDate; |
||||
|
if (form.isWeekend) { |
||||
|
while (currentDate <= endDate) { |
||||
|
const whichDay = dayjs(currentDate).format('dddd'); |
||||
|
if (whichDay != 'Saturday' && whichDay != 'Sunday') { |
||||
|
const singerPlan = { |
||||
|
scheduleStartDate: dayjs(currentDate).format('YYYY-MM-DD'), |
||||
|
scheduleEndDate: dayjs(currentDate).format('YYYY-MM-DD'), |
||||
|
status: 0, |
||||
|
}; |
||||
|
form.finishStatus.push(singerPlan); |
||||
|
} |
||||
|
// 增加一周 |
||||
|
currentDate.setDate(currentDate.getDate() + 1); |
||||
|
} |
||||
|
console.log(dates); |
||||
|
} else { |
||||
|
while (currentDate <= endDate) { |
||||
|
const singerPlan = { |
||||
|
scheduleStartDate: dayjs(currentDate).format('YYYY-MM-DD'), |
||||
|
scheduleEndDate: dayjs(currentDate).format('YYYY-MM-DD'), |
||||
|
status: 0, |
||||
|
}; |
||||
|
form.finishStatus.push(singerPlan); |
||||
|
// 增加一周 |
||||
|
currentDate.setDate(currentDate.getDate() + 1); |
||||
|
} |
||||
|
console.log(dates); |
||||
|
} |
||||
|
}; |
||||
|
//删除计划 |
||||
|
const deletePlan = (index) => { |
||||
|
form.finishStatus.splice(index, 1); |
||||
|
}; |
||||
|
return { |
||||
|
visible, |
||||
|
title, |
||||
|
form, |
||||
|
showModal, |
||||
|
handleOk, |
||||
|
projectNameOptions, |
||||
|
finishColumns, |
||||
|
createPlan, |
||||
|
deletePlan, |
||||
|
}; |
||||
|
}, |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style scoped> |
||||
|
/* 可选样式调整 */ |
||||
|
.ant-modal-body { |
||||
|
max-width: 600px; |
||||
|
margin: 0 auto; |
||||
|
} |
||||
|
</style> |
||||
@ -1,58 +1,34 @@ |
|||||
import { ID, IDS, 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/inspectPlanInfo', |
||||
list = '/workflow/leave/list', |
list = '/platform/inspectPlanInfo/list', |
||||
export = '/workflow/leave/export', |
// export = '/workflow/leave/export',
|
||||
|
getProjectInfo = '/platform/projectInfo/getNames', |
||||
} |
} |
||||
|
|
||||
export interface Leave { |
export function list(params?: any) { |
||||
id: string; |
return defHttp.get({ url: Api.list, params }); |
||||
leaveType: string; |
|
||||
startDate: string; |
|
||||
endDate: string; |
|
||||
leaveDays: number; |
|
||||
remark: string; |
|
||||
processInstanceVo?: any; |
|
||||
dateTime?: [string, string] | [Dayjs, Dayjs]; |
|
||||
} |
} |
||||
|
export function getProjectInfo() { |
||||
export interface Resp { |
return defHttp.get({ url: Api.getProjectInfo }); |
||||
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 exportExcel(data: any) {
|
||||
|
// 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: IDS) { |
export function removeByIds(ids: any) { |
||||
return defHttp.deleteWithMsg<void>({ url: `${Api.root}/${ids.join(',')}` }); |
return defHttp.deleteWithMsg({ url: `${Api.root}/${ids.join(',')}` }); |
||||
} |
} |
||||
|
|||||
@ -1,58 +1,31 @@ |
|||||
import { ID, IDS, 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/inspectionDailyReport', |
||||
list = '/workflow/leave/list', |
list = '/platform/inspectionDailyReport/list', |
||||
export = '/workflow/leave/export', |
export = '/workflow/leave/export', |
||||
} |
} |
||||
|
|
||||
export interface Leave { |
export function list(params: any) { |
||||
id: string; |
return defHttp.get({ url: Api.list, params }); |
||||
leaveType: string; |
|
||||
startDate: string; |
|
||||
endDate: string; |
|
||||
leaveDays: number; |
|
||||
remark: string; |
|
||||
processInstanceVo?: any; |
|
||||
dateTime?: [string, string] | [Dayjs, Dayjs]; |
|
||||
} |
} |
||||
|
|
||||
export interface Resp { |
// export function exportExcel(data: any) {
|
||||
createDept: number; |
// return commonExport(Api.export, data);
|
||||
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) { |
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: IDS) { |
export function removeByIds(ids: any) { |
||||
return defHttp.deleteWithMsg<void>({ url: `${Api.root}/${ids.join(',')}` }); |
return defHttp.deleteWithMsg({ url: `${Api.root}/${ids.join(',')}` }); |
||||
} |
} |
||||
|
|||||
@ -0,0 +1,130 @@ |
|||||
|
<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.ioCompany }}</div> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="24"> |
||||
|
<div><span class="titleLabel">巡检时间：</span>{{ detail.inspectionTime }}</div> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="12"> |
||||
|
<div><span class="titleLabel">巡检部位：</span>{{ detail.inspectionPart }}</div> |
||||
|
</a-col> |
||||
|
<a-col :span="12"> |
||||
|
<div><span class="titleLabel">巡检人员：</span>{{ detail.inspectionPeople }}</div> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="24"> |
||||
|
<div><span class="titleLabel">巡检情况：</span>{{ detail.inspectionStatus }}</div> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="24"> |
||||
|
<div><span class="titleLabel">问题处理：</span>{{ detail.problemHandleDesc }}</div> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="24"> |
||||
|
<div><span class="titleLabel">附件：</span>{{ detail.attachment }}</div> |
||||
|
</a-col> |
||||
|
</a-row> |
||||
|
<a-row :gutter="[16, 16]"> |
||||
|
<a-col :span="24"> |
||||
|
<div><span class="titleLabel">巡检照片：</span>{{ detail.inspectionPhoto }}</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: '', |
||||
|
ioCompany: '', |
||||
|
inspectionTime: '', |
||||
|
inspectionPart: '', |
||||
|
inspectionPeople: '', |
||||
|
inspectionStatus: '', |
||||
|
problemHandleDesc: '', |
||||
|
attachment: null, |
||||
|
inspectionPhoto: null, |
||||
|
}); |
||||
|
|
||||
|
// 打开抽屉的方法 |
||||
|
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 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> |
||||
Loading…
Reference in new issue