zhouhaibin
7 months ago
38 changed files with 3521 additions and 1091 deletions
@ -0,0 +1,100 @@ |
|||
<template> |
|||
<!-- 自定义表单 --> |
|||
<el-divider content-position="left">项目入库详情</el-divider> |
|||
<BasicForm @register="registerProjectForm" @submit="handleSubmit" /> |
|||
<!-- <el-divider content-position="left">项目审批详情</el-divider> |
|||
<BasicTable @register="registerTable" /> |
|||
<el-divider content-position="left" v-if="showApprovalForm">项目审批</el-divider> |
|||
<div v-if="showApprovalForm"> |
|||
<BasicForm @register="registerApprovalForm" @submit="handleSubmit" /> |
|||
</div> --> |
|||
</template> |
|||
<script lang="ts" name="initiatesProjectsApproval" setup> |
|||
import { onMounted, reactive, onUpdated } from 'vue' |
|||
import { useForm, BasicForm } from '/@/components/Form'; |
|||
import { formSchemas } from '../../projectLib/projectInfo/projectInfo.data'; |
|||
import { queryProjectInfoById } from '../../projectLib/projectInfo/projectInfo.api' |
|||
import { submitTask, modifyProjectInfo } from '../../myWork/inComplete/inComplete.api'; |
|||
import { getUserInfoByid } from '../../projectLib/initiatesProjects/initiatesProjects.api' |
|||
|
|||
|
|||
let dataTo = defineProps(["projectid","IsEdit"]) |
|||
const emit = defineEmits(['close']); |
|||
console.log("结果ddddd是", dataTo) |
|||
|
|||
onMounted(async () => { |
|||
let param: any = { |
|||
projectid: dataTo.projectid |
|||
} |
|||
let res = await queryProjectInfoById(param) |
|||
console.log("结果是", res,dataTo) |
|||
setFieldsValue(res) |
|||
}) |
|||
onUpdated(async () => { |
|||
console.log("我更新了") |
|||
let proform = getFieldsValueProjectForm() |
|||
for (let key in proform) { |
|||
if (key.indexOf("Contactor") != -1) { |
|||
let userid = proform[key] |
|||
let res = await getUserInfoByid({ id: userid }) |
|||
console.log(key, res.realname) |
|||
updateProjectSchema({ |
|||
field: key, |
|||
componentProps: { |
|||
options: [{ |
|||
value: userid, |
|||
label: res.realname |
|||
} |
|||
], |
|||
} |
|||
}) |
|||
} |
|||
} |
|||
|
|||
} |
|||
) |
|||
/** |
|||
* BasicForm绑定注册;src\views\ProcessApprovalSubPage\initiatesProjectsApproval\initiatesProjectsApproval.vue |
|||
* useForm 是整个框架的核心用于表单渲染，里边封装了很多公共方法; |
|||
* 支持（schemas: 渲染表单列，autoSubmitOnEnter：回车提交,submitButtonOptions：自定义按钮文本和图标等方法）； |
|||
* 平台通过此封装，简化了代码，支持自定义扩展; |
|||
*/ |
|||
const [registerProjectForm, { validate: validateProjectForm, setFieldsValue, getFieldsValue: getFieldsValueProjectForm, updateSchema: updateProjectSchema }] = useForm({ |
|||
//注册表单列 |
|||
schemas: formSchemas, |
|||
showActionButtonGroup: dataTo.IsEdit, |
|||
//回车提交 |
|||
// autoSubmitOnEnter: true, |
|||
// //不显示重置按钮 |
|||
// showResetButton: false, |
|||
//自定义提交按钮文本和图标 |
|||
submitButtonOptions: { text: '提交', preIcon: '' }, |
|||
resetButtonOptions: { text: '取消', preIcon: '' }, |
|||
//查询列占比 24代表一行 取值范围 0-24 |
|||
resetFunc: customResetFunc, |
|||
|
|||
actionColOptions: { span: 14 }, |
|||
labelCol: { style: { width: '120px' } }, |
|||
wrapperCol: { style: { width: 'auto' } }, |
|||
disabled:dataTo.IsEdit==true?false:true, |
|||
}); |
|||
|
|||
|
|||
async function handleSubmit() { |
|||
let projectform = await getFieldsValueProjectForm(); |
|||
let param = { |
|||
projectInfo: projectform |
|||
} |
|||
// let outrs = Object.assign({},param,projectform) |
|||
console.log("param", param, "projectform", projectform) |
|||
if (await validateProjectForm()) { |
|||
modifyProjectInfo(projectform) |
|||
emit("close") |
|||
|
|||
} |
|||
} |
|||
async function customResetFunc() { |
|||
emit("close") |
|||
} |
|||
</script> |
|||
<style></style> |
|||
@ -0,0 +1,214 @@ |
|||
<template> |
|||
<!-- 自定义表单 --> |
|||
<el-divider content-position="left">项目计划阶段详情</el-divider> |
|||
<BasicTable @register="registerPlanTable"> |
|||
</BasicTable> |
|||
<el-divider content-position="left" v-if="resButton.IsEdit">重新上传项目计划</el-divider> |
|||
<div v-if="resButton.IsEdit" style="display: flex; justify-content: center; align-items: center; height: 100px;"> |
|||
<el-upload class="upload-demo" ref="upload" action :http-request="httpRequest" :before-upload="beforeUpload" |
|||
:on-exceed="handleExceed" :limit="1" :on-remove="removeFile"> |
|||
<el-button slot="trigger" size="small" type="primary">选取文件</el-button> |
|||
<div slot="tip" class="el-upload__tip">文件大小且不超过5M</div> |
|||
</el-upload> |
|||
</div> |
|||
<el-divider content-position="left">项目审批详情</el-divider> |
|||
<BasicTable @register="registerTable" /> |
|||
<el-divider content-position="left" v-if="showApprovalForm">项目审批</el-divider> |
|||
<div v-if="showApprovalForm"> |
|||
<BasicForm @register="registerApprovalForm" @submit="handleSubmit" /> |
|||
</div> |
|||
</template> |
|||
<script lang="ts" name="viewPlanDetail" setup> |
|||
import { ref, onMounted, reactive, onUpdated } from 'vue' |
|||
import { useForm, BasicForm } from '/@/components/Form'; |
|||
import { formSchemas, approveStartProcessColumns, columns } from '../../projectLib/projectInfo/projectInfo.data'; |
|||
import { approvalformSchemas } from '../../myWork/inComplete/inComplete.data' |
|||
import { BasicModal } from '/@/components/Modal'; |
|||
import { PlaninfoColumn } from '../../projectLib/projectPlan/projectPlan.data'; |
|||
import { queryPlaninfoFilePageByid, queryPlanInfoMainTimeline } from '../../projectLib/projectPlan/projectPlan.api' |
|||
import { queryProjectInfoById, queryProcessInfo } from '../../projectLib/projectInfo/projectInfo.api' |
|||
import { ActionItem, BasicTable, TableAction } from '/@/components/Table'; |
|||
import { useListPage } from '/@/hooks/system/useListPage'; |
|||
import { getActionParam } from '../../myWork/inComplete/inComplete.api'; |
|||
import { approvePlaninfo } from '../../projectLib/projectPlan/projectPlan.api' |
|||
import { useRouter, useRoute } from 'vue-router' |
|||
import { ElMessage } from 'element-plus' |
|||
|
|||
const route = useRoute(); |
|||
const router = useRouter() |
|||
let projectid = route.query.projectid |
|||
let taskid = route.query.taskId |
|||
let showApprovalForm = ref() |
|||
let resButton = reactive({ |
|||
showApprovalForm: false, |
|||
IsEdit: false, |
|||
buttons: [] |
|||
}) |
|||
let fileList = reactive<Array<any>>([]); |
|||
|
|||
onMounted(async () => { |
|||
resButton = await getActionParam({ projectid: projectid, stage: "3", taskId: taskid, procesType: route.query.procesType }) |
|||
showApprovalForm.value = resButton.showApprovalForm |
|||
|
|||
}) |
|||
|
|||
onUpdated(async () => { |
|||
console.log("我更新了:") |
|||
updateSchema({ |
|||
field: 'flag', |
|||
componentProps: { |
|||
options: resButton.buttons, |
|||
} |
|||
}) |
|||
}) |
|||
|
|||
// 项目计划阶段详情table |
|||
const { tableContext: tableContextPlan } = useListPage({ |
|||
tableProps: { |
|||
size: 'small',//紧凑型表格 |
|||
title: '项目计划阶段详情', |
|||
api: queryPlanInfoMainTimeline, |
|||
columns: PlaninfoColumn, |
|||
showActionColumn: false, |
|||
useSearchForm: false, |
|||
beforeFetch(params) { |
|||
params.projectid = projectid; |
|||
}, |
|||
}, |
|||
}); |
|||
// BasicTable绑定注册 |
|||
const [registerPlanTable] = tableContextPlan; |
|||
|
|||
// 项目入库审批table |
|||
const { tableContext } = useListPage({ |
|||
tableProps: { |
|||
size: 'small',//紧凑型表格 |
|||
title: '流程审批情况', |
|||
api: queryProcessInfo, |
|||
columns: approveStartProcessColumns, |
|||
showActionColumn: false, |
|||
useSearchForm: false, |
|||
beforeFetch(params) { |
|||
params.stage = "3", |
|||
params.projectid = projectid |
|||
}, |
|||
}, |
|||
}); |
|||
// 流程审批情况表格绑定注册 |
|||
const [registerTable, { reload }] = tableContext; |
|||
const [registerApprovalForm, { validate: validateApprovalForm, getFieldsValue: getFieldsValueApprovalForm, updateSchema }] = useForm({ |
|||
//注册表单列 |
|||
schemas: approvalformSchemas, |
|||
//自定义查询按钮的文本和图标 |
|||
// submitButtonOptions: { text: '提交', preIcon: '' }, |
|||
//自定义重置按钮的文本和图标 |
|||
resetButtonOptions: { text: '取消', preIcon: '' }, |
|||
// showActionButtonGroup: false, |
|||
//回车提交 |
|||
// autoSubmitOnEnter: true, |
|||
// //不显示重置按钮 |
|||
// showResetButton: false, |
|||
//自定义提交按钮文本和图标 |
|||
submitButtonOptions: { text: '提交', preIcon: '' }, |
|||
//查询列占比 24代表一行 取值范围 0-24 |
|||
actionColOptions: { span: 14 }, |
|||
//提交按钮的自定义事件 |
|||
// submitFunc: customSubmitFunc, |
|||
//重置按钮的自定义时间 |
|||
resetFunc: customResetFunc, |
|||
labelCol: { style: { width: '120px' } }, |
|||
wrapperCol: { style: { width: 'auto' } }, |
|||
// disabled:true |
|||
}) |
|||
async function handleSubmit() { |
|||
let approvalform = await getFieldsValueApprovalForm(); |
|||
if (await validateApprovalForm()) { |
|||
const params = new FormData() |
|||
params.append("flag", approvalform.flag) |
|||
params.append("projectid", projectid) |
|||
params.append("comment", approvalform.comment) |
|||
params.append("taskId", taskid) |
|||
params.append("stage", route.query.stage) |
|||
if(fileList.length>0){ |
|||
params.append("file", fileList[0].file) |
|||
} |
|||
let res = await approvePlaninfo(params) |
|||
console.log("提交成功！", res) |
|||
router.go(-1) |
|||
} |
|||
} |
|||
async function customResetFunc() { |
|||
router.go(-1) |
|||
|
|||
} |
|||
function removeFile(option) { |
|||
for (let i = 0; i < fileList.length; i++) { |
|||
if (fileList[i].file.name == option.name) { |
|||
fileList.splice(i, 1) |
|||
} |
|||
} |
|||
|
|||
} |
|||
function httpRequest(option) { |
|||
fileList.push(option) |
|||
} |
|||
|
|||
// 上传前处理 |
|||
function beforeUpload(file) { |
|||
let fileSize = file.size |
|||
const FIVE_M = 5 * 1024 * 1024; |
|||
const fileSuffix = file.name.substring(file.name.lastIndexOf(".") + 1); |
|||
|
|||
let whiteList = ["xls", "xlsx"]; |
|||
|
|||
if (whiteList.indexOf(fileSuffix) === -1) { |
|||
ElMessage.error('上传文件只能是xls、xlsx格式'); |
|||
return false; |
|||
} |
|||
//大于5M，不允许上传 |
|||
if (fileSize > FIVE_M) { |
|||
ElMessage.error("最大上传5M") |
|||
return false |
|||
} |
|||
|
|||
return true |
|||
} |
|||
// 文件数量过多时提醒 |
|||
function handleExceed() { |
|||
ElMessage.warning("最多只能上传一个文件") |
|||
} |
|||
</script> |
|||
<style scoped> |
|||
.timeline { |
|||
display: flex; |
|||
width: 100%; |
|||
margin-bottom: 100px; |
|||
|
|||
.lineitem { |
|||
transform: translateX(50%); |
|||
width: 25%; |
|||
} |
|||
} |
|||
|
|||
:deep(.el-timeline-item__tail) { |
|||
border-left: none; |
|||
border-top: 2px solid #e4e7ed; |
|||
width: 100%; |
|||
position: absolute; |
|||
top: 9px; |
|||
} |
|||
|
|||
:deep(.el-timeline-item__wrapper) { |
|||
padding-left: 0; |
|||
position: absolute; |
|||
top: 20px; |
|||
transform: translateX(-50%); |
|||
text-align: center; |
|||
} |
|||
|
|||
:deep(.el-timeline-item__timestamp) { |
|||
font-size: 14px; |
|||
|
|||
} |
|||
</style> |
|||
|
|||
@ -0,0 +1,73 @@ |
|||
<template> |
|||
<div> |
|||
<!--引用表格--> |
|||
<BasicTable @register="registerTable"> |
|||
<!--插槽:table标题--> |
|||
<!--操作栏--> |
|||
<template #action="{ record }"> |
|||
<!-- <TableAction :actions="getTableAction(record)" /> --> |
|||
<TableAction :actions="getTableAction(record)" /> |
|||
</template> |
|||
</BasicTable> |
|||
</div> |
|||
<BasicModal @register="registeProjectrModal" title="项目信息详情" width="1200px" :showOkBtn="false"> |
|||
<Detaillist :projectid="proid" /> |
|||
</BasicModal> |
|||
</template> |
|||
|
|||
<script lang="ts" name="system-user" setup> |
|||
//ts语法 |
|||
import { ref } from 'vue'; |
|||
import { ActionItem, BasicTable, TableAction } from '/@/components/Table'; |
|||
import { useListPage } from '/@/hooks/system/useListPage'; |
|||
|
|||
import { BasicModal,useModal } from '/@/components/Modal'; |
|||
import { searchFormSchema } from '../projectInfo/projectInfo.data'; |
|||
import {columns} from './planinfoHistory.data' |
|||
// import { list } from './address.api'; |
|||
import Detaillist from './Detaillist.vue'; |
|||
import { planInfoHistoryPageList } from './planinfoHistory.api'; |
|||
import { useUserStore } from '/@/store/modules/user'; |
|||
|
|||
const userStore = useUserStore(); |
|||
let proid = ref(); |
|||
const [registeProjectrModal, { openModal: openModalProjectr }] = useModal();//项目详情 |
|||
|
|||
|
|||
const { tableContext } = useListPage({ |
|||
designScope: 'basic-table-demo-ajax', |
|||
tableProps: { |
|||
title: '项目信息', |
|||
api: planInfoHistoryPageList, |
|||
columns: columns, |
|||
actionColumn: { |
|||
width: 120, |
|||
fixed: "right", |
|||
}, |
|||
//表单查询项设置 |
|||
formConfig: { |
|||
schemas: searchFormSchema, |
|||
} |
|||
}, |
|||
}); |
|||
//BasicTable绑定注册 |
|||
const [registerTable, { reload }] = tableContext; |
|||
function getTableAction(record): ActionItem[] { |
|||
return [ |
|||
{ |
|||
label: '详情', |
|||
onClick: handleDetailpage.bind(null, record), |
|||
}, |
|||
|
|||
]; |
|||
} |
|||
|
|||
|
|||
function handleDetailpage(record) { |
|||
proid.value = record.id |
|||
openModalProjectr() |
|||
} |
|||
|
|||
</script> |
|||
|
|||
<style scoped></style>./projectInfoHistory.data |
|||
@ -0,0 +1,25 @@ |
|||
import { update } from 'lodash-es'; |
|||
import { defHttp } from '/@/utils/http/axios'; |
|||
|
|||
export enum Api { |
|||
|
|||
planInfoHistoryPageList = '/huzhouPlaninfoHistory/planInfoHistoryPageList', |
|||
singlePlanInfoHistoryPageList = '/huzhouPlaninfoHistory/singlePlanInfoHistoryPageList', |
|||
queryPlanInfoHistoryGroupList='huzhouPlaninfoHistory/queryPlanInfoHistoryGroupList' |
|||
} |
|||
|
|||
/** |
|||
* 职务list |
|||
*/ |
|||
export const planInfoHistoryPageList = (params?) =>defHttp.get({ url: Api.planInfoHistoryPageList, params }); |
|||
|
|||
export const singlePlanInfoHistoryPageList = (params?) =>defHttp.get({ url: Api.singlePlanInfoHistoryPageList, params }); |
|||
export const queryPlanInfoHistoryGroupList = (params?) =>defHttp.get({ url: Api.queryPlanInfoHistoryGroupList, params }); |
|||
|
|||
|
|||
|
|||
|
|||
|
|||
|
|||
|
|||
|
|||
@ -0,0 +1,61 @@ |
|||
import { BasicColumn } from '/@/components/Table'; |
|||
|
|||
// function approvalRsesult(){
|
|||
// for(let i = 0;i<approvalRsesults.length;i++){
|
|||
// approvalRsesults[i].label=approvalRsesults[i].text;
|
|||
// }
|
|||
// return approvalRsesults
|
|||
// }
|
|||
export const columns: BasicColumn[] = [ |
|||
{ |
|||
title: '项目编号', |
|||
width: 150, |
|||
dataIndex: 'id', |
|||
}, |
|||
{ |
|||
title: '项目名称', |
|||
dataIndex: 'projectName', |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: '主要任务及标志性成果', |
|||
dataIndex: 'description', |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: '责任单位', |
|||
dataIndex: 'dutyWorkplace', |
|||
width: 100, |
|||
}, |
|||
{ |
|||
title: '联系电话', |
|||
width: 150, |
|||
dataIndex: 'phone', |
|||
}, |
|||
|
|||
]; |
|||
export const columnschild: BasicColumn[] = [ |
|||
{ |
|||
title: 'id', |
|||
width: 150, |
|||
dataIndex: 'id', |
|||
}, |
|||
|
|||
{ |
|||
title: '项目编号', |
|||
width: 150, |
|||
dataIndex: 'projectId', |
|||
}, |
|||
{ |
|||
title: '创建时间', |
|||
dataIndex: 'createtime', |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: 'groupId', |
|||
dataIndex: 'groupId', |
|||
width: 150, |
|||
|
|||
}, |
|||
|
|||
]; |
|||
@ -0,0 +1,76 @@ |
|||
<template> |
|||
<div> |
|||
<!--引用表格--> |
|||
<BasicTable @register="registerTable"> |
|||
<!--插槽:table标题--> |
|||
<!--操作栏--> |
|||
<template #action="{ record }"> |
|||
<!-- <TableAction :actions="getTableAction(record)" /> --> |
|||
<TableAction :actions="getTableAction(record)" /> |
|||
</template> |
|||
</BasicTable> |
|||
</div> |
|||
<BasicModal @register="registeProjectrModal" title="项目信息详情" width="1200px" :showOkBtn="false"> |
|||
<planinfoHistoryDetailpage :projectid="proid" :groupid="groupid" /> |
|||
</BasicModal> |
|||
</template> |
|||
|
|||
<script lang="ts" name="system-user" setup> |
|||
//ts语法 |
|||
import { ref } from 'vue'; |
|||
import { ActionItem, BasicTable, TableAction } from '/@/components/Table'; |
|||
import { useListPage } from '/@/hooks/system/useListPage'; |
|||
|
|||
import { BasicModal,useModal } from '/@/components/Modal'; |
|||
import {columnschild} from './planinfoHistory.data' |
|||
// import { list } from './address.api'; |
|||
import planinfoHistoryDetailpage from './planinfoHistoryDetailpage.vue'; |
|||
import { singlePlanInfoHistoryPageList } from './planinfoHistory.api'; |
|||
import { useUserStore } from '/@/store/modules/user'; |
|||
let dataTo = defineProps(["projectid"]) |
|||
|
|||
const userStore = useUserStore(); |
|||
let proid = ref(); |
|||
let groupid = ref(); |
|||
const [registeProjectrModal, { openModal: openModalProjectr }] = useModal();//项目详情 |
|||
|
|||
|
|||
const { tableContext } = useListPage({ |
|||
designScope: 'basic-table-demo-ajax', |
|||
tableProps: { |
|||
title: '项目计划信息', |
|||
api: singlePlanInfoHistoryPageList, |
|||
columns: columnschild, |
|||
actionColumn: { |
|||
width: 120, |
|||
fixed: "right", |
|||
}, |
|||
useSearchForm: false, |
|||
|
|||
beforeFetch(params) { |
|||
params.projectId = dataTo.projectid |
|||
}, |
|||
}, |
|||
}); |
|||
//BasicTable绑定注册 |
|||
const [registerTable, { reload }] = tableContext; |
|||
function getTableAction(record): ActionItem[] { |
|||
return [ |
|||
{ |
|||
label: '详情', |
|||
onClick: handleDetailpage.bind(null, record), |
|||
}, |
|||
|
|||
]; |
|||
} |
|||
|
|||
|
|||
function handleDetailpage(record) { |
|||
proid.value = record.projectId |
|||
groupid.value =record.groupId |
|||
openModalProjectr() |
|||
} |
|||
|
|||
</script> |
|||
|
|||
<style scoped></style>./projectInfoHistory.data |
|||
@ -0,0 +1,41 @@ |
|||
<template> |
|||
<el-divider content-position="left">项目计划阶段详情</el-divider> |
|||
<BasicTable @register="registerPlanTable"> |
|||
</BasicTable> |
|||
</template> |
|||
<script lang="ts" name="planinfoHistoryDetailpage" setup> |
|||
import { ref, defineProps, onMounted,onUpdated } from 'vue' |
|||
import { useForm, BasicForm } from '/@/components/Form'; |
|||
import { PlaninfoColumn } from '../../projectLib/projectPlan/projectPlan.data'; |
|||
import { queryPlanInfoHistoryGroupList } from './planinfoHistory.api'; |
|||
import { ActionItem, BasicTable, TableAction } from '/@/components/Table'; |
|||
import { useListPage } from '/@/hooks/system/useListPage'; |
|||
import { getUserInfoByid } from '../initiatesProjects/initiatesProjects.api' |
|||
|
|||
let dataTo = defineProps(["projectid","groupid"]) |
|||
let projectstage = ref() |
|||
|
|||
|
|||
// 项目计划阶段详情table |
|||
const { tableContext: tableContextPlan } = useListPage({ |
|||
tableProps: { |
|||
size: 'small',//紧凑型表格 |
|||
title: '项目计划阶段详情', |
|||
api: queryPlanInfoHistoryGroupList, |
|||
columns: PlaninfoColumn, |
|||
showActionColumn: false, |
|||
useSearchForm: false, |
|||
beforeFetch(params) { |
|||
params.projectId = dataTo.projectid; |
|||
params.groupId = dataTo.groupid; |
|||
}, |
|||
}, |
|||
}); |
|||
// BasicTable绑定注册 |
|||
const [registerPlanTable] = tableContextPlan; |
|||
|
|||
|
|||
|
|||
</script> |
|||
<style></style> |
|||
./projectInfoHistory.data |
|||
@ -0,0 +1,113 @@ |
|||
<template> |
|||
<!-- 自定义表单 --> |
|||
<el-divider content-position="left">模板表格文件下载</el-divider> |
|||
<div style="padding-left: 40px;"> |
|||
<el-button slot="trigger" type="primary" @click="downexcel">下载模板</el-button> |
|||
</div> |
|||
<el-divider content-position="left">上传表格文件</el-divider> |
|||
<el-form ref="importFormRef" label-width="130px"> |
|||
<el-form-item label="上传文件:"> |
|||
<el-upload class="upload-demo" ref="upload" action :http-request="httpRequest" :before-upload="beforeUpload" |
|||
:on-exceed="handleExceed" :limit="1" accept=".xls, .xlsx"> |
|||
<el-button slot="trigger" size="small" type="primary">选取文件</el-button> |
|||
<div slot="tip" class="el-upload__tip">只能上传excel文件且不超过5M</div> |
|||
</el-upload> |
|||
</el-form-item> |
|||
<el-form-item> |
|||
<el-button type="primary" @click="submitImportForm">开始导入</el-button> |
|||
<el-button type="info" @click="dialogVisible">关闭窗口</el-button> |
|||
</el-form-item> |
|||
</el-form> |
|||
</template> |
|||
<script lang="ts" name="uploadFile" setup> |
|||
import { ref, reactive, defineProps, watchEffect } from 'vue' |
|||
import { useForm } from '/@/components/Form'; |
|||
import { formSchemas } from './projectInfo.data'; |
|||
import { batchImportProjects } from './projectInfo.api'; |
|||
import { ElMessage } from 'element-plus' |
|||
import { downloadFile } from "../../../api/common/api" |
|||
|
|||
|
|||
let fileList = reactive<Array<any>>([]); |
|||
let dataTo = defineProps(["projectid"]) |
|||
const emit = defineEmits(['close']); |
|||
//加载项目数据 |
|||
watchEffect(async () => { |
|||
console.log("dataTo", dataTo, dataTo.projectid) |
|||
}) |
|||
|
|||
function downexcel(){ |
|||
let param = { |
|||
path: "Resources/项目入库模板.xlsx", |
|||
fileName: "项目入库模板.xlsx" |
|||
} |
|||
downloadFile("/huzhouUploadfileinfo/downloadfile", "项目入库模板.xlsx", param) |
|||
|
|||
} |
|||
|
|||
|
|||
|
|||
function httpRequest(option) { |
|||
fileList.pop() |
|||
fileList.push(option) |
|||
} |
|||
// 上传前处理 |
|||
function beforeUpload(file) { |
|||
let fileSize = file.size |
|||
const FIVE_M = 5 * 1024 * 1024; |
|||
//大于5M，不允许上传 |
|||
if (fileSize > FIVE_M) { |
|||
ElMessage.error("最大上传5M") |
|||
return false |
|||
} |
|||
//判断文件类型，必须是xlsx格式 |
|||
|
|||
const fileSuffix = file.name.substring(file.name.lastIndexOf(".") + 1); |
|||
|
|||
let whiteList = ["xls", "xlsx"]; |
|||
|
|||
if (whiteList.indexOf(fileSuffix) === -1) { |
|||
ElMessage.error('上传文件只能是xls、xlsx格式'); |
|||
return false; |
|||
} |
|||
// let fileName = file.name |
|||
// let reg = /^.+(\.xlsx)$/ |
|||
// if(!reg.test(fileName)){ |
|||
// ElMessage.error("只能上传xlsx!") |
|||
// return false |
|||
// } |
|||
return true |
|||
} |
|||
// 文件数量过多时提醒 |
|||
function handleExceed() { |
|||
ElMessage.warning("最多只能上传一个文件") |
|||
} |
|||
//导入Excel病种信息数据 |
|||
async function submitImportForm() { |
|||
// console.log("datadatadatadatadatadata", data) |
|||
// if (data.stage != 2) { |
|||
// ElMessage({ |
|||
// message: "当前阶段无法上传文件", |
|||
// type: "error" |
|||
// }) |
|||
// return |
|||
// } |
|||
// // 使用form表单的数据格式 |
|||
const params = new FormData() |
|||
// 将上传文件数组依次添加到参数paramsData中 |
|||
// fileList.forEach((x) => { |
|||
// console.log("xxxxxxxxxx", x, x.file) |
|||
|
|||
// }); |
|||
params.append('file', fileList[0].file) |
|||
|
|||
//这里根据自己封装的axios来进行调用后端接口 |
|||
batchImportProjects(params).then(() => { |
|||
emit("close") |
|||
}) |
|||
} |
|||
function dialogVisible() { |
|||
emit("close") |
|||
} |
|||
</script> |
|||
<style></style> |
|||
@ -0,0 +1,74 @@ |
|||
<template> |
|||
<div> |
|||
<!--引用表格--> |
|||
<BasicTable @register="registerTable"> |
|||
<!--插槽:table标题--> |
|||
<!--操作栏--> |
|||
<template #action="{ record }"> |
|||
<!-- <TableAction :actions="getTableAction(record)" /> --> |
|||
<TableAction :actions="getTableAction(record)" /> |
|||
</template> |
|||
</BasicTable> |
|||
</div> |
|||
<BasicModal @register="registeProjectrModal" title="项目信息详情" width="1200px" :showOkBtn="false"> |
|||
<Detailpage :projectid="proid" /> |
|||
</BasicModal> |
|||
</template> |
|||
|
|||
<script lang="ts" name="system-user" setup> |
|||
//ts语法 |
|||
import { ref } from 'vue'; |
|||
import { ActionItem, BasicTable, TableAction } from '/@/components/Table'; |
|||
import { useListPage } from '/@/hooks/system/useListPage'; |
|||
|
|||
import { BasicModal,useModal } from '/@/components/Modal'; |
|||
import {columns} from './projectInfoHistory.data' |
|||
// import { list } from './address.api'; |
|||
import Detailpage from './Detailpage.vue'; |
|||
import { singleProjectInfoHistoryPageList } from './projectInfoHistory.api'; |
|||
import { useUserStore } from '/@/store/modules/user'; |
|||
let dataTo = defineProps(["projectid"]) |
|||
|
|||
const userStore = useUserStore(); |
|||
let proid = ref(); |
|||
const [registeProjectrModal, { openModal: openModalProjectr }] = useModal();//项目详情 |
|||
|
|||
|
|||
const { tableContext } = useListPage({ |
|||
designScope: 'basic-table-demo-ajax', |
|||
tableProps: { |
|||
title: '项目信息', |
|||
api: singleProjectInfoHistoryPageList, |
|||
columns: columns, |
|||
actionColumn: { |
|||
width: 120, |
|||
fixed: "right", |
|||
}, |
|||
useSearchForm: false, |
|||
|
|||
beforeFetch(params) { |
|||
params.projectId = dataTo.projectid |
|||
}, |
|||
}, |
|||
}); |
|||
//BasicTable绑定注册 |
|||
const [registerTable, { reload }] = tableContext; |
|||
function getTableAction(record): ActionItem[] { |
|||
return [ |
|||
{ |
|||
label: '详情', |
|||
onClick: handleDetailpage.bind(null, record), |
|||
}, |
|||
|
|||
]; |
|||
} |
|||
|
|||
|
|||
function handleDetailpage(record) { |
|||
proid.value = record.id |
|||
openModalProjectr() |
|||
} |
|||
|
|||
</script> |
|||
|
|||
<style scoped></style>./projectInfoHistory.data |
|||
@ -0,0 +1,111 @@ |
|||
<template> |
|||
<!-- 自定义表单 --> |
|||
<el-divider content-position="left">项目入库详情</el-divider> |
|||
<BasicForm @register="registerProjectForm" /> |
|||
</template> |
|||
<script lang="ts" name="Detailpage" setup> |
|||
import { ref, defineProps, onMounted,onUpdated } from 'vue' |
|||
import { useForm, BasicForm } from '/@/components/Form'; |
|||
import { formSchemas, } from '../projectInfo/projectInfo.data'; |
|||
import { queryProjectInfoHistoryById } from './projectInfoHistory.api'; |
|||
import { ActionItem, BasicTable, TableAction } from '/@/components/Table'; |
|||
import { useListPage } from '/@/hooks/system/useListPage'; |
|||
import { getUserInfoByid } from '../initiatesProjects/initiatesProjects.api' |
|||
|
|||
let dataTo = defineProps(["projectid"]) |
|||
let projectstage = ref() |
|||
|
|||
onMounted(async () => { |
|||
console.log("projectid", dataTo.projectid) |
|||
let param: any = { |
|||
id: dataTo.projectid |
|||
} |
|||
let resProject = await queryProjectInfoHistoryById(param) |
|||
setFieldsValue(resProject) |
|||
projectstage.value = resProject.stage |
|||
console.log("projectid", dataTo.projectid, projectstage.value) |
|||
}) |
|||
onUpdated(async()=>{ |
|||
let proform = getFieldsValueProjectForm() |
|||
for (let key in proform) { |
|||
if (key.indexOf("Contactor") != -1&&proform[key]!=null) { |
|||
let userid = proform[key] |
|||
let res = await getUserInfoByid({ id: userid }) |
|||
console.log("Contactor",key, res) |
|||
updateProjectSchema({ |
|||
field: key, |
|||
componentProps: { |
|||
options: [{ |
|||
value: userid, |
|||
label: res.realname |
|||
} |
|||
], |
|||
} |
|||
}) |
|||
} |
|||
} |
|||
}) |
|||
/** |
|||
* BasicForm绑定注册; |
|||
* useForm 是整个框架的核心用于表单渲染，里边封装了很多公共方法; |
|||
* 支持（schemas: 渲染表单列，autoSubmitOnEnter：回车提交,submitButtonOptions：自定义按钮文本和图标等方法）； |
|||
* 平台通过此封装，简化了代码，支持自定义扩展; |
|||
*/ |
|||
const [registerProjectForm, { setFieldsValue,getFieldsValue: getFieldsValueProjectForm, setProps, updateSchema: updateProjectSchema }] = useForm({ |
|||
//注册表单列 |
|||
schemas: formSchemas, |
|||
showActionButtonGroup: false, |
|||
//回车提交 |
|||
// autoSubmitOnEnter: true, |
|||
// //不显示重置按钮 |
|||
// showResetButton: false, |
|||
//自定义提交按钮文本和图标 |
|||
// submitButtonOptions: { text: '提交', preIcon: '' }, |
|||
//查询列占比 24代表一行 取值范围 0-24 |
|||
// actionColOptions: { span: 17 }, |
|||
labelCol: { style: { width: '120px' } }, |
|||
wrapperCol: { style: { width: 'auto' } }, |
|||
disabled: true |
|||
}); |
|||
|
|||
//项目入库审批table |
|||
// const { tableContext: approveStarttableContext } = useListPage({ |
|||
// tableProps: { |
|||
// size: 'small',//紧凑型表格 |
|||
// title: '审批详情', |
|||
// api: queryProcessInfo, |
|||
// columns: approveStartProcessColumns, |
|||
// showActionColumn: false, |
|||
// useSearchForm: false, |
|||
// beforeFetch(params) { |
|||
// params.stage = projectstage.value>=3?"2":"1", |
|||
// params.projectid = dataTo.projectid |
|||
// }, |
|||
// }, |
|||
// }); |
|||
// BasicTable绑定注册 |
|||
// const [registerApproveStartTable] = approveStarttableContext; |
|||
|
|||
// //项目资料table |
|||
// const { tableContext } = useListPage({ |
|||
// tableProps: { |
|||
// size: 'small',//紧凑型表格 |
|||
// title: '项目入库资料详情', |
|||
// api: queryResourceInfo, |
|||
// columns: resourcetableColumns, |
|||
// useSearchForm: false, |
|||
// actionColumn: { |
|||
// width: 120, |
|||
// fixed: "right", |
|||
// }, |
|||
// beforeFetch(params) { |
|||
// params.stage = "1", |
|||
// params.projectid = dataTo.projectid |
|||
// }, |
|||
// }, |
|||
// }); |
|||
// const [registerResourceTable] = tableContext; |
|||
|
|||
</script> |
|||
<style></style> |
|||
./projectInfoHistory.data |
|||
@ -0,0 +1,73 @@ |
|||
<template> |
|||
<div> |
|||
<!--引用表格--> |
|||
<BasicTable @register="registerTable"> |
|||
<!--插槽:table标题--> |
|||
<!--操作栏--> |
|||
<template #action="{ record }"> |
|||
<!-- <TableAction :actions="getTableAction(record)" /> --> |
|||
<TableAction :actions="getTableAction(record)" /> |
|||
</template> |
|||
</BasicTable> |
|||
</div> |
|||
<BasicModal @register="registeProjectrModal" title="项目信息详情" width="1200px" :showOkBtn="false"> |
|||
<Detaillist :projectid="proid" /> |
|||
</BasicModal> |
|||
</template> |
|||
|
|||
<script lang="ts" name="system-user" setup> |
|||
//ts语法 |
|||
import { ref } from 'vue'; |
|||
import { ActionItem, BasicTable, TableAction } from '/@/components/Table'; |
|||
import { useListPage } from '/@/hooks/system/useListPage'; |
|||
|
|||
import { BasicModal,useModal } from '/@/components/Modal'; |
|||
import { searchFormSchema } from '../projectInfo/projectInfo.data'; |
|||
import {columns} from './projectInfoHistory.data' |
|||
// import { list } from './address.api'; |
|||
import Detaillist from './Detaillist.vue'; |
|||
import { projectInfoHistoryPageList } from './projectInfoHistory.api'; |
|||
import { useUserStore } from '/@/store/modules/user'; |
|||
|
|||
const userStore = useUserStore(); |
|||
let proid = ref(); |
|||
const [registeProjectrModal, { openModal: openModalProjectr }] = useModal();//项目详情 |
|||
|
|||
|
|||
const { tableContext } = useListPage({ |
|||
designScope: 'basic-table-demo-ajax', |
|||
tableProps: { |
|||
title: '项目信息', |
|||
api: projectInfoHistoryPageList, |
|||
columns: columns, |
|||
actionColumn: { |
|||
width: 120, |
|||
fixed: "right", |
|||
}, |
|||
//表单查询项设置 |
|||
formConfig: { |
|||
schemas: searchFormSchema, |
|||
} |
|||
}, |
|||
}); |
|||
//BasicTable绑定注册 |
|||
const [registerTable, { reload }] = tableContext; |
|||
function getTableAction(record): ActionItem[] { |
|||
return [ |
|||
{ |
|||
label: '详情', |
|||
onClick: handleDetailpage.bind(null, record), |
|||
}, |
|||
|
|||
]; |
|||
} |
|||
|
|||
|
|||
function handleDetailpage(record) { |
|||
proid.value = record.id |
|||
openModalProjectr() |
|||
} |
|||
|
|||
</script> |
|||
|
|||
<style scoped></style>./projectInfoHistory.data |
|||
@ -0,0 +1,25 @@ |
|||
import { update } from 'lodash-es'; |
|||
import { defHttp } from '/@/utils/http/axios'; |
|||
|
|||
export enum Api { |
|||
|
|||
projectInfoHistoryPageList = '/huzhouProjectinfoHistory/projectInfoHistoryPageList', |
|||
singleProjectInfoHistoryPageList = '/huzhouProjectinfoHistory/singleProjectInfoHistoryPageList', |
|||
queryProjectInfoHistoryById='huzhouProjectinfoHistory/queryProjectInfoHistoryById' |
|||
} |
|||
|
|||
/** |
|||
* 职务list |
|||
*/ |
|||
export const projectInfoHistoryPageList = (params?) =>defHttp.get({ url: Api.projectInfoHistoryPageList, params }); |
|||
|
|||
export const singleProjectInfoHistoryPageList = (params?) =>defHttp.get({ url: Api.singleProjectInfoHistoryPageList, params }); |
|||
export const queryProjectInfoHistoryById = (params?) =>defHttp.get({ url: Api.queryProjectInfoHistoryById, params }); |
|||
|
|||
|
|||
|
|||
|
|||
|
|||
|
|||
|
|||
|
|||
@ -0,0 +1,808 @@ |
|||
import { FormSchema } from '/@/components/Form'; |
|||
import { BasicColumn } from '/@/components/Table'; |
|||
import { getDictItemsByCode } from '/@/utils/dict/index'; |
|||
import { UploadTypeEnum } from '/@/components/Form/src/jeecg/components/JUpload'; |
|||
import { size } from 'lodash-es'; |
|||
import { el } from 'element-plus/es/locale'; |
|||
|
|||
const projectTypeDicts: Array<Object> = getDictItemsByCode("projectType") |
|||
const approvalRsesults: Array<Object> = getDictItemsByCode("approvalResult") |
|||
import { getWorkPlaceTypeDict, getContactorDict, getUserInfoByid } from '../initiatesProjects/initiatesProjects.api' |
|||
|
|||
let manageOrgDict = await getWorkPlaceTypeDict({ workPlaceType: "1" }) |
|||
let supervisorDict = await getWorkPlaceTypeDict({ workPlaceType: "2" }) |
|||
let contructorDict = await getWorkPlaceTypeDict({ workPlaceType: "4" }) |
|||
let ownerDict = await getWorkPlaceTypeDict({ workPlaceType: "3" }) |
|||
let controlerDict = await getWorkPlaceTypeDict({ workPlaceType: "6" }) |
|||
let consultDict = await getWorkPlaceTypeDict({ workPlaceType: "5" }) |
|||
function projectTypeDict() { |
|||
for (let i = 0; i < projectTypeDicts.length; i++) { |
|||
projectTypeDicts[i].label = projectTypeDicts[i].text; |
|||
} |
|||
return projectTypeDicts |
|||
} |
|||
|
|||
const projectStageDicts: Array<Object> = getDictItemsByCode("projectStage") |
|||
function projectStageDict() { |
|||
for (let i = 0; i < projectStageDicts.length; i++) { |
|||
projectStageDicts[i].label = projectStageDicts[i].text; |
|||
} |
|||
return projectStageDicts |
|||
} |
|||
// function approvalRsesult(){
|
|||
// for(let i = 0;i<approvalRsesults.length;i++){
|
|||
// approvalRsesults[i].label=approvalRsesults[i].text;
|
|||
// }
|
|||
// return approvalRsesults
|
|||
// }
|
|||
export const columns: BasicColumn[] = [ |
|||
|
|||
{ |
|||
title: '项目编号', |
|||
width: 150, |
|||
dataIndex: 'id', |
|||
}, |
|||
{ |
|||
title: '项目名称', |
|||
dataIndex: 'projectName', |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: '主要任务及标志性成果', |
|||
dataIndex: 'description', |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: '责任单位', |
|||
dataIndex: 'dutyWorkplace', |
|||
width: 100, |
|||
}, |
|||
{ |
|||
title: '联系电话', |
|||
width: 150, |
|||
dataIndex: 'phone', |
|||
}, |
|||
|
|||
]; |
|||
const reformTasksDicts: Array<Object> = getDictItemsByCode("reformTasks") |
|||
function reformTasksDict() { |
|||
for (let i = 0; i < reformTasksDicts.length; i++) { |
|||
reformTasksDicts[i].label = reformTasksDicts[i].text; |
|||
} |
|||
return reformTasksDicts |
|||
} |
|||
const roomDicts: Array<Object> = getDictItemsByCode("room") |
|||
function roomDict() { |
|||
for (let i = 0; i < roomDicts.length; i++) { |
|||
roomDicts[i].label = roomDicts[i].text; |
|||
} |
|||
return roomDicts |
|||
} |
|||
export const searchFormSchema: FormSchema[] = [ |
|||
{ |
|||
label: '项目名称', |
|||
field: 'projectName', |
|||
component: 'Input', |
|||
//colProps: { span: 6 },
|
|||
}, |
|||
{ |
|||
label: '项目编号', |
|||
field: 'projectId', |
|||
component: 'Input', |
|||
//colProps: { span: 6 },
|
|||
} |
|||
|
|||
]; |
|||
export const uploadFileformSchemas: FormSchema[] = [ |
|||
{ |
|||
field: 'uploadFile', |
|||
component: 'JUpload', |
|||
helpMessage: '最多上传3个文件', |
|||
label: '上传文件', |
|||
componentProps: { maxCount: 3 }, |
|||
}, |
|||
{ |
|||
field: 'uploadImage', |
|||
component: 'JUpload', |
|||
label: '上传图片', |
|||
helpMessage: '无限制上传', |
|||
componentProps: { |
|||
fileType: UploadTypeEnum.image, |
|||
}, |
|||
}, |
|||
|
|||
] |
|||
|
|||
export const formSchemas: FormSchema[] = [ |
|||
{ |
|||
//标题名称
|
|||
label: '项目id', |
|||
//字段
|
|||
field: 'id', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'Input', |
|||
//标题宽度,支持数字和字符串
|
|||
// labelWidth: 150,
|
|||
// //标题长度，超过位数隐藏
|
|||
// labelLength: 3,
|
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
ifShow: false |
|||
}, |
|||
{ |
|||
//标题名称
|
|||
label: '项目名称', |
|||
//字段
|
|||
field: 'projectName', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'Input', |
|||
//标题宽度,支持数字和字符串
|
|||
// labelWidth: 150,
|
|||
// //标题长度，超过位数隐藏
|
|||
// labelLength: 3,
|
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
required: true, |
|||
}, |
|||
{ |
|||
label: '行政区划', |
|||
field: 'adminDivision', |
|||
//子标题名称（在主标题后面）
|
|||
component: 'Input', |
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
required: true, |
|||
}, |
|||
// {
|
|||
// label: '项目类型',
|
|||
// field: 'projectType',
|
|||
// component: 'Select',
|
|||
// colProps: { span: 12 },
|
|||
|
|||
// //填写组件Select的属性
|
|||
// componentProps: {
|
|||
// options:projectTypeDict()
|
|||
// },
|
|||
// //默认值
|
|||
// defaultValue: 1,
|
|||
// required: true,
|
|||
|
|||
// },
|
|||
{ |
|||
label: '主要任务', |
|||
field: 'description', |
|||
//子标题名称（在主标题后面）
|
|||
component: 'InputTextArea', |
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 24 }, |
|||
required: true, |
|||
}, |
|||
|
|||
{ |
|||
//标题名称
|
|||
label: '责任单位', |
|||
//字段
|
|||
field: 'dutyWorkplace', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'Input', |
|||
|
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
required: true, |
|||
}, |
|||
{ |
|||
//标题名称
|
|||
label: '单位属性', |
|||
//字段
|
|||
field: 'workplaceProperties', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'Input', |
|||
|
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
required: true, |
|||
}, |
|||
{ |
|||
//标题名称
|
|||
label: '建设周期(月)', |
|||
//字段
|
|||
field: 'constructionPeriod', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'InputNumber', |
|||
componentProps: { |
|||
//数值精度
|
|||
precision: 0, |
|||
//步数
|
|||
step: 0.1 |
|||
}, |
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
required: true, |
|||
}, |
|||
{ |
|||
//标题名称
|
|||
label: '总投资(元)', |
|||
//字段
|
|||
field: 'totalMoney', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'InputNumber', |
|||
componentProps: { |
|||
//带标签的 input，设置后置标签
|
|||
addonBefore: '保留两位小数', |
|||
//数值精度
|
|||
precision: 2, |
|||
//步数
|
|||
step: 1 |
|||
}, |
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
required: true, |
|||
}, |
|||
{ |
|||
//标题名称
|
|||
label: '中央资金(元)', |
|||
//字段
|
|||
field: 'centralMoney', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'InputNumber', |
|||
componentProps: { |
|||
//带标签的 input，设置后置标签
|
|||
addonBefore: '保留两位小数', |
|||
//数值精度
|
|||
precision: 2, |
|||
//步数
|
|||
step: 1 |
|||
}, |
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
required: true, |
|||
}, |
|||
{ |
|||
//标题名称
|
|||
label: '省级资金(元)', |
|||
//字段
|
|||
field: 'provincialMoney', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'InputNumber', |
|||
componentProps: { |
|||
//带标签的 input，设置后置标签
|
|||
addonBefore: '保留两位小数', |
|||
//数值精度
|
|||
precision: 2, |
|||
//步数
|
|||
step: 1 |
|||
}, |
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
required: true, |
|||
}, |
|||
{ |
|||
//标题名称
|
|||
label: '市级资金(元)', |
|||
//字段
|
|||
field: 'cityMoney', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'InputNumber', |
|||
componentProps: { |
|||
//带标签的 input，设置后置标签
|
|||
addonBefore: '保留两位小数', |
|||
|
|||
//数值精度
|
|||
precision: 2, |
|||
//步数
|
|||
step: 1 |
|||
}, |
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
required: true, |
|||
}, |
|||
{ |
|||
//标题名称
|
|||
label: '区县级资金(元)', |
|||
//字段
|
|||
field: 'countyMoney', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'InputNumber', |
|||
componentProps: { |
|||
//带标签的 input，设置后置标签
|
|||
addonBefore: '保留两位小数', |
|||
|
|||
//数值精度
|
|||
precision: 2, |
|||
//步数
|
|||
step: 1 |
|||
}, |
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
required: true, |
|||
}, |
|||
{ |
|||
//标题名称
|
|||
label: '自筹资金(元)', |
|||
//字段
|
|||
field: 'selfMoney', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'InputNumber', |
|||
componentProps: { |
|||
//带标签的 input，设置后置标签
|
|||
addonBefore: '保留两位小数', |
|||
|
|||
//数值精度
|
|||
precision: 2, |
|||
//步数
|
|||
step: 1 |
|||
}, |
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
required: true, |
|||
}, |
|||
{ |
|||
//标题名称
|
|||
label: '2023年支付(元)', |
|||
//字段
|
|||
field: 'payamount2023Money', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'InputNumber', |
|||
componentProps: { |
|||
//带标签的 input，设置后置标签
|
|||
addonBefore: '保留两位小数', |
|||
|
|||
//数值精度
|
|||
precision: 2, |
|||
//步数
|
|||
step: 1 |
|||
}, |
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
required: true, |
|||
}, |
|||
{ |
|||
//标题名称
|
|||
label: '2024年支付(元)', |
|||
//字段
|
|||
field: 'payamount2024Money', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'InputNumber', |
|||
componentProps: { |
|||
//带标签的 input，设置后置标签
|
|||
addonBefore: '保留两位小数', |
|||
|
|||
//数值精度
|
|||
precision: 2, |
|||
//步数
|
|||
step: 1 |
|||
}, |
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
required: true, |
|||
}, { |
|||
//标题名称
|
|||
label: '2025年支付(元)', |
|||
//字段
|
|||
field: 'payamount2025Money', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'InputNumber', |
|||
componentProps: { |
|||
//带标签的 input，设置后置标签
|
|||
addonBefore: '保留两位小数', |
|||
|
|||
//数值精度
|
|||
precision: 2, |
|||
//步数
|
|||
step: 1 |
|||
}, |
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
required: true, |
|||
}, |
|||
|
|||
{ |
|||
//标题名称
|
|||
label: '改革所属项目', |
|||
//字段
|
|||
field: 'reformName', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'Select', |
|||
|
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
required: true, |
|||
componentProps:{ |
|||
options:reformTasksDict() |
|||
} |
|||
}, |
|||
{ |
|||
//标题名称
|
|||
label: '上级指导室', |
|||
//字段
|
|||
field: 'superLeader', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'Select', |
|||
|
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
required: true, |
|||
componentProps:{ |
|||
options:roomDict() |
|||
} |
|||
}, |
|||
{ |
|||
//标题名称
|
|||
label: '项目联系人', |
|||
//字段
|
|||
field: 'projectContacts', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'Input', |
|||
|
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
required: true, |
|||
}, |
|||
{ |
|||
//标题名称
|
|||
label: '联系电话', |
|||
//字段
|
|||
field: 'phone', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'Input', |
|||
|
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
required: true, |
|||
}, |
|||
{ |
|||
//标题名称
|
|||
label: '管理单位', |
|||
//字段
|
|||
field: 'manageOrg', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'Select', |
|||
componentProps: ({ formModel, formActionType }) => { |
|||
console.log("formModel", formModel, "formActionType", formActionType) |
|||
return { |
|||
//
|
|||
options: manageOrgDict, |
|||
onChange: async (value) => { |
|||
// console.log(e)
|
|||
let manageContactorDict = await getContactorDict({ workPlace: value, workPlaceType: "1" }) |
|||
// formModel.manageContactor = undefined; // reset city value
|
|||
const { updateSchema, setFieldsValue } = formActionType; |
|||
updateSchema({ |
|||
field: 'manageContactor', |
|||
componentProps: { |
|||
options: manageContactorDict, |
|||
}, |
|||
}); |
|||
setFieldsValue({ manageContactor: "" }) |
|||
}, |
|||
}; |
|||
}, |
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
}, |
|||
|
|||
{ |
|||
//标题名称
|
|||
label: '管理单位负责人', |
|||
//字段
|
|||
field: 'manageContactor', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'Select', |
|||
componentProps: (({ formModel }) => { |
|||
console.log("formModel.manageContactor", formModel, formModel.manageContactor) |
|||
return { |
|||
options: [] |
|||
} |
|||
|
|||
}), |
|||
|
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
}, |
|||
{ |
|||
//标题名称
|
|||
label: '监管单位', |
|||
//字段
|
|||
field: 'supervisor', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'Select', |
|||
componentProps: ({ formModel, formActionType }) => { |
|||
console.log("formModel", formModel, "formActionType", formActionType) |
|||
return { |
|||
//
|
|||
options: supervisorDict, |
|||
onChange: async (value) => { |
|||
// console.log(e)
|
|||
let supervisorContactorDict = await getContactorDict({ workPlace: value, workPlaceType: "2" }) |
|||
// formModel.manageContactor = undefined; // reset city value
|
|||
const { updateSchema, setFieldsValue } = formActionType; |
|||
updateSchema({ |
|||
field: 'supervisorContactor', |
|||
componentProps: { |
|||
options: supervisorContactorDict, |
|||
}, |
|||
}); |
|||
setFieldsValue({ supervisorContactor: "" }) |
|||
}, |
|||
}; |
|||
}, |
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
}, |
|||
{ |
|||
//标题名称
|
|||
label: '监管单位负责人', |
|||
//字段
|
|||
field: 'supervisorContactor', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'Select', |
|||
componentProps: { |
|||
options: [], |
|||
|
|||
}, |
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
}, |
|||
|
|||
{ |
|||
//标题名称
|
|||
label: '承建单位', |
|||
//字段
|
|||
field: 'contructor', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'Select', |
|||
componentProps: ({ formModel, formActionType }) => { |
|||
console.log("formModel", formModel, "formActionType", formActionType) |
|||
return { |
|||
//
|
|||
options: contructorDict, |
|||
onChange: async (value) => { |
|||
// console.log(e)
|
|||
let contructorContactorDict = await getContactorDict({ workPlace: value, workPlaceType: "4" }) |
|||
// formModel.manageContactor = undefined; // reset city value
|
|||
const { updateSchema, setFieldsValue } = formActionType; |
|||
updateSchema({ |
|||
field: 'contructorContactor', |
|||
componentProps: { |
|||
options: contructorContactorDict, |
|||
}, |
|||
}); |
|||
setFieldsValue({ contructorContactor: "" }) |
|||
}, |
|||
}; |
|||
}, |
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
}, |
|||
{ |
|||
//标题名称
|
|||
label: '承建单位负责人', |
|||
//字段
|
|||
field: 'contructorContactor', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'Select', |
|||
componentProps: { |
|||
options: [], |
|||
|
|||
}, |
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
}, |
|||
{ |
|||
//标题名称
|
|||
label: '建设单位', |
|||
//字段
|
|||
field: 'owner', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'Select', |
|||
componentProps: ({ formModel, formActionType }) => { |
|||
console.log("formModel", formModel, "formActionType", formActionType) |
|||
return { |
|||
//
|
|||
options: ownerDict, |
|||
onChange: async (value) => { |
|||
// console.log(e)
|
|||
let ownerContactorDict = await getContactorDict({ workPlace: value, workPlaceType: "3" }) |
|||
// formModel.manageContactor = undefined; // reset city value
|
|||
const { updateSchema, setFieldsValue } = formActionType; |
|||
updateSchema({ |
|||
field: 'ownerContactor', |
|||
componentProps: { |
|||
options: ownerContactorDict, |
|||
} |
|||
}); |
|||
setFieldsValue({ ownerContactor: "" }) |
|||
}, |
|||
}; |
|||
}, |
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
required: true, |
|||
}, |
|||
{ |
|||
//标题名称
|
|||
label: '建设单位负责人', |
|||
//字段
|
|||
field: 'ownerContactor', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'Select', |
|||
componentProps: { |
|||
options: [], |
|||
|
|||
}, |
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
required: true, |
|||
}, |
|||
{ |
|||
//标题名称
|
|||
label: '监理单位', |
|||
//字段
|
|||
field: 'controler', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'Select', |
|||
componentProps: ({ formModel, formActionType }) => { |
|||
console.log("formModel", formModel, "formActionType", formActionType) |
|||
return { |
|||
//
|
|||
options: controlerDict, |
|||
onChange: async (value) => { |
|||
// console.log(e)
|
|||
let controlerContactorDict = await getContactorDict({ workPlace: value, workPlaceType: "6" }) |
|||
// formModel.manageContactor = undefined; // reset city value
|
|||
const { updateSchema, setFieldsValue } = formActionType; |
|||
updateSchema({ |
|||
field: 'controlerContactor', |
|||
componentProps: { |
|||
options: controlerContactorDict, |
|||
} |
|||
}); |
|||
setFieldsValue({ controlerContactor: "" }) |
|||
}, |
|||
}; |
|||
}, |
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
}, |
|||
{ |
|||
//标题名称
|
|||
label: '监理单位负责人', |
|||
//字段
|
|||
field: 'controlerContactor', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'Select', |
|||
componentProps: { |
|||
options: [], |
|||
|
|||
}, |
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
}, |
|||
{ |
|||
//标题名称
|
|||
label: '咨询单位', |
|||
//字段
|
|||
field: 'consult', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'Select', |
|||
componentProps: ({ formModel, formActionType }) => { |
|||
console.log("formModel", formModel, "formActionType", formActionType) |
|||
return { |
|||
//
|
|||
options: consultDict, |
|||
onChange: async (value) => { |
|||
// console.log(e)
|
|||
let consultContactoDict = await getContactorDict({ workPlace: value, workPlaceType: "5" }) |
|||
// formModel.manageContactor = undefined; // reset city value
|
|||
const { updateSchema, setFieldsValue } = formActionType; |
|||
updateSchema({ |
|||
field: 'consultContactor', |
|||
componentProps: { |
|||
options: consultContactoDict, |
|||
} |
|||
}); |
|||
setFieldsValue({ consultContactor: "" }) |
|||
}, |
|||
}; |
|||
}, |
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
}, |
|||
{ |
|||
//标题名称
|
|||
label: '咨询单位负责人', |
|||
//字段
|
|||
field: 'consultContactor', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'Select', |
|||
componentProps: { |
|||
options: [], |
|||
|
|||
}, |
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
}, |
|||
{ |
|||
//标题名称
|
|||
label: '项目状态', |
|||
//字段
|
|||
field: 'stage', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'Input', |
|||
|
|||
//一列占比总共24，比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
ifShow: false |
|||
} |
|||
]; |
|||
|
|||
export const approveStartProcessColumns: BasicColumn[] = [ |
|||
|
|||
{ |
|||
title: '节点名称', |
|||
dataIndex: 'taskName', |
|||
}, |
|||
{ |
|||
title: '处理人', |
|||
dataIndex: 'operator', |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: '处理时间', |
|||
dataIndex: 'operateDate', |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: '审批状态', |
|||
dataIndex: 'approvalStatue', |
|||
width: 100, |
|||
customRender: ({ record }) => { |
|||
for (let i = 0; i < approvalRsesults.length; i++) { |
|||
if (record.approvalStatue == approvalRsesults[i].value) { |
|||
return approvalRsesults[i].text |
|||
} |
|||
} |
|||
}, |
|||
}, |
|||
{ |
|||
title: '审批意见', |
|||
dataIndex: 'comment', |
|||
width: 100, |
|||
} |
|||
]; |
|||
export const resourcetableColumns: BasicColumn[] = [ |
|||
{ |
|||
title: '文件名称', |
|||
dataIndex: 'documentName', |
|||
}, |
|||
{ |
|||
title: '文件大小', |
|||
dataIndex: 'size', |
|||
width: 100, |
|||
customRender: ({ record }) => { |
|||
let kbNum: number = record.size / 1024 |
|||
if (kbNum < 1024) { |
|||
return kbNum.toFixed(2).toString() + "KB" |
|||
} else { |
|||
let mbNum: number = kbNum / 1024 |
|||
return mbNum.toFixed(2).toString() + "MB" |
|||
} |
|||
|
|||
}, |
|||
}, |
|||
{ |
|||
title: '上传时间', |
|||
dataIndex: 'createtime', |
|||
}, |
|||
{ |
|||
title: '文件状态', |
|||
dataIndex: 'status', |
|||
customRender: ({ record }) => { |
|||
if (record.status == 1) { |
|||
return "有效" |
|||
} else { |
|||
return "历史文件" |
|||
} |
|||
}, |
|||
} |
|||
] |
|||
@ -1,132 +1,125 @@ |
|||
<template> |
|||
<BasicTable @register="registerTable"> |
|||
<!-- <template #action="{ record }"> |
|||
<TableAction :actions="getTableAction(record)" /> |
|||
</template> |
|||
<template #tableTitle> |
|||
<a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleCreate"> 新增计划</a-button> |
|||
</template> --> |
|||
</BasicTable> |
|||
<div style="display: flex; justify-content: center; align-items: center; height: 100px;"> |
|||
<el-button type="primary" @click="onSubmit">修改</el-button> |
|||
<el-button @click="handlecancle">取消</el-button> |
|||
|
|||
<!-- <el-button>取消</el-button> --> |
|||
<!-- 自定义表单 --> |
|||
<el-divider content-position="left" >模板表格文件下载</el-divider> |
|||
<div style="padding-left: 40px;"> |
|||
<el-button slot="trigger" type="primary" @click="downexcel">下载模板</el-button> |
|||
</div> |
|||
<el-divider content-position="left">上传表格文件</el-divider> |
|||
<el-form ref="importFormRef" label-width="130px"> |
|||
<el-form-item label="上传文件:"> |
|||
<el-upload class="upload-demo" ref="upload" action :http-request="httpRequest" :before-upload="beforeUpload" |
|||
:on-exceed="handleExceed" :limit="1" accept=".xls, .xlsx"> |
|||
<el-button slot="trigger" size="small" type="primary">选取文件</el-button> |
|||
<div slot="tip" class="el-upload__tip">只能上传excel文件且不超过5M</div> |
|||
</el-upload> |
|||
</el-form-item> |
|||
<el-form-item> |
|||
<el-button type="primary" @click="submitImportForm">开始导入</el-button> |
|||
<el-button type="info" @click="dialogVisible">关闭窗口</el-button> |
|||
</el-form-item> |
|||
</el-form> |
|||
</template> |
|||
<script lang="ts" name="addPlan" setup> |
|||
import { ref, defineProps, onMounted } from 'vue' |
|||
import { planDetailColumns } from './projectPlan.data' |
|||
import { queryPlanModuleDetailPage, queryPlanModuleone,saveProjectPlan} from './projectPlan.api' |
|||
import { ActionItem, BasicTable } from '/@/components/Table'; |
|||
import { useListPage } from '/@/hooks/system/useListPage'; |
|||
<script lang="ts" name="uploadFile" setup> |
|||
import { ref, reactive, defineProps, watchEffect } from 'vue' |
|||
import { useForm } from '/@/components/Form'; |
|||
import { } from './projectPlan.data'; |
|||
import { submitplaninfoUploadFile, modifyPlaninfo } from './projectPlan.api'; |
|||
import { ElMessage } from 'element-plus' |
|||
import { downloadFile } from "../../../api/common/api" |
|||
import { ElMessage, dayjs } from 'element-plus' |
|||
|
|||
let dataTo = defineProps(["projectType", "projectId"]) |
|||
let emit = defineEmits(["close"]) |
|||
let projectType = ref<string>() |
|||
let projectId = ref<string>() |
|||
let moduleId = ref() |
|||
|
|||
onMounted(async () => { |
|||
setShowPagination(false)//不显示分页 |
|||
projectType.value = dataTo.projectType |
|||
projectId.value = dataTo.projectId |
|||
console.log("projectType", projectType) |
|||
let res = await queryPlanModuleone({ projectType: projectType.value }) |
|||
moduleId.value = res.id |
|||
reload()//刷新表格 |
|||
// if (dataTo.projectType) { |
|||
|
|||
// } else { |
|||
// let tableData = await getDataSource(); |
|||
|
|||
// } |
|||
}) |
|||
|
|||
function getTableAction(record): ActionItem[] { |
|||
return [ |
|||
{ |
|||
label: '删除', |
|||
ifShow: true, |
|||
onClick: handleRemoveDetail.bind(null, record), |
|||
} |
|||
]; |
|||
} |
|||
let fileList = reactive<Array<any>>([]); |
|||
let dataTo = defineProps(["projectid", "type"]) |
|||
const emit = defineEmits(['close']); |
|||
//加载项目数据 |
|||
watchEffect(async () => { |
|||
console.log("dataTo", dataTo, dataTo.projectid) |
|||
}) |
|||
|
|||
|
|||
//项目资料table |
|||
const { tableContext } = useListPage({ |
|||
tableProps: { |
|||
size: 'small',//紧凑型表格 |
|||
title: '项目计划模板详情', |
|||
api: queryPlanModuleDetailPage, |
|||
columns: planDetailColumns, |
|||
useSearchForm: false, |
|||
showActionColumn: false, |
|||
actionColumn: { |
|||
width: 120, |
|||
fixed: "right", |
|||
}, |
|||
beforeFetch(params) { |
|||
params.moduleId = moduleId.value |
|||
}, |
|||
}, |
|||
}); |
|||
const [registerTable, { getDataSource, setTableData, setShowPagination,reload }] = tableContext; |
|||
|
|||
|
|||
function handleDetailpage(record) { |
|||
console.log("我这一行的数据是", record) |
|||
function downexcel() { |
|||
let param = { |
|||
path: record.documentPath, |
|||
fileName: record.documentName |
|||
path: "Resources/项目计划模板.xlsx", |
|||
fileName: "项目计划模板.xlsx" |
|||
} |
|||
// |
|||
console.log("我这一行的数据是", param) |
|||
downloadFile("/huzhouUploadfileinfo/downloadfile", "项目计划模板.xlsx", param) |
|||
|
|||
|
|||
downloadFile("/huzhouProject/downloadfile", record.documentName, param) |
|||
} |
|||
async function handleCreate() { |
|||
//await setShowPagination(false); |
|||
let tableData = await getDataSource(); |
|||
tableData.push({ taskName: "aaa" }) |
|||
setTableData(tableData) |
|||
} |
|||
// function onEditChange({ column, value, record }) { |
|||
// // 结束时间列 |
|||
// if (column.dataIndex === 'scheduledEndTime') { |
|||
// record.editValueRefs.name4.value = `${value}`; |
|||
// } |
|||
// console.log(column, value, record); |
|||
// } |
|||
function handlecancle() { |
|||
emit("close") |
|||
|
|||
|
|||
|
|||
|
|||
|
|||
function httpRequest(option) { |
|||
fileList.pop() |
|||
fileList.push(option) |
|||
} |
|||
// 上传前处理 |
|||
function beforeUpload(file) { |
|||
let fileSize = file.size |
|||
const FIVE_M = 5 * 1024 * 1024; |
|||
//大于5M，不允许上传 |
|||
if (fileSize > FIVE_M) { |
|||
ElMessage.error("最大上传5M") |
|||
return false |
|||
} |
|||
//判断文件类型，必须是xlsx格式 |
|||
|
|||
const fileSuffix = file.name.substring(file.name.lastIndexOf(".") + 1); |
|||
|
|||
let whiteList = ["xls", "xlsx"]; |
|||
|
|||
async function onSubmit() { |
|||
let tableData = await getDataSource(); |
|||
for (let i = 0; i < tableData.length; i++) { |
|||
//开始时间填写了 |
|||
if (tableData[i].scheduledStartTime && tableData[i].scheduledEndTime) { |
|||
tableData[i].projectId = projectId |
|||
|
|||
} else { |
|||
ElMessage({ |
|||
message: "请填写第" + (i + 1) + "行的数据", |
|||
type: "error" |
|||
}) |
|||
return; |
|||
} |
|||
if (whiteList.indexOf(fileSuffix) === -1) { |
|||
ElMessage.error('上传文件只能是xls、xlsx格式'); |
|||
return false; |
|||
} |
|||
await saveProjectPlan(tableData) |
|||
emit("close") |
|||
// let fileName = file.name |
|||
// let reg = /^.+(\.xlsx)$/ |
|||
// if(!reg.test(fileName)){ |
|||
// ElMessage.error("只能上传xlsx!") |
|||
// return false |
|||
// } |
|||
return true |
|||
} |
|||
// 文件数量过多时提醒 |
|||
function handleExceed() { |
|||
ElMessage.warning("最多只能上传一个文件") |
|||
} |
|||
async function handleRemoveDetail(record) { |
|||
let tableData = await getDataSource(); |
|||
//导入Excel病种信息数据 |
|||
async function submitImportForm() { |
|||
// console.log("datadatadatadatadatadata", data) |
|||
// if (data.stage != 2) { |
|||
// ElMessage({ |
|||
// message: "当前阶段无法上传文件", |
|||
// type: "error" |
|||
// }) |
|||
// return |
|||
// } |
|||
// // 使用form表单的数据格式 |
|||
const params = new FormData() |
|||
// 将上传文件数组依次添加到参数paramsData中 |
|||
// fileList.forEach((x) => { |
|||
// console.log("xxxxxxxxxx", x, x.file) |
|||
|
|||
// }); |
|||
params.append('file', fileList[0].file) |
|||
params.append("projectid", dataTo.projectid) |
|||
//1是新增，2 是修改 |
|||
if (dataTo.type == "1") { |
|||
//这里根据自己封装的axios来进行调用后端接口 |
|||
submitplaninfoUploadFile(params).then(() => { |
|||
emit("close") |
|||
}) |
|||
} else { |
|||
modifyPlaninfo(params).then(() => { |
|||
emit("close") |
|||
}) |
|||
} |
|||
|
|||
} |
|||
function dialogVisible() { |
|||
emit("close") |
|||
} |
|||
</script> |
|||
<style></style> |
|||
|
|||
@ -0,0 +1,134 @@ |
|||
<template> |
|||
<!-- 自定义表单 --> |
|||
<!-- <el-divider content-position="left">模板表格文件下载</el-divider> |
|||
<div style="padding-left: 40px;"> |
|||
<el-button slot="trigger" type="primary">下载模板</el-button> |
|||
</div> --> |
|||
<el-divider content-position="left">上传表格文件</el-divider> |
|||
<el-form ref="importFormRef" label-width="130px"> |
|||
<el-form-item v-for=" (item, index) in dataTo.files" :key="index" :label="item"> |
|||
<el-upload class="upload-demo" ref="upload" action :http-request="httpRequest" |
|||
:before-upload="(file) => { return beforeUpload(file, item) }" :on-exceed="handleExceed" :limit="1" |
|||
:on-remove="removeFile"> |
|||
<el-button slot="trigger" size="small" type="primary">选取文件</el-button> |
|||
<div slot="tip" class="el-upload__tip">只能上传[{{ item }}]且不超过5M</div> |
|||
</el-upload> |
|||
</el-form-item> |
|||
<el-form-item> |
|||
<el-button type="primary" @click="submitImportForm">开始导入</el-button> |
|||
<el-button type="info" @click="dialogVisible">关闭窗口</el-button> |
|||
</el-form-item> |
|||
</el-form> |
|||
</template> |
|||
<script lang="ts" name="uploadFile" setup> |
|||
import { ref, reactive, defineProps, onMounted } from 'vue' |
|||
import { useForm } from '/@/components/Form'; |
|||
import { } from './projectPlan.data'; |
|||
import { planUploadFile, planUploadModifyFile } from './projectPlan.api'; |
|||
import { ElMessage } from 'element-plus' |
|||
|
|||
|
|||
let fileList = reactive<Array<any>>([]); |
|||
let dataTo = defineProps(["type", "files", "planinfoid"]) |
|||
const emit = defineEmits(['close']); |
|||
//加载项目数据 |
|||
onMounted(async () => { |
|||
console.log("dataTo", dataTo) |
|||
}) |
|||
|
|||
|
|||
|
|||
|
|||
|
|||
|
|||
function httpRequest(option) { |
|||
fileList.push(option) |
|||
console.log(fileList, option) |
|||
} |
|||
function removeFile(option) { |
|||
for (let i = 0; i < fileList.length; i++) { |
|||
if (fileList[i].file.name == option.name) { |
|||
fileList.splice(i, 1) |
|||
} |
|||
} |
|||
console.log(fileList, option) |
|||
|
|||
} |
|||
// 上传前处理 |
|||
function beforeUpload(file, item) { |
|||
console.log("file,item", file, item) |
|||
let fileSize = file.size |
|||
const FIVE_M = 5 * 1024 * 1024; |
|||
//大于5M，不允许上传 |
|||
if (fileSize > FIVE_M) { |
|||
ElMessage.error("最大上传5M") |
|||
return false |
|||
} |
|||
if (item != file.name) { |
|||
ElMessage.error('请上传文件:' + item); |
|||
return false; |
|||
} |
|||
//判断文件类型，必须是xlsx格式 |
|||
|
|||
// const fileSuffix = file.name.substring(file.name.lastIndexOf(".") + 1); |
|||
|
|||
// let whiteList = ["xls", "xlsx"]; |
|||
|
|||
// if (whiteList.indexOf(fileSuffix) === -1) { |
|||
// ElMessage.error('上传文件只能是xls、xlsx格式'); |
|||
// return false; |
|||
// } |
|||
// let fileName = file.name |
|||
// let reg = /^.+(\.xlsx)$/ |
|||
// if(!reg.test(fileName)){ |
|||
// ElMessage.error("只能上传xlsx!") |
|||
// return false |
|||
// } |
|||
return true |
|||
} |
|||
// 文件数量过多时提醒 |
|||
function handleExceed() { |
|||
ElMessage.warning("最多只能上传一个文件") |
|||
} |
|||
//导入Excel病种信息数据 |
|||
async function submitImportForm() { |
|||
if (fileList.length == 0) { |
|||
ElMessage({ |
|||
message: "未选择任何文件，无法上传！", |
|||
type: "error" |
|||
}) |
|||
return |
|||
} |
|||
// type ==0新增，type ==1 是修改 |
|||
if (fileList.length != dataTo.files.length && dataTo.type == 0) { |
|||
ElMessage({ |
|||
message: "上传的文件不符合要求请检查", |
|||
type: "error" |
|||
}) |
|||
return |
|||
} |
|||
// // 使用form表单的数据格式 |
|||
const params = new FormData() |
|||
// 将上传文件数组依次添加到参数paramsData中 |
|||
fileList.forEach((x) => { |
|||
console.log("xxxxxxxxxx", x, x.file) |
|||
params.append('file', x.file) |
|||
}); |
|||
params.append("planinfoid", dataTo.planinfoid) |
|||
if (dataTo.type == 0) { |
|||
planUploadFile(params).then(() => { |
|||
emit("close") |
|||
}) |
|||
} else { |
|||
planUploadModifyFile(params).then(() => { |
|||
emit("close") |
|||
}) |
|||
|
|||
} |
|||
|
|||
} |
|||
function dialogVisible() { |
|||
emit("close") |
|||
} |
|||
</script> |
|||
<style></style> |
|||
@ -0,0 +1,29 @@ |
|||
<template> |
|||
<el-steps direction="vertical" finish-status="success"> |
|||
<el-step v-for="(item, index) in dataTo.child" :key="index" :status="item.isfinish==1?'success':'wait'"> |
|||
<template #title> |
|||
<div> |
|||
{{ item.taskName }} |
|||
</div> |
|||
<div> |
|||
{{ item.scheduledStartTime }} |
|||
</div> |
|||
<div> |
|||
{{ item.scheduledEndTime }} |
|||
</div> |
|||
</template> |
|||
<template #description> |
|||
<elstepchild v-if="item.children!=null" :child="item.children"></elstepchild> |
|||
</template> |
|||
</el-step> |
|||
</el-steps> |
|||
</template> |
|||
<script lang="ts" name="viewPlanDetail" setup> |
|||
import { ref, onMounted } from 'vue' |
|||
import elstepchild from './elstepchild.vue' |
|||
let dataTo = defineProps(["child"]) |
|||
let active = ref(2) |
|||
|
|||
</script> |
|||
<style scoped></style> |
|||
|
|||
@ -0,0 +1,116 @@ |
|||
<template> |
|||
<!-- 自定义表单 --> |
|||
<!-- <el-divider content-position="left">项目入库详情</el-divider> |
|||
<BasicForm @register="registerProjectForm" /> --> |
|||
<el-divider content-position="left">{{dataTo.taskName}}</el-divider> |
|||
|
|||
|
|||
<div > |
|||
<el-divider content-position="left">项目资料详情</el-divider> |
|||
<BasicTable @register="registerResourceTable"> |
|||
<template #action="{ record }"> |
|||
<TableAction :actions="getTableAction(record)" /> |
|||
</template> |
|||
</BasicTable> |
|||
</div> |
|||
<!-- <el-divider content-position="left">审批详情</el-divider> |
|||
<BasicTable @register="registerApproveStartTable" /> --> |
|||
</template> |
|||
<script lang="ts" name="Detailpage" setup> |
|||
import { ref, defineProps, onMounted } from 'vue' |
|||
import { useForm, BasicForm } from '/@/components/Form'; |
|||
import { PlaninfoFiletableColumns } from './projectPlan.data'; |
|||
import { queryPlaninfoFilePageByid } from './projectPlan.api' |
|||
import { ActionItem, BasicTable, TableAction } from '/@/components/Table'; |
|||
import { useListPage } from '/@/hooks/system/useListPage'; |
|||
import { downloadFile } from "../../../api/common/api" |
|||
let dataTo = defineProps(["planinfoid","taskName"]) |
|||
let projectstage = ref() |
|||
|
|||
onMounted(async () => { |
|||
|
|||
}) |
|||
|
|||
function getTableAction(record): ActionItem[] { |
|||
return [ |
|||
{ |
|||
label: '下载', |
|||
ifShow: true, |
|||
onClick: handleDetailpage.bind(null, record), |
|||
} |
|||
]; |
|||
} |
|||
/** |
|||
* BasicForm绑定注册; |
|||
* useForm 是整个框架的核心用于表单渲染，里边封装了很多公共方法; |
|||
* 支持（schemas: 渲染表单列，autoSubmitOnEnter：回车提交,submitButtonOptions：自定义按钮文本和图标等方法）； |
|||
* 平台通过此封装，简化了代码，支持自定义扩展; |
|||
*/ |
|||
// const [registerProjectForm, { setFieldsValue }] = useForm({ |
|||
// //注册表单列 |
|||
// schemas: formSchemas, |
|||
// showActionButtonGroup: false, |
|||
// //回车提交 |
|||
// // autoSubmitOnEnter: true, |
|||
// // //不显示重置按钮 |
|||
// // showResetButton: false, |
|||
// //自定义提交按钮文本和图标 |
|||
// // submitButtonOptions: { text: '提交', preIcon: '' }, |
|||
// //查询列占比 24代表一行 取值范围 0-24 |
|||
// // actionColOptions: { span: 17 }, |
|||
// labelCol: { style: { width: '120px' } }, |
|||
// wrapperCol: { style: { width: 'auto' } }, |
|||
// disabled: true |
|||
// }); |
|||
|
|||
// //项目入库审批table |
|||
// const { tableContext: approveStarttableContext } = useListPage({ |
|||
// tableProps: { |
|||
// size: 'small',//紧凑型表格 |
|||
// title: '审批详情', |
|||
// api: queryProcessInfo, |
|||
// columns: approveStartProcessColumns, |
|||
// showActionColumn: false, |
|||
// useSearchForm: false, |
|||
// beforeFetch(params) { |
|||
// params.stage = projectstage.value>=3?"2":"1", |
|||
// params.projectid = dataTo.projectid |
|||
// }, |
|||
// }, |
|||
// }); |
|||
// // BasicTable绑定注册 |
|||
// const [registerApproveStartTable] = approveStarttableContext; |
|||
|
|||
//项目资料table |
|||
const { tableContext } = useListPage({ |
|||
tableProps: { |
|||
size: 'small',//紧凑型表格 |
|||
title: '项目入库资料详情', |
|||
api: queryPlaninfoFilePageByid, |
|||
columns: PlaninfoFiletableColumns, |
|||
useSearchForm: false, |
|||
actionColumn: { |
|||
width: 120, |
|||
fixed: "right", |
|||
}, |
|||
beforeFetch(params) { |
|||
params.planinfoid = dataTo.planinfoid |
|||
}, |
|||
}, |
|||
}); |
|||
const [registerResourceTable] = tableContext; |
|||
|
|||
|
|||
function handleDetailpage(record) { |
|||
console.log("我这一行的数据是", record) |
|||
let param = { |
|||
path: record.documentPath, |
|||
fileName: record.documentName |
|||
} |
|||
// |
|||
console.log("我这一行的数据是", param) |
|||
|
|||
downloadFile("/huzhouUploadfileinfo/downloadfile", record.documentName, param) |
|||
} |
|||
</script> |
|||
<style></style> |
|||
@ -1,75 +1,222 @@ |
|||
<template> |
|||
<!-- 自定义表单 --> |
|||
<el-divider content-position="left">项目计划详情</el-divider> |
|||
<BasicTable @register="registerPlanDetail" /> |
|||
<el-divider content-position="left">项目计划审批详情</el-divider> |
|||
<BasicTable @register="registerApproveTable" /> |
|||
</template> |
|||
<script lang="ts" name="viewPlanDetail" setup> |
|||
import { ref, defineProps, onMounted } from 'vue' |
|||
import { viewPlanDetailColumns } from './projectPlan.data'; |
|||
import {queryProjectPlan } from './projectPlan.api' |
|||
import { approveStartProcessColumns } from '../projectInfo/projectInfo.data'; |
|||
import {queryProcessInfo } from '../projectInfo/projectInfo.api' |
|||
import { ActionItem, BasicTable, TableAction } from '/@/components/Table'; |
|||
import { useListPage } from '/@/hooks/system/useListPage'; |
|||
import { downloadFile } from "../../../api/common/api" |
|||
let dataTo = defineProps(["projectId"]) |
|||
let projectId = ref() |
|||
|
|||
onMounted(async () => { |
|||
projectId.value=dataTo.projectId |
|||
console.log("projectid", dataTo.projectId) |
|||
<!-- 自定义表单 --> |
|||
<el-divider content-position="left">项目计划进程</el-divider> |
|||
<!-- <BasicTable @register="registerPlanDetail" /> --> |
|||
<el-row> |
|||
<!-- <el-timeline class="timeline"> |
|||
<el-timeline-item class="lineitem" v-for="(item, index) in activities" @click.native="handleChangeVideo(activities)" |
|||
:key="index" :timestamp="item.scheduledStartTime + '--' + item.scheduledEndTime" |
|||
:color="item.actualEndTime != null ? 'green' : ''"> |
|||
{{ item.taskName }} |
|||
<template #dot> |
|||
<CheckCircleOutlined v-if="item.actualEndTime != null" style="background-color: #e4e7ed;border-radius: 50%;color: rgb(33, 255, 12);font-size: 20px;"/> |
|||
<ClockCircleOutlined v-if="item.actualEndTime == null" style="background-color: #e4e7ed;border-radius: 50%;font-size: 20px;"/> |
|||
</template> |
|||
</el-timeline-item> |
|||
</el-timeline> --> |
|||
|
|||
</el-row> |
|||
<el-steps finish-status="success" :active="activities.status"> |
|||
<el-step v-for="(item, index) in activities" :key="index"> |
|||
<template #title> |
|||
<div> |
|||
{{ item.taskName }} |
|||
</div> |
|||
<div> |
|||
{{ item.scheduledStartTime + "--" + item.scheduledEndTime }} |
|||
</div> |
|||
</template> |
|||
<template #description> |
|||
<elstepchild v-if="item.children != null" :child="item.children"></elstepchild> |
|||
</template> |
|||
<template #icon> |
|||
<Progress type="circle" :percent="item.percent" :size="40" :status="item.progressStatus"></Progress> |
|||
</template> |
|||
</el-step> |
|||
</el-steps> |
|||
<el-divider content-position="left">项目计划阶段详情</el-divider> |
|||
<BasicTable @register="registerTable"> |
|||
<template #action="{ record }"> |
|||
<!-- <TableAction :actions="getTableAction(record)" /> --> |
|||
<TableAction :actions="getTableAction(record)" /> |
|||
</template> |
|||
</BasicTable> |
|||
<div v-if="dataTo.projectStage==4"> |
|||
<el-divider content-position="left">审批详情</el-divider> |
|||
<BasicTable @register="registerApproveStartTable" /> |
|||
</div> |
|||
<BasicModal @register="registeruploadFile" title="上传文件" width="1200px" :showOkBtn="false" :showCancelBtn="false"> |
|||
<addPlanFile :type="type" :planinfoid="planinfoid" :files="fileArr" @close="closePlanFileModal()" /> |
|||
</BasicModal> |
|||
<BasicModal @register="registerFileInfo" title="文件详情" width="1200px" :showOkBtn="false" :showCancelBtn="false"> |
|||
<planinfoFileDetail :planinfoid="planinfoid" :taskName="taskName" @close="closePlanFileInfoModal()" /> |
|||
</BasicModal> |
|||
</template> |
|||
<script lang="ts" name="viewPlanDetail" setup> |
|||
import { ref, onMounted } from 'vue' |
|||
import elstepchild from './elstepchild.vue' |
|||
import addPlanFile from './addPlanFile.vue' |
|||
import planinfoFileDetail from './planinfoFileDetail.vue' |
|||
import { Progress } from 'ant-design-vue'; |
|||
import { BasicModal } from '/@/components/Modal'; |
|||
import { PlaninfoColumn } from './projectPlan.data'; |
|||
import { queryPlanInfoMainTimeline } from './projectPlan.api' |
|||
import { queryProcessInfo } from '../projectInfo/projectInfo.api' |
|||
import { ActionItem, BasicTable, TableAction } from '/@/components/Table'; |
|||
import { useListPage } from '/@/hooks/system/useListPage'; |
|||
import { useModal } from '/@/components/Modal'; |
|||
import { approveStartProcessColumns } from '../projectInfo/projectInfo.data'; |
|||
|
|||
let dataTo = defineProps(["projectId","projectStage"]) |
|||
let projectId = ref(dataTo.projectId) |
|||
let activities = ref([]) |
|||
let type = ref(1) |
|||
let fileArr = ref([]) |
|||
let planinfoid = ref() |
|||
let taskName = ref() |
|||
const [registeruploadFile, { openModal: openPlanFile, closeModal: closePlanFile }] = useModal();//文件上传和查看 |
|||
const [registerFileInfo, { openModal: openFileInfo, closeModal: closeFileInfo }] = useModal();//文件上传和查看 |
|||
|
|||
onMounted(() => { |
|||
queryPlanInfoMainTimeline({ |
|||
projectid: dataTo.projectId |
|||
}).then(res => { |
|||
activities.value = res |
|||
console.log("activities", activities) |
|||
}) |
|||
|
|||
|
|||
|
|||
//项目入库审批table |
|||
const { tableContext: approveTableContext } = useListPage({ |
|||
tableProps: { |
|||
size: 'small',//紧凑型表格 |
|||
title: '项目计划审批详情', |
|||
api: queryProcessInfo, |
|||
columns: approveStartProcessColumns, |
|||
showActionColumn: false, |
|||
useSearchForm: false, |
|||
beforeFetch(params) { |
|||
params.status = "3", |
|||
params.projectid = projectId.value; |
|||
console.log("projectid1111111111", activities, dataTo.projectId) |
|||
|
|||
}) |
|||
|
|||
|
|||
|
|||
// 项目入库审批table |
|||
const { tableContext } = useListPage({ |
|||
tableProps: { |
|||
size: 'small',//紧凑型表格 |
|||
title: '项目计划阶段详情', |
|||
api: queryPlanInfoMainTimeline, |
|||
columns: PlaninfoColumn, |
|||
showActionColumn: true, |
|||
useSearchForm: false, |
|||
beforeFetch(params) { |
|||
params.projectid = projectId.value; |
|||
}, |
|||
}, |
|||
}); |
|||
// BasicTable绑定注册 |
|||
const [registerTable, { reload }] = tableContext; |
|||
function getTableAction(record): ActionItem[] { |
|||
if(dataTo.projectStage==4){ |
|||
return [] |
|||
} |
|||
return [ |
|||
{ |
|||
label: '详情', |
|||
ifShow: () => { |
|||
if (record.isfinish == 1) { |
|||
return true |
|||
} |
|||
return false |
|||
}, |
|||
onClick: handleDetail.bind(null, record), |
|||
}, |
|||
}); |
|||
// BasicTable绑定注册 |
|||
const [registerApproveTable] = approveTableContext; |
|||
|
|||
//项目资料table |
|||
const { tableContext } = useListPage({ |
|||
tableProps: { |
|||
size: 'small',//紧凑型表格 |
|||
title: '项目计划详情', |
|||
api: queryProjectPlan, |
|||
columns: viewPlanDetailColumns, |
|||
useSearchForm: false, |
|||
showActionColumn: false, |
|||
beforeFetch(params) { |
|||
params.projectid = projectId.value |
|||
{ |
|||
label: '上传资料', |
|||
ifShow: () => { |
|||
if (record.isfinish != 1) { |
|||
return true |
|||
} |
|||
return false |
|||
}, |
|||
onClick: handleuploadfile.bind(null, record) |
|||
}, |
|||
}); |
|||
const [registerPlanDetail] = tableContext; |
|||
|
|||
|
|||
function handleDetailpage(record) { |
|||
console.log("我这一行的数据是", record) |
|||
let param = { |
|||
path: record.documentPath, |
|||
fileName: record.documentName |
|||
} |
|||
// |
|||
console.log("我这一行的数据是", param) |
|||
|
|||
downloadFile("/huzhouProject/downloadfile", record.documentName, param) |
|||
{ |
|||
label: '修改资料', |
|||
ifShow: () => { |
|||
if (record.isfinish == 1) { |
|||
return true |
|||
} |
|||
return false |
|||
}, |
|||
onClick: handleuploadfile.bind(null, record) |
|||
}, |
|||
]; |
|||
} |
|||
const { tableContext: approveStarttableContext } = useListPage({ |
|||
tableProps: { |
|||
size: 'small',//紧凑型表格 |
|||
title: '审批详情', |
|||
api: queryProcessInfo, |
|||
columns: approveStartProcessColumns, |
|||
showActionColumn: false, |
|||
useSearchForm: false, |
|||
beforeFetch(params) { |
|||
params.stage = "3", |
|||
params.projectid =projectId.value |
|||
}, |
|||
}, |
|||
}); |
|||
// BasicTable绑定注册 |
|||
const [registerApproveStartTable] = approveStarttableContext; |
|||
function handleDetail(record) { |
|||
planinfoid.value = record.id |
|||
taskName = record.taskName |
|||
openFileInfo() |
|||
|
|||
} |
|||
function handleuploadfile(record) { |
|||
type.value = record.isfinish |
|||
fileArr = record.taskFile.split(",") |
|||
planinfoid.value = record.id |
|||
openPlanFile() |
|||
} |
|||
function closePlanFileModal() { |
|||
closePlanFile() |
|||
reload() |
|||
queryPlanInfoMainTimeline({ |
|||
projectid: dataTo.projectId |
|||
}).then(res => { |
|||
activities.value = res |
|||
console.log("activities", activities) |
|||
}) |
|||
} |
|||
function closePlanFileInfoModal() { |
|||
closeFileInfo() |
|||
} |
|||
</script> |
|||
<style scoped> |
|||
.timeline { |
|||
display: flex; |
|||
width: 100%; |
|||
margin-bottom: 100px; |
|||
|
|||
.lineitem { |
|||
transform: translateX(50%); |
|||
width: 25%; |
|||
} |
|||
</script> |
|||
<style></style> |
|||
} |
|||
|
|||
:deep(.el-timeline-item__tail) { |
|||
border-left: none; |
|||
border-top: 2px solid #e4e7ed; |
|||
width: 100%; |
|||
position: absolute; |
|||
top: 9px; |
|||
} |
|||
|
|||
:deep(.el-timeline-item__wrapper) { |
|||
padding-left: 0; |
|||
position: absolute; |
|||
top: 20px; |
|||
transform: translateX(-50%); |
|||
text-align: center; |
|||
} |
|||
|
|||
:deep(.el-timeline-item__timestamp) { |
|||
font-size: 14px; |
|||
|
|||
} |
|||
</style> |
|||
|
|||
@ -1,121 +0,0 @@ |
|||
<template> |
|||
<BasicTable @register="registerTable" @edit-change="onEditChange"> |
|||
<template #action="{ record }"> |
|||
<TableAction :actions="getTableAction(record)" /> |
|||
</template> |
|||
<template #tableTitle> |
|||
<a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleCreate"> 新增计划</a-button> |
|||
</template> |
|||
</BasicTable> |
|||
<div style="display: flex; justify-content: center; align-items: center; height: 100px;"> |
|||
<el-button type="primary" @click="onSubmit">修改</el-button> |
|||
<el-button @click="handlecancle">取消</el-button> |
|||
|
|||
<!-- <el-button>取消</el-button> --> |
|||
</div> |
|||
</template> |
|||
<script lang="ts" name="addPage" setup> |
|||
import { ref, defineProps, onMounted } from 'vue' |
|||
import { moduleDetailColumns } from './projectPlanModule.data'; |
|||
import { queryPlanModuleDetailPage, savePlanModuleDatail } from './projectPlanModule.api' |
|||
import { ActionItem, BasicTable, TableAction, EditRecordRow } from '/@/components/Table'; |
|||
import { useListPage } from '/@/hooks/system/useListPage'; |
|||
import { downloadFile } from "../../../api/common/api" |
|||
let dataTo = defineProps(["moduleId"]) |
|||
let emit = defineEmits(["close"]) |
|||
|
|||
onMounted(async () => { |
|||
setShowPagination(false)//不显示分页 |
|||
console.log("moduleId.value=record.moduleId", dataTo.moduleId) |
|||
if (dataTo.moduleId) { |
|||
let param: any = { |
|||
projectid: dataTo.moduleId |
|||
} |
|||
// let res = await queryProjectInfoById(param) |
|||
//刷新表格 |
|||
} else { |
|||
let tableData = await getDataSource(); |
|||
|
|||
} |
|||
console.log("dataTo.moduleId", dataTo.moduleId) |
|||
}) |
|||
|
|||
function getTableAction(record): ActionItem[] { |
|||
return [ |
|||
{ |
|||
label: '删除', |
|||
ifShow: true, |
|||
onClick: handleRemoveDetail.bind(null, record), |
|||
} |
|||
]; |
|||
} |
|||
|
|||
|
|||
//项目资料table |
|||
const { tableContext } = useListPage({ |
|||
tableProps: { |
|||
size: 'small',//紧凑型表格 |
|||
title: '项目计划模板详情', |
|||
api: queryPlanModuleDetailPage, |
|||
columns: moduleDetailColumns, |
|||
useSearchForm: false, |
|||
showTableSetting: true, |
|||
actionColumn: { |
|||
width: 120, |
|||
fixed: "right", |
|||
}, |
|||
beforeFetch(params) { |
|||
params.moduleId = dataTo.moduleId |
|||
}, |
|||
}, |
|||
}); |
|||
const [registerTable, { getDataSource, setTableData, setShowPagination }] = tableContext; |
|||
|
|||
|
|||
function handleDetailpage(record) { |
|||
console.log("我这一行的数据是", record) |
|||
let param = { |
|||
path: record.documentPath, |
|||
fileName: record.documentName |
|||
} |
|||
// |
|||
console.log("我这一行的数据是", param) |
|||
|
|||
downloadFile("/huzhouProject/downloadfile", record.documentName, param) |
|||
} |
|||
async function handleCreate() { |
|||
//await setShowPagination(false); |
|||
let tableData = await getDataSource(); |
|||
tableData.push({ taskName: "aaa" }) |
|||
setTableData(tableData) |
|||
} |
|||
function onEditChange({ column, value, record }) { |
|||
// 本例 |
|||
if (column.dataIndex === 'id') { |
|||
record.editValueRefs.name4.value = `${value}`; |
|||
} |
|||
console.log(column, value, record); |
|||
} |
|||
function handlecancle() { |
|||
emit("close") |
|||
} |
|||
async function onSubmit() { |
|||
let tableData = await getDataSource(); |
|||
console.log("dddddddddddd", tableData) |
|||
let param = { |
|||
moduleId: dataTo.moduleId, |
|||
tableData: tableData, |
|||
} |
|||
tableData.forEach(item => { |
|||
item.moduleId = dataTo.moduleId |
|||
}) |
|||
await savePlanModuleDatail(tableData) |
|||
emit("close") |
|||
} |
|||
async function handleRemoveDetail(record){ |
|||
let tableData = await getDataSource(); |
|||
|
|||
} |
|||
</script> |
|||
<style></style> |
|||
|
|||
@ -1,83 +0,0 @@ |
|||
<template> |
|||
<!-- 自定义表单 --> |
|||
<BasicForm @register="registerForm" @submit="handleSubmit" /> |
|||
</template> |
|||
<script lang="ts" name="addModulePage" setup> |
|||
import { ref, defineProps, onMounted, defineEmits } from 'vue' |
|||
import { useForm, BasicForm } from '/@/components/Form'; |
|||
import { planModuleFormSchemas } from './projectPlanModule.data'; |
|||
import { savePlanModule, queryPlanModuleone, modifyPlanModule } from './projectPlanModule.api' |
|||
import { downloadFile } from "../../../api/common/api" |
|||
let dataTo = defineProps(["moduleId", "projectType"]) |
|||
let emit = defineEmits(["close"]) |
|||
|
|||
onMounted(async () => { |
|||
let param = { |
|||
id: dataTo.moduleId, |
|||
projectType: dataTo.projectType |
|||
} |
|||
let res = await queryPlanModuleone(param) |
|||
setFieldsValue(res) |
|||
|
|||
}) |
|||
/** |
|||
* BasicForm绑定注册; |
|||
* useForm 是整个框架的核心用于表单渲染，里边封装了很多公共方法; |
|||
* 支持（schemas: 渲染表单列，autoSubmitOnEnter：回车提交,submitButtonOptions：自定义按钮文本和图标等方法）； |
|||
* 平台通过此封装，简化了代码，支持自定义扩展; |
|||
*/ |
|||
const [registerForm, { validate, setFieldsValue, getFieldsValue }] = useForm({ |
|||
//注册表单列 |
|||
schemas: planModuleFormSchemas, |
|||
//回车提交 |
|||
// autoSubmitOnEnter: true, |
|||
// //不显示重置按钮 |
|||
// showResetButton: false, |
|||
//自定义提交按钮文本和图标 |
|||
resetButtonOptions: { text: '取消', preIcon: '' }, |
|||
|
|||
submitButtonOptions: { text: '提交', preIcon: '' }, |
|||
//查询列占比 24代表一行 取值范围 0-24 |
|||
resetFunc: customResetFunc, |
|||
actionColOptions: { span: 14 }, |
|||
labelCol: { style: { width: '120px' } }, |
|||
wrapperCol: { style: { width: 'auto' } }, |
|||
}); |
|||
|
|||
//项目入库审批table |
|||
|
|||
|
|||
|
|||
function handleDetailpage(record) { |
|||
console.log("我这一行的数据是", record) |
|||
let param = { |
|||
path: record.documentPath, |
|||
fileName: record.documentName |
|||
} |
|||
// |
|||
console.log("我这一行的数据是", param) |
|||
|
|||
downloadFile("/huzhouProject/downloadfile", record.documentName, param) |
|||
} |
|||
async function customResetFunc() { |
|||
emit("close") |
|||
} |
|||
async function handleSubmit() { |
|||
if (await validate()) { |
|||
let param = getFieldsValue() |
|||
if (dataTo.projectType) { |
|||
await modifyPlanModule(param) |
|||
} else { |
|||
await savePlanModule(param) |
|||
} |
|||
|
|||
console.log("我提交了") |
|||
emit("close") |
|||
} else { |
|||
console.log("未完成") |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
<style></style> |
|||
|
|||
@ -1,131 +0,0 @@ |
|||
<template> |
|||
<div> |
|||
<!--引用表格--> |
|||
<BasicTable @register="registerTable"> |
|||
<!--插槽:table标题--> |
|||
<!--操作栏--> |
|||
<template #action="{ record }"> |
|||
<!-- <TableAction :actions="getTableAction(record)" /> --> |
|||
<TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)" /> |
|||
</template> |
|||
<template #tableTitle> |
|||
<a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleCreate"> 新增模板</a-button> |
|||
</template> |
|||
</BasicTable> |
|||
</div> |
|||
<BasicModal @register="registePalanModuleModal" title="项目计划模板" width="1200px" :showOkBtn="false"> |
|||
<addModulePage :moduleId="moduleId" :projectType="projectType" @close="closePalanModulePage"/> |
|||
</BasicModal> |
|||
<BasicModal @register="registePalanModuleDetailModal" title="项目计划模板详情" width="1200px" :showOkBtn="false" > |
|||
<addModuleDetailPage :moduleId="moduleId" @close="closePalanModuleDetailPage"/> |
|||
</BasicModal> |
|||
<!-- <BasicModal @register="registerModalUploadFiles" title="申报项目资料" width="1200px" :showOkBtn="false" :showCancelBtn="false"> |
|||
<uploadFile :projectid="proid" @close="closeUploadFilesModal()"/> |
|||
</BasicModal> --> |
|||
</template> |
|||
|
|||
<script lang="ts" name="system-user" setup> |
|||
//ts语法 |
|||
import { ref } from 'vue'; |
|||
import { ActionItem, BasicTable, TableAction } from '/@/components/Table'; |
|||
import { useListPage } from '/@/hooks/system/useListPage'; |
|||
|
|||
import { useModal } from '/@/components/Modal'; |
|||
import { BasicModal } from '/@/components/Modal'; |
|||
|
|||
import { hommPageColumns, searchFormSchema } from './projectPlanModule.data'; |
|||
// import { list } from './address.api'; |
|||
|
|||
import addModulePage from './addModulePage.vue' |
|||
import addModuleDetailPage from './addModuleDetailPage.vue' |
|||
|
|||
import { queryPlanModulePage,deletePlanModule } from './projectPlanModule.api'; |
|||
import { Modal } from 'ant-design-vue'; |
|||
|
|||
|
|||
let moduleId = ref(); |
|||
let projectType =ref(); |
|||
const [registePalanModuleModal, { openModal: openPalanModule,closeModal: closePalanModule}] = useModal(); |
|||
const [registePalanModuleDetailModal, { openModal: openPalanModuleDetail,closeModal: closePalanModuleDetail }] = useModal(); |
|||
|
|||
const { tableContext } = useListPage({ |
|||
tableProps: { |
|||
title: '项目信息', |
|||
api: queryPlanModulePage, |
|||
columns: hommPageColumns, |
|||
actionColumn: { |
|||
width: 120, |
|||
fixed: "right", |
|||
}, |
|||
//表单查询项设置 |
|||
formConfig: { |
|||
schemas: searchFormSchema, |
|||
} |
|||
}, |
|||
}); |
|||
//BasicTable绑定注册 |
|||
const [registerTable, { reload }] = tableContext; |
|||
function getTableAction(record): ActionItem[] { |
|||
return [ |
|||
{ |
|||
label: '编辑详情', |
|||
onClick: handleEditDetailpage.bind(null, record), |
|||
}, |
|||
|
|||
]; |
|||
} |
|||
/** |
|||
* 下拉操作栏 |
|||
*/ |
|||
function getDropDownAction(record): ActionItem[] { |
|||
return [ |
|||
{ |
|||
label: '修改模板', |
|||
ifShow: true, |
|||
onClick: handleModifyModule.bind(null, record) |
|||
}, |
|||
{ |
|||
label: '删除模板', |
|||
ifShow: true, |
|||
onClick: handleDeleteModule.bind(null, record) |
|||
}, |
|||
|
|||
]; |
|||
} |
|||
function handleCreate() { |
|||
openPalanModule() |
|||
} |
|||
function handleModifyModule(record) { |
|||
moduleId.value = record.id |
|||
projectType.value = record.projectType |
|||
openPalanModule() |
|||
} |
|||
function closePalanModulePage(){ |
|||
closePalanModule() |
|||
reload() |
|||
} |
|||
function handleEditDetailpage(record){ |
|||
moduleId.value = record.id |
|||
console.log("record",record) |
|||
openPalanModuleDetail() |
|||
} |
|||
function closePalanModuleDetailPage(record){ |
|||
console.log("record",record) |
|||
closePalanModuleDetail() |
|||
reload() |
|||
} |
|||
function handleDeleteModule(record){ |
|||
Modal.confirm({ |
|||
title: '提示窗口', |
|||
content: '是否删除此项目模板？', |
|||
okText: '确认', |
|||
cancelText: '取消', |
|||
onOk:async() => { |
|||
await deletePlanModule({ id: record.id }) |
|||
reload() |
|||
}, |
|||
}); |
|||
} |
|||
</script> |
|||
|
|||
<style scoped></style> |
|||
@ -1,23 +0,0 @@ |
|||
import { defHttp } from '/@/utils/http/axios'; |
|||
|
|||
export enum Api { |
|||
saveprojectInfo = "", |
|||
queryPlanModulePage = '/huzhouPlan/queryPlanModulePage', |
|||
queryPlanModuleDetailPage = "/huzhouPlan/queryPlanModuleDetailPage", |
|||
queryPlanModuleone = '/huzhouPlan/queryPlanModuleone', |
|||
savePlanModule = '/huzhouPlan/savePlanModule', |
|||
savePlanModuleDatail = '/huzhouPlan/savePlanModuleDatail', |
|||
modifyPlanModule = '/huzhouPlan/modifyPlanModule', |
|||
deletePlanModule='/huzhouPlan/deletePlanModule', |
|||
} |
|||
/** |
|||
* 提交入库申请流程 |
|||
*/ |
|||
export const queryPlanModulePage = (params) => defHttp.get({ url: Api.queryPlanModulePage, params }) |
|||
export const queryPlanModuleDetailPage = (params) => defHttp.get({ url: Api.queryPlanModuleDetailPage, params }) |
|||
export const queryPlanModuleone = (params) => defHttp.get({ url: Api.queryPlanModuleone, params }) |
|||
|
|||
export const savePlanModule = (params) => defHttp.post({ url: Api.savePlanModule, params }) |
|||
export const savePlanModuleDatail = (params) => defHttp.post({ url: Api.savePlanModuleDatail, params }) |
|||
export const modifyPlanModule = (params) => defHttp.post({ url: Api.modifyPlanModule, params }) |
|||
export const deletePlanModule = (params) => defHttp.delete({ url: Api.deletePlanModule, params},{ joinParamsToUrl: true }) |
|||
@ -1,173 +0,0 @@ |
|||
import { FormSchema } from '/@/components/Form'; |
|||
import { BasicColumn } from '/@/components/Table'; |
|||
import { getDictItemsByCode } from '/@/utils/dict/index'; |
|||
import { useUserStore } from '/@/store/modules/user'; |
|||
|
|||
const userStore = useUserStore(); |
|||
const projectTypeDicts: Array<Object> = getDictItemsByCode("projectType") |
|||
function projectTypeDict() { |
|||
for (let i = 0; i < projectTypeDicts.length; i++) { |
|||
projectTypeDicts[i].label = projectTypeDicts[i].text; |
|||
} |
|||
return projectTypeDicts |
|||
} |
|||
const approvalRsesults:Array<Object> = getDictItemsByCode("approvalResult") |
|||
|
|||
function approvalRsesult(){ |
|||
for(let i = 0;i<approvalRsesults.length;i++){ |
|||
approvalRsesults[i].label=approvalRsesults[i].text; |
|||
} |
|||
return approvalRsesults |
|||
} |
|||
export const hommPageColumns: BasicColumn[] = [ |
|||
|
|||
{ |
|||
title: '模板ID', |
|||
width: 150, |
|||
dataIndex: 'id', |
|||
}, |
|||
{ |
|||
title: '项目类型', |
|||
dataIndex: 'projectType', |
|||
width: 150, |
|||
customRender: ({ record }) => { |
|||
for(let i =0;i<projectTypeDicts.length;i++){ |
|||
if(record.projectType==projectTypeDicts[i].value){ |
|||
return projectTypeDicts[i].text |
|||
} |
|||
} |
|||
}, |
|||
}, |
|||
{ |
|||
title: '模板名称', |
|||
dataIndex: 'moduleName', |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: '创建时间', |
|||
dataIndex: 'createtime', |
|||
width: 100, |
|||
}, |
|||
]; |
|||
|
|||
export const moduleDetailColumns: BasicColumn[] = [ |
|||
|
|||
{ |
|||
title: '模板id', |
|||
width: 150, |
|||
dataIndex: 'moduleId', |
|||
|
|||
}, |
|||
{ |
|||
title: '计划名称', |
|||
dataIndex: 'taskName', |
|||
width: 150, |
|||
edit: true, |
|||
|
|||
}, |
|||
{ |
|||
title: '计划序号', |
|||
dataIndex: 'orderNumber', |
|||
width: 150, |
|||
edit: true, |
|||
editComponent: 'InputNumber', |
|||
|
|||
}, |
|||
{ |
|||
title: '最大天数', |
|||
dataIndex: 'maxDays', |
|||
width: 100, |
|||
edit: true, |
|||
|
|||
}, |
|||
]; |
|||
|
|||
export const searchFormSchema: FormSchema[] = [ |
|||
|
|||
{ |
|||
label: '项目类型', |
|||
field: 'projectType', |
|||
component: 'Select', |
|||
componentProps:{ |
|||
options:projectTypeDict() |
|||
}, |
|||
//colProps: { span: 6 },
|
|||
}, |
|||
{ |
|||
label: '模板名称', |
|||
field: 'moduleName', |
|||
component: 'Input', |
|||
//colProps: { span: 6 },
|
|||
}, |
|||
|
|||
|
|||
]; |
|||
export const planModuleFormSchemas: FormSchema[] = [ |
|||
// {
|
|||
// label: '项目类型',
|
|||
// field: 'user',
|
|||
// component: 'Select',
|
|||
// required: true,
|
|||
// dynamicDisabled: true,
|
|||
// componentProps: {
|
|||
// options: [
|
|||
// { value: userStore.getUserInfo.id, label: userStore.getUserInfo.username }
|
|||
// ],
|
|||
// },
|
|||
// defaultValue: userStore.getUserInfo.id,
|
|||
// colProps: { span: 12 },
|
|||
|
|||
// },
|
|||
{ |
|||
label: '模板id', |
|||
field: 'id', |
|||
component: 'Input', |
|||
dynamicDisabled: true, |
|||
colProps: { span: 12 }, |
|||
}, |
|||
{ |
|||
label: '项目类型', |
|||
field: 'projectType', |
|||
component: 'Select', |
|||
required: true, |
|||
componentProps: { |
|||
options: projectTypeDict() |
|||
}, |
|||
colProps: { span: 12 }, |
|||
}, |
|||
{ |
|||
label: '模板名称', |
|||
field: 'moduleName', |
|||
component: 'Input', |
|||
required: true, |
|||
colProps: { span: 12 }, |
|||
}, |
|||
|
|||
]; |
|||
export const ProcessColumns: BasicColumn[] = [ |
|||
|
|||
{ |
|||
title: '节点名称', |
|||
dataIndex: 'taskName', |
|||
}, |
|||
{ |
|||
title: '处理人', |
|||
dataIndex: 'operator', |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: '处理时间', |
|||
dataIndex: 'operateDate', |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: '审批状态', |
|||
dataIndex: 'approvalStatue', |
|||
width: 100, |
|||
}, |
|||
{ |
|||
title: '审批意见', |
|||
dataIndex: 'workplace', |
|||
width: 100, |
|||
} |
|||
]; |
|||
Loading…
Reference in new issue