31 changed files with 2992 additions and 1082 deletions
@ -0,0 +1,177 @@ |
|||
<template> |
|||
<!-- 自定义表单 --> |
|||
<el-divider content-position="left">项目入库详情</el-divider> |
|||
<BasicForm @register="registerProjectForm" /> |
|||
<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 { ref, onMounted, reactive, onUpdated } from 'vue' |
|||
import { useForm, BasicForm } from '/@/components/Form'; |
|||
import { formSchemas, approveStartProcessColumns } from '../../projectLib/projectInfo/projectInfo.data'; |
|||
import { approvalformSchemas } from '../../myWork/inComplete/inComplete.data' |
|||
import { queryProjectInfoById, queryProcessInfo } from '../../projectLib/projectInfo/projectInfo.api' |
|||
import { BasicTable } from '/@/components/Table'; |
|||
import { useListPage } from '/@/hooks/system/useListPage'; |
|||
import { submitTask, getActionParam } from '../../myWork/inComplete/inComplete.api'; |
|||
import { getUserInfoByid } from '../../projectLib/initiatesProjects/initiatesProjects.api' |
|||
|
|||
import { useRouter, useRoute } from 'vue-router' |
|||
const route = useRoute(); |
|||
const router = useRouter() |
|||
console.log("routerouterouteroute", route.query) |
|||
let projectid = route.query.projectid |
|||
let taskid = route.query.taskId |
|||
const emit = defineEmits(['close']); |
|||
let showApprovalForm = ref() |
|||
let resButton = reactive({ |
|||
showApprovalForm: false, |
|||
IsEdit: false, |
|||
buttons: [] |
|||
}) |
|||
onMounted(async () => { |
|||
let param: any = { |
|||
projectid: projectid |
|||
} |
|||
let res = await queryProjectInfoById(param) |
|||
console.log("结果是", res) |
|||
setFieldsValue(res) |
|||
reload() |
|||
resButton = await getActionParam({ projectid: projectid, status: "1", taskId: taskid, procesType: route.query.procesType }) |
|||
console.log("resButton", resButton) |
|||
if (resButton.IsEdit) { |
|||
setProps({ disabled: false }) |
|||
} |
|||
showApprovalForm.value = resButton.showApprovalForm |
|||
}) |
|||
onUpdated(async () => { |
|||
console.log("我更新了") |
|||
updateSchema({ |
|||
field: 'flag', |
|||
componentProps: { |
|||
options: resButton.buttons, |
|||
} |
|||
}) |
|||
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, 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: !resButton.IsEdit |
|||
}); |
|||
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 |
|||
}) |
|||
|
|||
|
|||
const { tableContext } = useListPage({ |
|||
tableProps: { |
|||
size: 'small',//紧凑型表格 |
|||
title: '流程审批情况', |
|||
api: queryProcessInfo, |
|||
columns: approveStartProcessColumns, |
|||
showActionColumn: false, |
|||
useSearchForm: false, |
|||
beforeFetch(params) { |
|||
params.status = "1", |
|||
params.projectid = projectid |
|||
}, |
|||
}, |
|||
}); |
|||
// BasicTable绑定注册 |
|||
const [registerTable, { reload }] = tableContext; |
|||
async function handleSubmit() { |
|||
let approvalform = await getFieldsValueApprovalForm(); |
|||
let projectform = await getFieldsValueProjectForm(); |
|||
let param = { |
|||
flag: approvalform.flag, |
|||
projectid: projectid, |
|||
comment: approvalform.comment, |
|||
taskId: taskid, |
|||
status: route.query.status, |
|||
projectInfo: projectform, |
|||
isEdit: resButton.IsEdit == true ? "1" : "0" |
|||
} |
|||
// let outrs = Object.assign({},param,projectform) |
|||
console.log("param", param, "approvalform", approvalform, "projectform", projectform) |
|||
if (await validateApprovalForm() && await validateProjectForm()) { |
|||
console.log("提交成功!") |
|||
|
|||
let res = await submitTask(param) |
|||
console.log("提交成功!", res) |
|||
router.go(-1) |
|||
|
|||
|
|||
} |
|||
|
|||
} |
|||
async function customResetFunc() { |
|||
// let index = router.currentRoute.value |
|||
// console.log("index",index) |
|||
// router.close(index) |
|||
router.go(-1) |
|||
|
|||
} |
|||
</script> |
|||
<style></style> |
@ -0,0 +1,241 @@ |
|||
<template> |
|||
<!-- 自定义表单 --> |
|||
<el-divider content-position="left">项目入库详情</el-divider> |
|||
<BasicForm @register="registerProjectForm" /> |
|||
<el-divider content-position="left">项目资料详情</el-divider> |
|||
<BasicTable @register="registerResourceTable"> |
|||
<template #action="{ record }"> |
|||
<TableAction :actions="getTableAction(record)" /> |
|||
</template> |
|||
</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="5"> |
|||
<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="uploadfileApproval" setup> |
|||
import { onMounted, ref, reactive, onUpdated } from 'vue' |
|||
import { useForm, BasicForm } from '/@/components/Form'; |
|||
import { formSchemas, approveStartProcessColumns, } from '../../projectLib/projectInfo/projectInfo.data'; |
|||
import { approvalformSchemas } from '../../myWork/inComplete/inComplete.data' |
|||
import { queryProjectInfoById, queryProcessInfo } from '../../projectLib/projectInfo/projectInfo.api' |
|||
import { BasicTable, ActionItem, TableAction } from '/@/components/Table'; |
|||
import { useListPage } from '/@/hooks/system/useListPage'; |
|||
import { approveUploadFile, getActionParam } from '../../myWork/inComplete/inComplete.api'; |
|||
import { resourcetableColumns } from '../../projectLib/projectInfo/projectInfo.data'; |
|||
import { queryResourceInfo } from '../../projectLib/projectInfo/projectInfo.api' |
|||
import { useRouter, useRoute } from 'vue-router' |
|||
import { downloadFile } from "../../../api/common/api" |
|||
import { ElMessage } from 'element-plus' |
|||
|
|||
const route = useRoute(); |
|||
const router = useRouter() |
|||
console.log("routerouterouteroute", route.query) |
|||
let projectid = route.query.projectid |
|||
let taskid = route.query.taskId |
|||
const emit = defineEmits(['close']); |
|||
let showApprovalForm = ref() |
|||
let resButton = reactive({ |
|||
showApprovalForm: false, |
|||
IsEdit: false, |
|||
buttons: [] |
|||
}) |
|||
let fileList = reactive<Array<any>>([]); |
|||
|
|||
onMounted(async () => { |
|||
let param: any = { |
|||
projectid: projectid |
|||
} |
|||
let res = await queryProjectInfoById(param) |
|||
console.log("结果是", res) |
|||
setFieldsValue(res) |
|||
reload() |
|||
resButton = await getActionParam({ projectid: projectid, status: "2", taskId: taskid, procesType: route.query.procesType }) |
|||
showApprovalForm.value = resButton.showApprovalForm |
|||
|
|||
}) |
|||
onUpdated(async () => { |
|||
console.log("我更新了:") |
|||
updateSchema({ |
|||
field: 'flag', |
|||
componentProps: { |
|||
options: resButton.buttons, |
|||
} |
|||
}) |
|||
}) |
|||
/** |
|||
* BasicForm绑定注册;src\views\ProcessApprovalSubPage\initiatesProjectsApproval\initiatesProjectsApproval.vue |
|||
* 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 |
|||
}); |
|||
const [registerApprovalForm, { validate, getFieldsValue, 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 |
|||
}) |
|||
|
|||
|
|||
const { tableContext } = useListPage({ |
|||
tableProps: { |
|||
size: 'small',//紧凑型表格 |
|||
title: '流程审批情况', |
|||
api: queryProcessInfo, |
|||
columns: approveStartProcessColumns, |
|||
showActionColumn: false, |
|||
useSearchForm: false, |
|||
beforeFetch(params) { |
|||
params.status = "2", |
|||
params.projectid = projectid |
|||
}, |
|||
}, |
|||
}); |
|||
// BasicTable绑定注册 |
|||
const [registerTable, { reload }] = tableContext; |
|||
|
|||
|
|||
//项目资料table |
|||
const { tableContext: resourceTableContext } = useListPage({ |
|||
tableProps: { |
|||
size: 'small',//紧凑型表格 |
|||
title: '项目入库资料详情', |
|||
api: queryResourceInfo, |
|||
columns: resourcetableColumns, |
|||
useSearchForm: false, |
|||
actionColumn: { |
|||
width: 120, |
|||
fixed: "right", |
|||
}, |
|||
beforeFetch(params) { |
|||
params.status = "2", |
|||
params.projectid = projectid |
|||
}, |
|||
}, |
|||
}); |
|||
const [registerResourceTable] = resourceTableContext; |
|||
function getTableAction(record): ActionItem[] { |
|||
return [ |
|||
{ |
|||
label: '下载', |
|||
ifShow: true, |
|||
onClick: handleDetailpage.bind(null, record), |
|||
} |
|||
]; |
|||
} |
|||
function handleDetailpage(record) { |
|||
console.log("我这一行的数据是", record) |
|||
let param = { |
|||
path: record.documentPath, |
|||
fileName: record.documentName |
|||
} |
|||
// |
|||
console.log("我这一行的数据是", param) |
|||
|
|||
downloadFile("/huzhouProject/downloadfile", record.documentName, param) |
|||
} |
|||
|
|||
function httpRequest(option) { |
|||
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格式 |
|||
// let fileName = file.name |
|||
// let reg = /^.+(\.xlsx)$/ |
|||
// if(!reg.test(fileName)){ |
|||
// ElMessage.error("只能上传xlsx!") |
|||
// return false |
|||
// } |
|||
return true |
|||
} |
|||
// 文件数量过多时提醒 |
|||
function handleExceed() { |
|||
ElMessage.warning("最多只能上传五个文件") |
|||
} |
|||
|
|||
|
|||
|
|||
|
|||
async function handleSubmit() { |
|||
let approvalform = await getFieldsValue(); |
|||
const params = new FormData() |
|||
params.append("flag", approvalform.flag) |
|||
params.append("projectid", projectid) |
|||
params.append("comment", approvalform.comment) |
|||
params.append("taskId", taskid) |
|||
params.append("status", route.query.status) |
|||
if (fileList.length > 0) { |
|||
fileList.forEach((x) => { |
|||
console.log("xxxxxxxxxx", x) |
|||
params.append("file", x.file) |
|||
}); |
|||
} |
|||
console.log("param", params, "approvalform", approvalform) |
|||
if (await validate()) { |
|||
|
|||
let res = await approveUploadFile(params) |
|||
console.log("提交成功!", res) |
|||
router.go(-1) |
|||
|
|||
|
|||
} |
|||
|
|||
} |
|||
async function customResetFunc() { |
|||
router.go(-1) |
|||
|
|||
} |
|||
</script> |
|||
<style></style> |
@ -1,19 +1,11 @@ |
|||
import { defHttp } from '/@/utils/http/axios'; |
|||
|
|||
export enum Api { |
|||
list = '/sys/user/queryByOrgCodeForAddressList', |
|||
getMyAddressBook = '/huzhouUser/getMyAddressBook', |
|||
positionList = '/sys/position/list', |
|||
queryDepartTreeSync = '/sys/sysDepart/queryDepartTreeSync', |
|||
} |
|||
/** |
|||
* 获取部门树列表 |
|||
*/ |
|||
export const queryDepartTreeSync = (params?) => defHttp.get({ url: Api.queryDepartTreeSync, params }); |
|||
/** |
|||
* 部门用户信息 |
|||
*/ |
|||
export const list = (params?) => defHttp.get({ url: Api.list, params }); |
|||
/** |
|||
* 职务list |
|||
*/ |
|||
export const positionList = (params?) => defHttp.get({ url: Api.positionList, params }); |
|||
|
|||
|
|||
export const getMyAddressBook = (params?) => defHttp.get({ url: Api.getMyAddressBook, params }); |
|||
|
|||
|
@ -1,38 +0,0 @@ |
|||
<template> |
|||
<div> |
|||
<el-form :inline="true" :model="formQueryParam" class="demo-form-inline"> |
|||
<el-form-item label="人员名称"> |
|||
<el-input v-model="formQueryParam.userName" placeholder="人员名称" clearable /> |
|||
</el-form-item> |
|||
<el-form-item label="项目编号"> |
|||
<el-input v-model="formQueryParam.projectId" placeholder="项目编号" clearable /> |
|||
</el-form-item> |
|||
<el-form-item label="项目名称"> |
|||
<el-input v-model="formQueryParam.projectName" placeholder="项目名称" clearable /> |
|||
</el-form-item> |
|||
<el-form-item> |
|||
<el-button type="primary" @click="query">查询</el-button> |
|||
|
|||
</el-form-item> |
|||
</el-form> |
|||
|
|||
</div> |
|||
|
|||
</template> |
|||
|
|||
<script lang="ts" setup> |
|||
import {ref } from 'vue'; |
|||
|
|||
const formQueryParam = ref<any>({ |
|||
userName:"", |
|||
projectId:"", |
|||
projectName:"" |
|||
}) |
|||
function query(){ |
|||
|
|||
} |
|||
</script> |
|||
|
|||
<style lang="less"> |
|||
@import './index.less'; |
|||
</style> |
@ -1,89 +0,0 @@ |
|||
<template> |
|||
<a-row :class="['p-4', `${prefixCls}--box`]" type="flex" :gutter="10" style="max-height: 800px"> |
|||
<a-col :xl="6" :lg="24" :md="24" style="margin-bottom: 10px"> |
|||
<DepartLeftTree ref="leftTree" @select="onTreeSelect" /> |
|||
</a-col> |
|||
<a-col :xl="18" :lg="24" :md="24" style="margin-bottom: 10px"> |
|||
<div style="height: 100%;" class="address-book"> |
|||
<!--引用表格--> |
|||
<BasicTable @register="registerTable"> |
|||
<template #post="{ text }"> |
|||
{{ |
|||
(text || '') |
|||
.split(',') |
|||
.map((t) => (positionInfo[t] ? positionInfo[t] : t)) |
|||
.join(',') |
|||
}} |
|||
</template> |
|||
</BasicTable> |
|||
</div> |
|||
</a-col> |
|||
</a-row> |
|||
</template> |
|||
|
|||
<script lang="ts" setup> |
|||
import { provide, ref, unref } from 'vue'; |
|||
import { useDesign } from '/@/hooks/web/useDesign'; |
|||
import DepartLeftTree from './components/DepartLeftTree.vue'; |
|||
import { BasicTable } from '/@/components/Table'; |
|||
import { useListPage } from '/@/hooks/system/useListPage'; |
|||
import { columns, searchFormSchema } from './address.data'; |
|||
import { list, positionList } from './address.api'; |
|||
|
|||
const { prefixCls } = useDesign('address-list'); |
|||
provide('prefixCls', prefixCls); |
|||
|
|||
// 给子组件定义一个ref变量 |
|||
const leftTree = ref(); |
|||
|
|||
// 当前选中的部门code |
|||
const orgCode = ref(''); |
|||
const positionInfo = ref({}); |
|||
|
|||
// 列表页面公共参数、方法 |
|||
const { tableContext } = useListPage({ |
|||
tableProps: { |
|||
api: list, |
|||
columns, |
|||
//update-begin---author:wangshuai ---date:20220629 for:[VUEN-1485]进入系统管理--通讯录页面后,网页命令行报错------------ |
|||
rowKey: 'userId', |
|||
//update-end---author:wangshuai ---date:20220629 for:[VUEN-1485]进入系统管理--通讯录页面后,网页命令行报错-------------- |
|||
showIndexColumn: true, |
|||
formConfig: { |
|||
schemas: searchFormSchema, |
|||
}, |
|||
canResize: false, |
|||
actionColumn: null, |
|||
showTableSetting: false, |
|||
// 请求之前对参数做处理 |
|||
beforeFetch(params) { |
|||
params.orgCode = orgCode.value; |
|||
}, |
|||
}, |
|||
}); |
|||
//注册table数据 |
|||
const [registerTable, { reload }] = tableContext; |
|||
|
|||
// 左侧树选择后触发 |
|||
function onTreeSelect(data) { |
|||
orgCode.value = data.orgCode; |
|||
reload(); |
|||
} |
|||
|
|||
// 查询职务信息 |
|||
async function queryPositionInfo() { |
|||
const result = await positionList({ pageSize: 99999 }); |
|||
if (result) { |
|||
let obj = {}; |
|||
result.records.forEach((position) => { |
|||
obj[position['id']] = position['name']; |
|||
}); |
|||
positionInfo.value = obj; |
|||
} |
|||
} |
|||
queryPositionInfo(); |
|||
</script> |
|||
|
|||
<style lang="less"> |
|||
@import './index.less'; |
|||
</style> |
@ -1,91 +1,96 @@ |
|||
<template> |
|||
<div> |
|||
<!--引用表格--> |
|||
<BasicTable @register="registerTable"> |
|||
<!--插槽:table标题--> |
|||
<!--操作栏--> |
|||
<div> |
|||
<!--引用表格--> |
|||
<BasicTable @register="registerTable"> |
|||
<!--插槽:table标题--> |
|||
<!--操作栏--> |
|||
<template #action="{ record }"> |
|||
<!-- <TableAction :actions="getTableAction(record)" /> --> |
|||
<TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)" /> |
|||
<TableAction :actions="getTableAction(record)" /> |
|||
|
|||
</template> |
|||
</BasicTable> |
|||
<BasicModal @register="registerModal" title="已办流程信息详情" width="1200px" :showOkBtn="false"> |
|||
<complectedDetail :dataTo="proid" :taskid="taskid" @close="closeModals()"/> |
|||
</BasicTable> |
|||
<BasicModal @register="registerModal" title="已办流程信息详情" width="1200px" :showOkBtn="false"> |
|||
<complectedDetail :dataTo="proid" :taskid="taskid" @close="closeModals()" /> |
|||
</BasicModal> |
|||
</div> |
|||
</template> |
|||
</div> |
|||
</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 { columns, searchFormSchema } from './complete.data'; |
|||
// import { list } from './address.api'; |
|||
import {myCompleteTask} from '../inComplete/inComplete.api'; |
|||
<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 { columns, searchFormSchema } from './complete.data'; |
|||
// import { list } from './address.api'; |
|||
import { myCompleteTask } from '../inComplete/inComplete.api'; |
|||
|
|||
import { useModal } from '/@/components/Modal'; |
|||
import { BasicModal } from '/@/components/Modal'; |
|||
import { useModal } from '/@/components/Modal'; |
|||
import { BasicModal } from '/@/components/Modal'; |
|||
|
|||
import complectedDetail from './complectedDetail.vue'; |
|||
import complectedDetail from './complectedDetail.vue'; |
|||
|
|||
const [registerModal, { openModal,closeModal }] = useModal(); |
|||
const [registerModal, { openModal, closeModal }] = useModal(); |
|||
import { useRouter, useRoute } from 'vue-router' |
|||
const route = useRoute(); |
|||
const router = useRouter(); |
|||
console.log(" const route = useRoute();", route.query) |
|||
|
|||
|
|||
let proid = ref(); |
|||
let taskid = ref() |
|||
const { tableContext } = useListPage({ |
|||
designScope: 'basic-table-demo-ajax', |
|||
tableProps: { |
|||
title: '我的已办', |
|||
api: myCompleteTask, |
|||
columns: columns, |
|||
actionColumn: { |
|||
width: 120, |
|||
}, |
|||
//表单查询项设置 |
|||
formConfig: { |
|||
schemas: searchFormSchema, |
|||
} |
|||
let proid = ref(); |
|||
let taskid = ref() |
|||
const { tableContext } = useListPage({ |
|||
designScope: 'basic-table-demo-ajax', |
|||
tableProps: { |
|||
title: '我的已办', |
|||
api: myCompleteTask, |
|||
columns: columns, |
|||
actionColumn: { |
|||
width: 120, |
|||
}, |
|||
}); |
|||
//BasicTable绑定注册 |
|||
const [registerTable,{reload}] = tableContext; |
|||
function getTableAction(record): ActionItem[] { |
|||
return [ |
|||
{ |
|||
label: '处理', |
|||
onClick: handleEdit.bind(null, record), |
|||
}, |
|||
|
|||
]; |
|||
//表单查询项设置 |
|||
formConfig: { |
|||
schemas: searchFormSchema, |
|||
} |
|||
/** |
|||
* 下拉操作栏 |
|||
*/ |
|||
function getDropDownAction(record): ActionItem[] { |
|||
return [ |
|||
{ |
|||
label: '发起计划流程', |
|||
ifShow:true, |
|||
onClick: handleEdit.bind(null, record), |
|||
}, |
|||
}, |
|||
}); |
|||
//BasicTable绑定注册 |
|||
const [registerTable, { reload }] = tableContext; |
|||
function getTableAction(record): ActionItem[] { |
|||
return [ |
|||
{ |
|||
label: '处理', |
|||
onClick: handleEdit.bind(null, record), |
|||
}, |
|||
|
|||
]; |
|||
} |
|||
function handleEdit(record) { |
|||
console.log("打开子页面",record); |
|||
openModal(); |
|||
proid.value =record.projectid |
|||
// console.log(selectedRows.value); |
|||
// console.log(selectedRowKeys.value); |
|||
} |
|||
function closeModals(){ |
|||
closeModal() |
|||
reload() |
|||
]; |
|||
} |
|||
function handleEdit(record) { |
|||
record.procesType="1" //流程类型, 已办是1 代办是0 |
|||
|
|||
} |
|||
</script> |
|||
console.log("打开子页面", record); |
|||
// openModal(); |
|||
// proid.value =record.projectid |
|||
// record.procesType="1" //流程类型, 已办是1 代办是0 |
|||
if (record.status == 1) { |
|||
router.push({ // push方法 |
|||
path: '/ProcessApprovalSubPage/initiatesProjectsApproval', //这里是跳转页面的name inComplectedDetail |
|||
query: record |
|||
}) |
|||
} |
|||
else if (record.status == 2) { |
|||
router.push({ // push方法 |
|||
path: '/ProcessApprovalSubPage/uploadfileApproval', //这里是跳转页面的name inComplectedDetail |
|||
query: record |
|||
}) |
|||
} |
|||
// console.log(selectedRows.value); |
|||
// console.log(selectedRowKeys.value); |
|||
} |
|||
function closeModals() { |
|||
closeModal() |
|||
reload() |
|||
|
|||
} |
|||
</script> |
|||
|
|||
<style scoped></style> |
|||
<style scoped></style> |
@ -1,127 +0,0 @@ |
|||
<template> |
|||
<!-- 自定义表单 --> |
|||
<el-divider content-position="left">项目入库详情</el-divider> |
|||
<BasicForm @register="registerProjectForm" /> |
|||
<el-divider content-position="left">项目审批详情</el-divider> |
|||
<BasicTable @register="registerTable"/> |
|||
<el-divider content-position="left">项目审批</el-divider> |
|||
<div> |
|||
<BasicForm @register="registerApprovalForm" @submit="handleSubmit"/> |
|||
</div> |
|||
|
|||
|
|||
</template> |
|||
<script lang="ts" name="inComplectedDetail" setup> |
|||
import { defineProps,watchEffect} from 'vue' |
|||
import { useForm, BasicForm } from '/@/components/Form'; |
|||
import { formSchemas,ProcessColumns,} from '../../projectLib/projectInfo/projectInfo.data'; |
|||
import {approvalformSchemas} from './inComplete.data' |
|||
import {queryProjectInfoById,queryProcessInfo} from '../../projectLib/projectInfo/projectInfo.api' |
|||
import {BasicTable } from '/@/components/Table'; |
|||
import { useListPage } from '/@/hooks/system/useListPage'; |
|||
import {submitTask} from './inComplete.api'; |
|||
|
|||
|
|||
let proid = defineProps(["dataTo","taskid"]) |
|||
const emit = defineEmits(['close']); |
|||
watchEffect(async ()=>{ |
|||
console.log("dataTo",proid.dataTo) |
|||
let param:any = { |
|||
projectid:proid.dataTo |
|||
} |
|||
let res =await queryProjectInfoById(param) |
|||
console.log("结果是",res) |
|||
setFieldsValue(res) |
|||
reload() |
|||
}) |
|||
|
|||
/** |
|||
* 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 |
|||
}); |
|||
const[registerApprovalForm,{validate,getFieldsValue}] = 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 |
|||
}) |
|||
|
|||
|
|||
const { tableContext } = useListPage({ |
|||
tableProps: { |
|||
size:'small',//紧凑型表格 |
|||
title: '流程审批情况', |
|||
api:queryProcessInfo, |
|||
columns: ProcessColumns, |
|||
showActionColumn:false, |
|||
useSearchForm:false, |
|||
beforeFetch(params) { |
|||
params.status = "1", |
|||
params.projectid=proid.dataTo |
|||
}, |
|||
}, |
|||
}); |
|||
// BasicTable绑定注册 |
|||
const [registerTable,{reload}] = tableContext; |
|||
async function handleSubmit(){ |
|||
let approvalform = await getFieldsValue(); |
|||
let param = { |
|||
flag:approvalform.flag, |
|||
projectid:proid.dataTo, |
|||
comment:approvalform.comment, |
|||
taskId:proid.taskid |
|||
} |
|||
console.log("aaaaaaaaaaa",proid) |
|||
console.log("param",param,"approvalform",approvalform) |
|||
if(await validate()){ |
|||
|
|||
let res = await submitTask(param) |
|||
console.log("提交成功!",res) |
|||
await emit("close"); |
|||
|
|||
|
|||
} |
|||
|
|||
} |
|||
async function customResetFunc(){ |
|||
emit("close"); |
|||
} |
|||
</script> |
|||
<style></style> |
|||
../datamodule/inComplected.data |
@ -1,92 +1,87 @@ |
|||
<template> |
|||
<div> |
|||
<!--引用表格--> |
|||
<BasicTable @register="registerTable"> |
|||
<!--插槽:table标题--> |
|||
<!--操作栏--> |
|||
<div> |
|||
<!--引用表格--> |
|||
<BasicTable @register="registerTable"> |
|||
<!--插槽:table标题--> |
|||
<!--操作栏--> |
|||
<template #action="{ record }"> |
|||
<!-- <TableAction :actions="getTableAction(record)" /> --> |
|||
<TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)" /> |
|||
<TableAction :actions="getTableAction(record)" /> |
|||
|
|||
</template> |
|||
</BasicTable> |
|||
<BasicModal @register="registerModalDetail" title="代办流程信息详情" width="1200px" :showOkBtn="false" :showCancelBtn="false"> |
|||
</BasicTable> |
|||
<!-- <BasicModal @register="registerModalDetail" title="代办流程信息详情" width="1200px" :showOkBtn="false" :showCancelBtn="false"> |
|||
<inComplectedDetail :dataTo="proid" :taskid="taskid" @close="closeModalDetail()"/> |
|||
</BasicModal> |
|||
</div> |
|||
</template> |
|||
</BasicModal> --> |
|||
</div> |
|||
</template> |
|||
|
|||
<script lang="ts" name="system-user" setup> |
|||
//ts语法 |
|||
import { ref, computed, unref } from 'vue'; |
|||
import { ActionItem,BasicTable,TableAction } from '/@/components/Table'; |
|||
import { useListPage } from '/@/hooks/system/useListPage'; |
|||
import { columns, searchFormSchema } from './inComplete.data'; |
|||
// import { list } from './address.api'; |
|||
import {myTaskList} from './inComplete.api'; |
|||
<script lang="ts" name="system-user" setup> |
|||
//ts语法 |
|||
import { ref, computed, unref } from 'vue'; |
|||
import { ActionItem, BasicTable, TableAction } from '/@/components/Table'; |
|||
import { useListPage } from '/@/hooks/system/useListPage'; |
|||
import { columns, searchFormSchema } from './inComplete.data'; |
|||
// import { list } from './address.api'; |
|||
import { myTaskList } from './inComplete.api'; |
|||
|
|||
import inComplectedDetail from './inComplectedDetail.vue'; |
|||
import { useRouter, useRoute } from 'vue-router' |
|||
const router = useRouter(); |
|||
|
|||
import { useModal } from '/@/components/Modal'; |
|||
import { BasicModal } from '/@/components/Modal'; |
|||
import { useModal } from '/@/components/Modal'; |
|||
import { BasicModal } from '/@/components/Modal'; |
|||
|
|||
let proid = ref() |
|||
let taskid = ref() |
|||
const [registerModalDetail, { openModal:openDetail, closeModal:closeDetail}] = useModal();//项目详情的 |
|||
let proid = ref() |
|||
let taskid = ref() |
|||
const [registerModalDetail, { openModal: openDetail, closeModal: closeDetail }] = useModal();//项目详情的 |
|||
|
|||
//表格组件数据 |
|||
const { tableContext } = useListPage({ |
|||
designScope: 'basic-table-demo-ajax', |
|||
tableProps: { |
|||
title: '我的代办', |
|||
api: myTaskList, |
|||
columns: columns, |
|||
actionColumn: { |
|||
width: 120, |
|||
}, |
|||
//表单查询项设置 |
|||
formConfig: { |
|||
schemas: searchFormSchema, |
|||
} |
|||
//表格组件数据 |
|||
const { tableContext } = useListPage({ |
|||
designScope: 'basic-table-demo-ajax', |
|||
tableProps: { |
|||
title: '我的代办', |
|||
api: myTaskList, |
|||
columns: columns, |
|||
actionColumn: { |
|||
width: 120, |
|||
}, |
|||
}); |
|||
//BasicTable绑定注册 |
|||
const [registerTable,{reload}] = tableContext; |
|||
function getTableAction(record): ActionItem[] { |
|||
return [ |
|||
{ |
|||
label: '处理', |
|||
onClick: handleEdit.bind(null, record), |
|||
}, |
|||
|
|||
]; |
|||
//表单查询项设置 |
|||
formConfig: { |
|||
schemas: searchFormSchema, |
|||
} |
|||
/** |
|||
* 下拉操作栏 |
|||
*/ |
|||
function getDropDownAction(record): ActionItem[] { |
|||
return [ |
|||
{ |
|||
label: '上传项目资料', |
|||
ifShow:true, |
|||
onClick: handleEdit.bind(null, record), |
|||
}, |
|||
}, |
|||
}); |
|||
//BasicTable绑定注册 |
|||
const [registerTable, { reload }] = tableContext; |
|||
function getTableAction(record): ActionItem[] { |
|||
return [ |
|||
{ |
|||
label: '处理', |
|||
onClick: handleEdit.bind(null, record), |
|||
}, |
|||
|
|||
]; |
|||
]; |
|||
} |
|||
function handleEdit(record) { |
|||
record.procesType="0" //流程类型, 已办是1 代办是0Object.assign({}, xiaoming, {test1:'demo1', test2:'demo2'}); // 第一个参数是 目标对象,后面的全是源对象,执行完之后返回目标对象 |
|||
if (record.status == 1) { |
|||
router.push({ // push方法 |
|||
path: '/ProcessApprovalSubPage/initiatesProjectsApproval', //这里是跳转页面的name inComplectedDetail |
|||
query: record |
|||
}) |
|||
} |
|||
function handleEdit(record) { |
|||
console.log(record.description,record); |
|||
proid.value =record.projectid |
|||
taskid.value= record.taskId |
|||
openDetail() |
|||
// console.log(selectedRows.value); |
|||
// console.log(selectedRowKeys.value); |
|||
else if (record.status == 2) { |
|||
router.push({ // push方法 |
|||
path: '/ProcessApprovalSubPage/uploadfileApproval', //这里是跳转页面的name inComplectedDetail |
|||
query: record |
|||
}) |
|||
} |
|||
function closeModalDetail(){ |
|||
closeDetail() |
|||
reload() |
|||
|
|||
} |
|||
</script> |
|||
|
|||
<style scoped></style> |
|||
// console.log(selectedRows.value); |
|||
// console.log(selectedRowKeys.value); |
|||
} |
|||
function closeModalDetail() { |
|||
closeDetail() |
|||
reload() |
|||
} |
|||
</script> |
|||
<style scoped></style> |
@ -0,0 +1,492 @@ |
|||
import { FormSchema, FormActionType } from '/@/components/Form'; |
|||
import { getDictItemsByCode } from '/@/utils/dict/index'; |
|||
import { getWorkPlaceTypeDict, getContactorDict } from './initiatesProjects.api' |
|||
|
|||
const projectTypeDicts: Array<Object> = getDictItemsByCode("projectType") |
|||
const approvalRsesults: Array<Object> = getDictItemsByCode("approvalResult") |
|||
|
|||
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 |
|||
} |
|||
export const formSchemas: FormSchema[] = [ |
|||
{ |
|||
//标题名称
|
|||
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: 'projectType', |
|||
component: 'Select', |
|||
colProps: { span: 12 }, |
|||
|
|||
//填写组件Select的属性
|
|||
componentProps: { |
|||
options: projectTypeDict() |
|||
}, |
|||
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: 'constructionPeriod', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'InputNumber', |
|||
componentProps: { |
|||
//数值精度
|
|||
precision: 0, |
|||
//步数
|
|||
step: 0.1 |
|||
}, |
|||
suffix: "年", |
|||
//一列占比总共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 |
|||
}, |
|||
suffix: "元", |
|||
//一列占比总共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 |
|||
}, |
|||
suffix: "元", |
|||
//一列占比总共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 |
|||
}, |
|||
suffix: "元", |
|||
//一列占比总共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 |
|||
}, |
|||
suffix: "元", |
|||
//一列占比总共24,比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
required: true, |
|||
}, |
|||
|
|||
{ |
|||
//标题名称
|
|||
label: '改革所属项目', |
|||
//字段
|
|||
field: 'reformName', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'Input', |
|||
|
|||
//一列占比总共24,比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
required: true, |
|||
}, |
|||
{ |
|||
//标题名称
|
|||
label: '上级指导室', |
|||
//字段
|
|||
field: 'superLeader', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'Input', |
|||
|
|||
//一列占比总共24,比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
required: true, |
|||
}, |
|||
{ |
|||
//标题名称
|
|||
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 }, |
|||
required: true, |
|||
}, |
|||
|
|||
{ |
|||
//标题名称
|
|||
label: '管理单位负责人', |
|||
//字段
|
|||
field: 'manageContactor', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'Select', |
|||
componentProps: { |
|||
options: [], |
|||
|
|||
}, //一列占比总共24,比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
required: true, |
|||
}, |
|||
{ |
|||
//标题名称
|
|||
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 }, |
|||
required: true, |
|||
}, |
|||
{ |
|||
//标题名称
|
|||
label: '监管单位负责人', |
|||
//字段
|
|||
field: 'supervisorContactor', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'Select', |
|||
componentProps: { |
|||
options: [], |
|||
|
|||
}, |
|||
//一列占比总共24,比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
required: true, |
|||
}, |
|||
|
|||
{ |
|||
//标题名称
|
|||
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 }, |
|||
required: true, |
|||
}, |
|||
{ |
|||
//标题名称
|
|||
label: '承建单位负责人', |
|||
//字段
|
|||
field: 'contructorContactor', |
|||
//组件 支持组件详见 components/Form/src/types/index.ts 中的 ComponentType
|
|||
component: 'Select', |
|||
componentProps: { |
|||
options: [], |
|||
|
|||
}, |
|||
//一列占比总共24,比如一行显示2列
|
|||
colProps: { span: 12 }, |
|||
required: true, |
|||
}, |
|||
{ |
|||
//标题名称
|
|||
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 }, |
|||
}, |
|||
]; |
@ -1,189 +0,0 @@ |
|||
import { defHttp } from '/@/utils/http/axios'; |
|||
import { Modal } from 'ant-design-vue'; |
|||
|
|||
enum Api { |
|||
list = '/sys/role/list', |
|||
listByTenant = '/sys/role/listByTenant', |
|||
save = '/sys/role/add', |
|||
edit = '/sys/role/edit', |
|||
deleteRole = '/sys/role/delete', |
|||
deleteBatch = '/sys/role/deleteBatch', |
|||
exportXls = '/sys/role/exportXls', |
|||
importExcel = '/sys/role/importExcel', |
|||
isRoleExist = '/sys/role/checkRoleCode', |
|||
queryTreeListForRole = '/sys/role/queryTreeList', |
|||
queryRolePermission = '/sys/permission/queryRolePermission', |
|||
saveRolePermission = '/sys/permission/saveRolePermission', |
|||
queryDataRule = '/sys/role/datarule', |
|||
getParentDesignList = '/act/process/extActDesignFlowData/getDesFormFlows', |
|||
getRoleDegisnList = '/joa/designform/designFormCommuse/getRoleDegisnList', |
|||
saveRoleDesign = '/joa/designform/designFormCommuse/sysRoleDesignAdd', |
|||
userList = '/sys/user/userRoleList', |
|||
deleteUserRole = '/sys/user/deleteUserRole', |
|||
batchDeleteUserRole = '/sys/user/deleteUserRoleBatch', |
|||
addUserRole = '/sys/user/addSysUserRole', |
|||
saveRoleIndex = '/sys/sysRoleIndex/add', |
|||
editRoleIndex = '/sys/sysRoleIndex/edit', |
|||
queryIndexByCode = '/sys/sysRoleIndex/queryByCode', |
|||
} |
|||
/** |
|||
* 导出api |
|||
*/ |
|||
export const getExportUrl = Api.exportXls; |
|||
/** |
|||
* 导入api |
|||
*/ |
|||
export const getImportUrl = Api.importExcel; |
|||
/** |
|||
* 系统角色列表 |
|||
* @param params |
|||
*/ |
|||
export const list = (params) => defHttp.get({ url: Api.list, params }); |
|||
/** |
|||
* 租户角色列表 |
|||
* @param params |
|||
*/ |
|||
export const listByTenant = (params) => defHttp.get({ url: Api.listByTenant, params }); |
|||
|
|||
/** |
|||
* 删除角色 |
|||
*/ |
|||
export const deleteRole = (params, handleSuccess) => { |
|||
return defHttp.delete({ url: Api.deleteRole, params }, { joinParamsToUrl: true }).then(() => { |
|||
handleSuccess(); |
|||
}); |
|||
}; |
|||
/** |
|||
* 批量删除角色 |
|||
* @param params |
|||
*/ |
|||
export const batchDeleteRole = (params, handleSuccess) => { |
|||
Modal.confirm({ |
|||
title: '确认删除', |
|||
content: '是否删除选中数据', |
|||
okText: '确认', |
|||
cancelText: '取消', |
|||
onOk: () => { |
|||
return defHttp.delete({ url: Api.deleteBatch, data: params }, { joinParamsToUrl: true }).then(() => { |
|||
handleSuccess(); |
|||
}); |
|||
}, |
|||
}); |
|||
}; |
|||
/** |
|||
* 保存或者更新角色 |
|||
* @param params |
|||
*/ |
|||
export const saveOrUpdateRole = (params, isUpdate) => { |
|||
let url = isUpdate ? Api.edit : Api.save; |
|||
return defHttp.post({ url: url, params }); |
|||
}; |
|||
/** |
|||
* 编码校验 |
|||
* @param params |
|||
*/ |
|||
// update-begin--author:liaozhiyang---date:20231215---for:【QQYUN-7415】表单调用接口进行校验的添加防抖
|
|||
let timer; |
|||
export const isRoleExist = (params) => { |
|||
return new Promise((resolve, rejected) => { |
|||
clearTimeout(timer); |
|||
timer = setTimeout(() => { |
|||
defHttp |
|||
.get({ url: Api.isRoleExist, params }, { isTransformResponse: false }) |
|||
.then((res) => { |
|||
resolve(res); |
|||
}) |
|||
.catch((error) => { |
|||
rejected(error); |
|||
}); |
|||
}, 500); |
|||
}); |
|||
}; |
|||
// update-end--author:liaozhiyang---date:20231215---for:【QQYUN-7415】表单调用接口进行校验的添加防抖
|
|||
/** |
|||
* 根据角色查询树信息 |
|||
*/ |
|||
export const queryTreeListForRole = () => defHttp.get({ url: Api.queryTreeListForRole }); |
|||
/** |
|||
* 查询角色权限 |
|||
*/ |
|||
export const queryRolePermission = (params) => defHttp.get({ url: Api.queryRolePermission, params }); |
|||
/** |
|||
* 保存角色权限 |
|||
*/ |
|||
export const saveRolePermission = (params) => defHttp.post({ url: Api.saveRolePermission, params }); |
|||
/** |
|||
* 查询角色数据规则 |
|||
*/ |
|||
export const queryDataRule = (params) => |
|||
defHttp.get({ url: `${Api.queryDataRule}/${params.functionId}/${params.roleId}` }, { isTransformResponse: false }); |
|||
/** |
|||
* 保存角色数据规则 |
|||
*/ |
|||
export const saveDataRule = (params) => defHttp.post({ url: Api.queryDataRule, params }); |
|||
/** |
|||
* 获取表单数据 |
|||
* @return List<Map> |
|||
*/ |
|||
export const getParentDesignList = () => defHttp.get({ url: Api.getParentDesignList }); |
|||
/** |
|||
* 获取角色表单数据 |
|||
* @return List<Map> |
|||
*/ |
|||
export const getRoleDegisnList = (params) => defHttp.get({ url: Api.getRoleDegisnList, params }); |
|||
/** |
|||
* 提交角色工单信息 |
|||
*/ |
|||
export const saveRoleDesign = (params) => defHttp.post({ url: Api.saveRoleDesign, params }); |
|||
/** |
|||
* 角色列表接口 |
|||
* @param params |
|||
*/ |
|||
export const userList = (params) => defHttp.get({ url: Api.userList, params }); |
|||
/** |
|||
* 删除角色用户 |
|||
*/ |
|||
export const deleteUserRole = (params, handleSuccess) => { |
|||
return defHttp.delete({ url: Api.deleteUserRole, params }, { joinParamsToUrl: true }).then(() => { |
|||
handleSuccess(); |
|||
}); |
|||
}; |
|||
/** |
|||
* 批量删除角色用户 |
|||
* @param params |
|||
*/ |
|||
export const batchDeleteUserRole = (params, handleSuccess) => { |
|||
Modal.confirm({ |
|||
title: '确认删除', |
|||
content: '是否删除选中数据', |
|||
okText: '确认', |
|||
cancelText: '取消', |
|||
onOk: () => { |
|||
return defHttp.delete({ url: Api.batchDeleteUserRole, params }, { joinParamsToUrl: true }).then(() => { |
|||
handleSuccess(); |
|||
}); |
|||
}, |
|||
}); |
|||
}; |
|||
/** |
|||
* 添加已有用户 |
|||
*/ |
|||
export const addUserRole = (params, handleSuccess) => { |
|||
return defHttp.post({ url: Api.addUserRole, params }).then(() => { |
|||
handleSuccess(); |
|||
}); |
|||
}; |
|||
/** |
|||
* 保存或者更新 |
|||
* @param params |
|||
* @param isUpdate 是否是更新数据 |
|||
*/ |
|||
export const saveOrUpdateRoleIndex = (params, isUpdate) => { |
|||
let url = isUpdate ? Api.editRoleIndex : Api.saveRoleIndex; |
|||
return defHttp.post({ url: url, params }); |
|||
}; |
|||
/** |
|||
* 根据code查询首页配置 |
|||
* @param params |
|||
*/ |
|||
export const queryIndexByCode = (params) => defHttp.get({ url: Api.queryIndexByCode, params }, { isTransformResponse: false }); |
@ -1,81 +1,123 @@ |
|||
<template> |
|||
<!-- 自定义表单 --> |
|||
<el-divider content-position="left">项目入库详情</el-divider> |
|||
<BasicForm @register="registerProjectForm" /> |
|||
<el-divider content-position="left">项目审批详情</el-divider> |
|||
<BasicTable @register="registerTable"/> |
|||
<!-- <el-dialog v-model="dialogTableVisible" title="Shipping address"> |
|||
<el-table :data="gridData"> |
|||
<el-table-column property="date" label="Date" width="150" /> |
|||
<el-table-column property="name" label="Name" width="200" /> |
|||
<el-table-column property="address" label="Address" /> |
|||
</el-table> |
|||
<!-- 自定义表单 --> |
|||
<el-divider content-position="left">项目入库详情</el-divider> |
|||
<BasicForm @register="registerProjectForm" /> |
|||
|
|||
</el-dialog> --> |
|||
|
|||
<div v-if="projectStatus >= 3"> |
|||
<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 { defineProps,watchEffect} from 'vue' |
|||
import { ref, defineProps, onMounted } from 'vue' |
|||
import { useForm, BasicForm } from '/@/components/Form'; |
|||
import { formSchemas,ProcessColumns} from './projectInfo.data'; |
|||
import{queryProjectInfoById,queryProcessInfo} from './projectInfo.api' |
|||
import {BasicTable } from '/@/components/Table'; |
|||
import { formSchemas, approveStartProcessColumns, resourcetableColumns } from './projectInfo.data'; |
|||
import { queryProjectInfoById, queryProcessInfo, queryResourceInfo } from './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 projectStatus = ref() |
|||
|
|||
let proid = defineProps(["dataTo"]) |
|||
|
|||
watchEffect(async ()=>{ |
|||
console.log("dataTo",proid.dataTo) |
|||
let param:any = { |
|||
projectid:proid.dataTo |
|||
onMounted(async () => { |
|||
console.log("projectid", dataTo.projectid) |
|||
let param: any = { |
|||
projectid: dataTo.projectid |
|||
} |
|||
let res =await queryProjectInfoById(param) |
|||
console.log("结果是",res) |
|||
setFieldsValue(res) |
|||
reload() |
|||
let resProject = await queryProjectInfoById(param) |
|||
setFieldsValue(resProject) |
|||
projectStatus.value = resProject.status |
|||
console.log("projectid", dataTo.projectid, projectStatus.value) |
|||
}) |
|||
|
|||
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 |
|||
}); |
|||
|
|||
/** |
|||
* 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.status = projectStatus.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.status = "2", |
|||
params.projectid = dataTo.projectid |
|||
}, |
|||
}, |
|||
}); |
|||
const [registerResourceTable] = tableContext; |
|||
|
|||
|
|||
const { tableContext } = useListPage({ |
|||
tableProps: { |
|||
size:'small',//紧凑型表格 |
|||
title: '流程审批情况', |
|||
api:queryProcessInfo, |
|||
columns: ProcessColumns, |
|||
showActionColumn:false, |
|||
useSearchForm:false, |
|||
beforeFetch(params) { |
|||
params.status = "1", |
|||
params.projectid=proid.dataTo |
|||
}, |
|||
}, |
|||
}); |
|||
// BasicTable绑定注册 |
|||
const [registerTable,{reload}] = tableContext; |
|||
function handleDetailpage(record) { |
|||
console.log("我这一行的数据是", record) |
|||
let param = { |
|||
path: record.documentPath, |
|||
fileName: record.documentName |
|||
} |
|||
// |
|||
console.log("我这一行的数据是", param) |
|||
|
|||
downloadFile("/huzhouProject/downloadfile", record.documentName, param) |
|||
} |
|||
</script> |
|||
<style></style> |
|||
|
@ -0,0 +1,132 @@ |
|||
<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> --> |
|||
</div> |
|||
</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'; |
|||
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), |
|||
} |
|||
]; |
|||
} |
|||
|
|||
|
|||
//项目资料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) |
|||
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 === 'scheduledEndTime') { |
|||
// record.editValueRefs.name4.value = `${value}`; |
|||
// } |
|||
// console.log(column, value, record); |
|||
// } |
|||
function handlecancle() { |
|||
emit("close") |
|||
} |
|||
|
|||
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; |
|||
} |
|||
} |
|||
await saveProjectPlan(tableData) |
|||
emit("close") |
|||
} |
|||
async function handleRemoveDetail(record) { |
|||
let tableData = await getDataSource(); |
|||
|
|||
} |
|||
</script> |
|||
<style></style> |
|||
|
@ -0,0 +1,116 @@ |
|||
<template> |
|||
<div> |
|||
<!--引用表格--> |
|||
<BasicTable @register="registerTable"> |
|||
<!--插槽:table标题--> |
|||
<!--操作栏--> |
|||
<template #action="{ record }"> |
|||
<!-- <TableAction :actions="getTableAction(record)" /> --> |
|||
<TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)" /> |
|||
</template> |
|||
</BasicTable> |
|||
</div> |
|||
<BasicModal @register="registeViewPlanDetail" title="项目信息详情" width="1200px" :showOkBtn="false"> |
|||
<viewPlanDetail :projectId="projectId"/> |
|||
</BasicModal> |
|||
<BasicModal @register="registerProjectPlan" title="发起项目计划审批" width="1200px" :showOkBtn="false" :showCancelBtn="false"> |
|||
<addPlan :projectType="projectType" :projectId="projectId" @close="closeProjectPlanModal()" /> |
|||
</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 addPlan from './addPlan.vue' |
|||
import viewPlanDetail from "./viewPlanDetail.vue"; |
|||
import { columns, searchFormSchema } from '../projectInfo/projectInfo.data'; |
|||
|
|||
import { queryProjectApprovedPage } from './projectPlan.api'; |
|||
|
|||
let projectId = ref(); |
|||
let projectType = ref(); |
|||
const [registeViewPlanDetail, { openModal:openViewPlanDetail }] = useModal();//查看计划审批的 |
|||
const [registerProjectPlan, { openModal: openProjectPlan, closeModal: closeProjectPlan }] = useModal();//发起计划审批的 |
|||
|
|||
const { tableContext } = useListPage({ |
|||
designScope: 'basic-table-demo-ajax', |
|||
tableProps: { |
|||
title: '项目信息', |
|||
api: queryProjectApprovedPage, |
|||
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 getDropDownAction(record): ActionItem[] { |
|||
return [ |
|||
{ |
|||
label: '设计项目计划', |
|||
ifShow: () => { |
|||
return record.status == 4 |
|||
}, |
|||
onClick: handlePlan.bind(null, record) |
|||
}, |
|||
{ |
|||
label: '查看项目计划', |
|||
ifShow: () => { |
|||
return record.status == 5 |
|||
}, |
|||
onClick: handleViewPlan.bind(null, record) |
|||
}, |
|||
]; |
|||
} |
|||
|
|||
function handleDetailpage(record) { |
|||
projectId.value = record.id |
|||
openViewPlanDetail() |
|||
|
|||
|
|||
// console.log(selectedRows.value); |
|||
// console.log(selectedRowKeys.value); |
|||
} |
|||
function handlePlan(record) { |
|||
projectType.value = record.projectType |
|||
projectId.value = record.id |
|||
openProjectPlan() |
|||
|
|||
// console.log(selectedRows.value); |
|||
// console.log(selectedRowKeys.value); |
|||
} |
|||
function handleViewPlan(record) { |
|||
projectId.value = record.id |
|||
projectType.value =undefined |
|||
openViewPlanDetail() |
|||
} |
|||
function closeProjectPlanModal() { |
|||
closeProjectPlan() |
|||
reload() |
|||
} |
|||
</script> |
|||
|
|||
<style scoped></style> |
@ -0,0 +1,20 @@ |
|||
import { defHttp } from '/@/utils/http/axios'; |
|||
|
|||
export enum Api { |
|||
saveprojectInfo = "", |
|||
queryProjectApprovedPage = '/huzhouProject/queryProjectApprovedPage', |
|||
queryPlanModuleDetailPage = "/huzhouPlan/queryPlanModuleDetailPage", |
|||
queryPlanModuleone = '/huzhouPlan/queryPlanModuleone', |
|||
saveProjectPlan = '/huzhouPlan/saveProjectPlan', |
|||
queryProjectPlan="/huzhouPlan/queryProjectPlan" |
|||
} |
|||
/** |
|||
* 提交入库申请流程 |
|||
*/ |
|||
export const queryProjectApprovedPage = (params) => defHttp.get({ url: Api.queryProjectApprovedPage, params }) |
|||
export const queryPlanModuleDetailPage = (params) => defHttp.get({ url: Api.queryPlanModuleDetailPage, params }) |
|||
export const queryPlanModuleone = (params) => defHttp.get({ url: Api.queryPlanModuleone, params }) |
|||
|
|||
export const saveProjectPlan = (params) => defHttp.post({ url: Api.saveProjectPlan, params }) |
|||
|
|||
export const queryProjectPlan = (params) => defHttp.get({ url: Api.queryProjectPlan, params }) |
@ -0,0 +1,279 @@ |
|||
import { FormSchema } from '/@/components/Form'; |
|||
import { BasicColumn } from '/@/components/Table'; |
|||
import { getDictItemsByCode } from '/@/utils/dict/index'; |
|||
import { useUserStore } from '/@/store/modules/user'; |
|||
import dayjs from "dayjs"; |
|||
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 planDetailColumns: BasicColumn[] = [ |
|||
|
|||
{ |
|||
title: '模板id', |
|||
width: 150, |
|||
dataIndex: 'moduleId', |
|||
|
|||
}, |
|||
{ |
|||
title: '计划名称', |
|||
dataIndex: 'taskName', |
|||
width: 150, |
|||
|
|||
}, |
|||
{ |
|||
title: '计划序号', |
|||
dataIndex: 'orderNumber', |
|||
width: 150, |
|||
|
|||
}, |
|||
{ |
|||
title: '最大天数', |
|||
dataIndex: 'maxDays', |
|||
width: 100, |
|||
}, |
|||
{ |
|||
title: '计划开始时间', |
|||
dataIndex: 'scheduledStartTime', |
|||
width: 150, |
|||
edit: true, |
|||
editRule: async (text, record) => { |
|||
if (text > record.scheduledEndTime) { |
|||
return '开始时间必须小于结束时间'; |
|||
} |
|||
if (!text) { |
|||
return '请选择日期'; |
|||
} |
|||
if (record.maxDays && text && record.scheduledEndTime) { |
|||
let days = dayjs(record.scheduledEndTime).diff(text, "day") |
|||
console.log("我这一行的数据是daysdaysdays", days) |
|||
|
|||
if ( days > record.maxDays) { |
|||
return '计划时常超过预定期限'; |
|||
} |
|||
} |
|||
return ''; |
|||
}, |
|||
editComponent: 'DatePicker', |
|||
editComponentProps: { |
|||
//日期格式化,页面上显示的值
|
|||
format: 'YYYY-MM-DD', |
|||
//返回值格式化(绑定值的格式)
|
|||
valueFormat: 'YYYY-MM-DD', |
|||
//是否显示今天按钮
|
|||
showToday: true, |
|||
//不可选择日期
|
|||
disabledDate: (currentDate) => { |
|||
let date = dayjs(currentDate).format('YYYY-MM-DD'); |
|||
let nowDate = dayjs(new Date()).format('YYYY-MM-DD'); |
|||
//当天不可选择
|
|||
if (date < nowDate) { |
|||
return true; |
|||
} |
|||
return false; |
|||
} |
|||
} |
|||
}, |
|||
{ |
|||
title: '计划结束时间', |
|||
dataIndex: 'scheduledEndTime', |
|||
width: 150, |
|||
edit: true, |
|||
editRule: async (text, record) => { |
|||
if (text < record.scheduledStartTime) { |
|||
return '结束时间必须大于开始时间'; |
|||
} |
|||
if (!text) { |
|||
return '请选择日期'; |
|||
} |
|||
if (record.maxDays && text && record.scheduledStartTime) { |
|||
let days = dayjs(text).diff(record.scheduledStartTime, "day") |
|||
if (days > record.maxDays) { |
|||
return '计划时常超过预定期限'; |
|||
} |
|||
} |
|||
return ''; |
|||
}, |
|||
editComponent: 'DatePicker', |
|||
editComponentProps: { |
|||
//日期格式化,页面上显示的值
|
|||
format: 'YYYY-MM-DD', |
|||
//返回值格式化(绑定值的格式)
|
|||
valueFormat: 'YYYY-MM-DD', |
|||
//是否显示今天按钮
|
|||
showToday: true, |
|||
//不可选择日期
|
|||
disabledDate: (currentDate) => { |
|||
let date = dayjs(currentDate).format('YYYY-MM-DD'); |
|||
let nowDate = dayjs(new Date()).format('YYYY-MM-DD'); |
|||
//当天不可选择
|
|||
if (date < nowDate) { |
|||
return true; |
|||
} |
|||
return false; |
|||
} |
|||
} |
|||
}, |
|||
]; |
|||
export const viewPlanDetailColumns: BasicColumn[] = [ |
|||
{ |
|||
title: '计划名称', |
|||
dataIndex: 'taskName', |
|||
width: 150, |
|||
|
|||
}, |
|||
{ |
|||
title: '计划序号', |
|||
dataIndex: 'orderNumber', |
|||
width: 150, |
|||
|
|||
}, |
|||
{ |
|||
title: '最大天数', |
|||
dataIndex: 'maxDays', |
|||
width: 100, |
|||
}, |
|||
{ |
|||
title: '计划开始时间', |
|||
dataIndex: 'scheduledStartTime', |
|||
width: 150, |
|||
}, |
|||
{ |
|||
title: '计划结束时间', |
|||
dataIndex: 'scheduledEndTime', |
|||
width: 150, |
|||
}, |
|||
]; |
|||
|
|||
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 planFormSchemas: 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, |
|||
} |
|||
]; |
@ -0,0 +1,75 @@ |
|||
<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) |
|||
}) |
|||
|
|||
|
|||
|
|||
//项目入库审批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; |
|||
}, |
|||
}, |
|||
}); |
|||
// 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 |
|||
}, |
|||
}, |
|||
}); |
|||
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) |
|||
} |
|||
</script> |
|||
<style></style> |
|||
|
@ -0,0 +1,121 @@ |
|||
<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> |
|||
|
@ -0,0 +1,83 @@ |
|||
<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> |
|||
|
@ -0,0 +1,131 @@ |
|||
<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> |
@ -0,0 +1,23 @@ |
|||
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 }) |
@ -0,0 +1,173 @@ |
|||
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