wbc
3 weeks 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 { Dayjs } from 'dayjs'; |
|||
|
|||
enum Api { |
|||
root = '/workflow/leave', |
|||
list = '/workflow/leave/list', |
|||
export = '/workflow/leave/export', |
|||
root = '/platform/inspectPlanInfo', |
|||
list = '/platform/inspectPlanInfo/list', |
|||
// export = '/workflow/leave/export',
|
|||
getProjectInfo = '/platform/projectInfo/getNames', |
|||
} |
|||
|
|||
export interface Leave { |
|||
id: string; |
|||
leaveType: string; |
|||
startDate: string; |
|||
endDate: string; |
|||
leaveDays: number; |
|||
remark: string; |
|||
processInstanceVo?: any; |
|||
dateTime?: [string, string] | [Dayjs, Dayjs]; |
|||
export function list(params?: any) { |
|||
return defHttp.get({ url: Api.list, params }); |
|||
} |
|||
|
|||
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 getProjectInfo() { |
|||
return defHttp.get({ url: Api.getProjectInfo }); |
|||
} |
|||
// 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,31 @@ |
|||
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', |
|||
root = '/platform/inspectionDailyReport', |
|||
list = '/platform/inspectionDailyReport/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 function list(params: any) { |
|||
return defHttp.get({ url: Api.list, params }); |
|||
} |
|||
|
|||
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 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,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