Commit a3548d31 authored by jiaxu.yan's avatar jiaxu.yan

feat : 完善添加计划页面

parent d280a31d
import { import { ProjectPageParams, ListGetResultModel, ProjectModel } from './model/biddingPlanModel';
ProjectPageParams,
ProjectListGetResultModel,
ProjectModel,
} from './model/biddingPlanModel';
import { defHttp } from '@/utils/http/axios'; import { defHttp } from '@/utils/http/axios';
enum Api { enum Api {
GetList = '/mgapi/project/project/list/page', GetList = '/pro/tendePlan/list/page',
AddProject = '/mgapi/project/projectManage/add', AddProject = '/pro/tendePlan/add',
UpdateProject = '/mgapi/project/projectManage/update', UpdateProject = '/pro/tendePlan/update',
DeleteProject = '/pro/tenderPlan/del',
ProjectDetail = '/pro/tendePlan/details',
} }
export const getListByPage = (params?: ProjectPageParams) => export const getListByPage = (params?: ProjectPageParams) =>
defHttp.post<ProjectListGetResultModel>({ url: Api.GetList, data: params }); defHttp.post<ListGetResultModel>({ url: Api.GetList, data: params });
export const addItem = (params?: any) => export const addItem = (params?: any) =>
defHttp.post<ProjectModel>({ url: Api.AddProject, data: params }); defHttp.post<ProjectModel>({
url: Api.AddProject,
data: params,
headers: {
'Content-Type': 'application/json;charset=UTF-8',
'X-Requested-With': 'XMLHttpRequest',
withCredentials: true,
},
});
export const updateItem = (params?: any) => export const updateItem = (params?: any) =>
defHttp.post<ProjectModel>({ url: Api.UpdateProject, data: params }); defHttp.post<ProjectModel>({
url: Api.UpdateProject,
data: params,
headers: {
'Content-Type': 'application/json;charset=UTF-8',
'X-Requested-With': 'XMLHttpRequest',
withCredentials: true,
},
});
import { BasicPageParams } from '@/api/model/baseModel'; import { BasicPageParams, BasicFetchResult } from '@/api/model/baseModel';
export type ProjectParams = { export type ProjectParams = {
projectName?: string; projectName?: string;
}; };
export type ProjectPageParams = BasicPageParams & ProjectParams; export type ProjectPageParams = BasicPageParams & ProjectParams;
export interface ProjectListItem { export interface ListItem {
id: string; id?: string | number;
projectName: string; proNumber?: string | number;
isReserveProject: string; biddingQuarter?: string | number;
constructionSite: string; tendeYear?: string | number;
constructionMode: string; revieweUser?: string | number;
projectType: string; reviewTime?: string | number;
projectOverview: string; reviewStatus?: string | number;
constructionPurpose: string; createTime?: string | number;
delFlag: string; createBy?: string | number;
constructionScale: string; updatetTime?: string | number;
fundingSource: string; updateBy?: string | number;
implementingEntity: string; companyName?: string | number;
logo: string; delFlag?: string | number;
createTime: null;
createBy: string;
updateTime: null;
updateBy: string;
} }
export interface ProjectModel { export interface ProjectModel {
id?: string | number; id?: string | number;
constructionMode: string; proNumber?: string | number;
isReserveProject: string; biddingQuarter?: any;
projectType: string; tenderYear?: any;
projectOverview: string; tenderPlanPro?: any;
constructionPurpose: string;
} }
export interface planModel {
export type ProjectListGetResultModel = ProjectListItem[]; id?: string | number;
projectInitiator: string | number;
proId: string | number;
investmentAmount: string | number;
biddinType: string | number;
controlPrice: string | number;
plannedPeriod: string | number;
biddingPeriod: string | number;
biddingMethod: string | number;
tendercontent: string | number;
remark: string | number;
}
export type ListGetResultModel = BasicFetchResult<ListItem>;
export type editModel = ProjectModel<planModel>;
<template> <template>
<div class="page-card"> <div class="page-card">
<div class="page-card-title" v-if="title"> {{ title }}</div> <div class="page-card-title" v-if="title">
<div class="title-main"> {{ title }}</div> <div><slot name="right"></slot></div
></div>
<div class="page-card-body"> <div class="page-card-body">
<slot></slot> <slot></slot>
</div> </div>
...@@ -24,8 +26,12 @@ ...@@ -24,8 +26,12 @@
border-bottom: 1px solid #f0f0f0; border-bottom: 1px solid #f0f0f0;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: flex-start; justify-content: space-between;
&::before { .title-main {
display: flex;
align-items: center;
}
.title-main::before {
content: ' '; content: ' ';
display: block; display: block;
width: 4px; width: 4px;
......
...@@ -17,11 +17,11 @@ ...@@ -17,11 +17,11 @@
<span v-else>{{ text }}</span> <span v-else>{{ text }}</span>
</template> </template>
</BasicTable> </BasicTable>
<!-- <button @click="getSelectRowList">获取数据</button>--> <!-- <button @click="getSelectRowList">获取数据</button>-->
</BasicModal> </BasicModal>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { BasicModal } from '@/components/Modal'; import { BasicModal, useModalInner } from '@/components/Modal';
import { BasicTable, useTable, TableAction } from '@/components/Table'; import { BasicTable, useTable, TableAction } from '@/components/Table';
import { getListByPage } from '@/api/project/project'; import { getListByPage } from '@/api/project/project';
import { columns, searchFormSchema } from '@/components/projectlibraryModel/data'; import { columns, searchFormSchema } from '@/components/projectlibraryModel/data';
...@@ -61,8 +61,12 @@ ...@@ -61,8 +61,12 @@
const emit = defineEmits(['close']); const emit = defineEmits(['close']);
function handleVisibleChange(v) {} function handleVisibleChange(v) {}
const [register, { closeModal }] = useModalInner((data) => {
data;
});
function handleSubmit() { function handleSubmit() {
getSelectRowList() getSelectRowList();
closeModal();
} }
</script> </script>
...@@ -120,7 +120,7 @@ ...@@ -120,7 +120,7 @@
console.log(value); console.log(value);
console.log('submit'); console.log('submit');
emit('close', value); emit('close', value);
// closeModal(); closeModal();
}); });
} }
</script> </script>
...@@ -44,17 +44,22 @@ export const columns: BasicColumn[] = [ ...@@ -44,17 +44,22 @@ export const columns: BasicColumn[] = [
export const searchFormSchema: FormSchema[] = [ export const searchFormSchema: FormSchema[] = [
{ {
field: 'projectName', field: 'tenderYear',
label: '', label: '',
component: 'DatePicker', component: 'DatePicker',
componentProps: { componentProps: {
placeholder: '年份', placeholder: '年份',
picker: 'year', picker: 'year',
valueFormat: 'YYYY',
format: 'YYYY',
style: {
width: '100%',
},
}, },
colProps: { span: 4 }, colProps: { span: 4 },
}, },
{ {
field: 'projectName', field: 'biddingQuarter',
label: '', label: '',
component: 'Select', component: 'Select',
componentProps: { componentProps: {
...@@ -81,7 +86,7 @@ export const searchFormSchema: FormSchema[] = [ ...@@ -81,7 +86,7 @@ export const searchFormSchema: FormSchema[] = [
colProps: { span: 4 }, colProps: { span: 4 },
}, },
{ {
field: 'projectName', field: 'companyName',
label: '', label: '',
component: 'Select', component: 'Select',
componentProps: { componentProps: {
...@@ -117,29 +122,29 @@ export const formSchema: FormSchema[] = [ ...@@ -117,29 +122,29 @@ export const formSchema: FormSchema[] = [
required: true, required: true,
component: 'Input', component: 'Input',
componentProps: { componentProps: {
disabled: true, readonly: true,
}, },
colProps: { span: 7, offset: 1 }, colProps: { span: 7, offset: 1 },
}, },
{ {
field: 'projectName', field: 'projectInitiator',
label: '立项主体', label: '立项主体',
required: true, required: true,
component: 'Input', component: 'Input',
colProps: { span: 7, offset: 1 }, colProps: { span: 7, offset: 1 },
}, },
{ {
field: 'projectName', field: 'fundingSource',
label: '资金来源', label: '资金来源',
required: true, required: true,
component: 'Input', component: 'Input',
componentProps: { componentProps: {
disabled: true, readonly: true,
}, },
colProps: { span: 7, offset: 1 }, colProps: { span: 7, offset: 1 },
}, },
{ {
field: 'projectName', field: 'investmentAmount',
label: '立即投资额', label: '立即投资额',
required: true, required: true,
component: 'Input', component: 'Input',
...@@ -149,8 +154,8 @@ export const formSchema: FormSchema[] = [ ...@@ -149,8 +154,8 @@ export const formSchema: FormSchema[] = [
colProps: { span: 7, offset: 1 }, colProps: { span: 7, offset: 1 },
}, },
{ {
field: 'projectName', field: 'biddingType',
label: '投资类型', label: '招标类型',
required: true, required: true,
component: 'Select', component: 'Select',
componentProps: { componentProps: {
...@@ -176,28 +181,36 @@ export const formSchema: FormSchema[] = [ ...@@ -176,28 +181,36 @@ export const formSchema: FormSchema[] = [
colProps: { span: 7, offset: 1 }, colProps: { span: 7, offset: 1 },
}, },
{ {
field: 'projectName', field: 'controlPrice',
label: '预计控制价', label: '预计控制价',
required: true, required: true,
component: 'Input', component: 'Input',
colProps: { span: 7, offset: 1 }, colProps: { span: 7, offset: 1 },
}, },
{ {
field: 'projectName', field: 'plannedPeriod',
label: '计划工期', label: '计划工期',
required: true, required: true,
component: 'RangePicker', component: 'RangePicker',
colProps: { span: 7, offset: 1 }, colProps: { span: 7, offset: 1 },
componentProps: {
valueFormat: 'YYYY-MM-DD',
format: 'YYYY-MM-DD',
},
}, },
{ {
field: 'projectName', field: 'biddingPeriod',
label: '计划招标周期', label: '计划招标周期',
required: true, required: true,
component: 'RangePicker', component: 'RangePicker',
colProps: { span: 7, offset: 1 }, colProps: { span: 7, offset: 1 },
componentProps: {
valueFormat: 'YYYY-MM-DD',
format: 'YYYY-MM-DD',
},
}, },
{ {
field: 'projectName', field: 'biddingMethod',
label: '招标方式', label: '招标方式',
required: true, required: true,
component: 'Select', component: 'Select',
...@@ -229,7 +242,7 @@ export const formSchema: FormSchema[] = [ ...@@ -229,7 +242,7 @@ export const formSchema: FormSchema[] = [
}, },
{ {
label: '招标内容', label: '招标内容',
field: 'constructionPurpose', field: 'tenderContent',
required: true, required: true,
component: 'InputTextArea', component: 'InputTextArea',
componentProps: { componentProps: {
...@@ -240,7 +253,7 @@ export const formSchema: FormSchema[] = [ ...@@ -240,7 +253,7 @@ export const formSchema: FormSchema[] = [
}, },
{ {
label: '备注', label: '备注',
field: 'constructionPurpose', field: 'remark',
required: true, required: true,
component: 'InputTextArea', component: 'InputTextArea',
componentProps: { componentProps: {
......
...@@ -2,29 +2,63 @@ ...@@ -2,29 +2,63 @@
<PageWrapper :title="getTitle" :contentBackground="false" headerSticky> <PageWrapper :title="getTitle" :contentBackground="false" headerSticky>
<template #extra> <template #extra>
<a-button type="primary" danger> 删除 </a-button> <a-button type="primary" danger> 删除 </a-button>
<a-button type="primary" @click="handleSubmit"> 提交 </a-button>
</template> </template>
<PageCard v-for="(item, index) in tabsFormSchema" :key="index" :title="item.name"> <PageCard v-for="(item, index) in tabsFormSchema" :key="index" :title="item.name">
<BasicForm @register="item.Form[0]" /> <template #right>
<a-button
type="text"
preIcon="ant-design:delete-outlined"
danger
@click="deleteItem(index)"
>
</a-button>
</template>
<BasicForm :loading="loading" @register="item.Form[0]" />
</PageCard> </PageCard>
<a-button type="primary" @click="addItem"> 添加 </a-button> <a-button type="dashed" @click="add" preIcon="ei:plus"> 从项目库导入 </a-button>
<a-button type="dashed" @click="handleAdd" class="ml-2" preIcon="ei:plus"> 新建项目 </a-button>
<projectDrawer @register="registerDrawer" @success="handleSuccess" />
<projectlibraryModel @register="register" @close="handleNewData" />
</PageWrapper> </PageWrapper>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { unref, computed, onMounted, ref, reactive } from 'vue'; import { unref, computed, onMounted, ref, reactive } from 'vue';
import projectlibraryModel from '@/components/projectlibraryModel/projectlibraryModel.vue';
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
import { PageWrapper } from '@/components/Page'; import { PageWrapper } from '@/components/Page';
import PageCard from '@/components/Page/src/PageCard.vue'; import PageCard from '@/components/Page/src/PageCard.vue';
import projectDrawer from '@/views/project/projectDrawer.vue';
import { BasicForm, useForm, FormProps, UseFormReturnType } from '@/components/Form'; import { BasicForm, useForm, FormProps, UseFormReturnType } from '@/components/Form';
import { formSchema } from './biddingPlan.data'; import { formSchema } from './biddingPlan.data';
import { deepMerge } from '@/utils';
import { useMessage } from '@/hooks/web/useMessage';
import { useDrawer } from '@/components/Drawer';
import { addItem, updateItem } from '@/api/project/biddingPlan';
import { editModel } from '@/api/project/model/biddingPlanModel';
import { nextTick } from 'vue';
const [registerDrawer, { openDrawer }] = useDrawer();
import { useModal } from '@/components/Modal';
const [register, { openModal: openModal }] = useModal();
const { createMessage } = useMessage();
const getTitle = computed(() => (!unref(isUpdate) ? '新增招标计划' : '编辑招标计划')); const getTitle = computed(() => (!unref(isUpdate) ? '新增招标计划' : '编辑招标计划'));
const isUpdate = ref(false); const isUpdate = ref(false);
const loading = ref(false);
const formData = ref<editModel>({});
onMounted(() => { onMounted(() => {
const route = useRoute(); const route = useRoute();
const id = route.query.id; // 获取名为id的参数 const id = route.query.id; // 获取名为id的参数
console.log(route.query); if (!id) {
formData.value.biddingQuarter = route.query.quarter;
formData.value.tenderYear = route.query.year;
formData.value.tenderPlanPro = [];
isUpdate.value = false;
console.log(formData);
} else {
isUpdate.value = true;
}
}); });
type TabsFormType = { type TabsFormType = {
name: string; name: string;
...@@ -39,16 +73,74 @@ ...@@ -39,16 +73,74 @@
const tabsFormSchema = reactive<TabsFormType[]>([]); const tabsFormSchema = reactive<TabsFormType[]>([]);
async function addItem() { async function add() {
tabsFormSchema.push({ openModal();
}
async function handleNewData(info: any) {
if (info) {
info.map((i) => {
handleNew(i);
});
}
}
/***
*
*/
async function handleNew(info: any) {
const item = {
name: '序号' + (tabsFormSchema.length + 1), name: '序号' + (tabsFormSchema.length + 1),
forceRender: true, forceRender: true,
Form: useForm(Object.assign({ schemas: formSchema }, baseFormConfig) as FormProps), Form: useForm(Object.assign({ schemas: formSchema }, baseFormConfig) as FormProps),
};
const { setFieldsValue } = item.Form[1];
tabsFormSchema.push(item);
formData.value.tenderPlanPro.push({
proId: info.id,
});
nextTick(() => {
setFieldsValue({
projectName: info.projectName,
fundingSource: info.fundingSource,
});
}); });
} }
async function deleteItem(index: any) {
tabsFormSchema.splice(index, 1);
formData.value.tenderPlanPro.splice(index, 1);
}
async function handleAdd() {
openDrawer(true, {
isUpdate: false,
});
}
async function handleSuccess(params: any) {
console.log(params);
}
async function handleSubmit() {
loading.value = true;
try {
for (let i = 0; i < tabsFormSchema.length; i++) {
let item = tabsFormSchema[i];
const { validate, getFieldsValue } = item.Form[1];
await validate();
let res = getFieldsValue();
res.biddingPeriod = res.biddingPeriod.join(',');
res.plannedPeriod = res.plannedPeriod.join(',');
formData.value.tenderPlanPro[i] = deepMerge(formData.value.tenderPlanPro[i], res);
console.log(formData.value.tenderPlanPro);
}
formData.value.proNumber = formData.value.tenderPlanPro.Length;
let res = isUpdate.value ? await updateItem(unref(formData)) : await addItem(unref(formData));
loading.value = false;
console.log(res);
createMessage.success('提交成功!');
} catch (e) {
// 验证失败或出错,切换到对应标签页
console.log(e);
} finally {
loading.value = false;
}
}
</script> </script>
<style lang="less" scoped>
// .vben-page-wrapper-content-bg {
// background-color: transparent;
// }
</style>
...@@ -24,7 +24,7 @@ ...@@ -24,7 +24,7 @@
import { Tabs } from 'ant-design-vue'; import { Tabs } from 'ant-design-vue';
import { PageWrapper } from '@/components/Page'; import { PageWrapper } from '@/components/Page';
import { CollapseContainer } from '@/components/Container'; import { CollapseContainer } from '@/components/Container';
import { useMessage } from '@/hooks/web/useMessage';
import { omit } from 'lodash-es'; import { omit } from 'lodash-es';
import { deepMerge } from '@/utils'; import { deepMerge } from '@/utils';
import { BasicForm, FormSchema, useForm, FormProps, UseFormReturnType } from '@/components/Form'; import { BasicForm, FormSchema, useForm, FormProps, UseFormReturnType } from '@/components/Form';
...@@ -38,7 +38,7 @@ ...@@ -38,7 +38,7 @@
forceRender?: boolean; forceRender?: boolean;
Form: UseFormReturnType; Form: UseFormReturnType;
}; };
import { useMessage } from '@/hooks/web/useMessage';
const { createMessage } = useMessage(); const { createMessage } = useMessage();
const activeKey = ref('tabs2'); const activeKey = ref('tabs2');
const loading = ref(false); const loading = ref(false);
......
...@@ -81,6 +81,7 @@ ...@@ -81,6 +81,7 @@
import { getListByPage, deleteItem, getItem } from '@/api/project/project'; import { getListByPage, deleteItem, getItem } from '@/api/project/project';
import { columns, searchFormSchema } from './project.data'; import { columns, searchFormSchema } from './project.data';
import { Row, Col } from 'ant-design-vue'; import { Row, Col } from 'ant-design-vue';
import projectDrawer from './projectDrawer.vue'; import projectDrawer from './projectDrawer.vue';
import { useDrawer } from '@/components/Drawer'; import { useDrawer } from '@/components/Drawer';
const [registerDrawer, { openDrawer }] = useDrawer(); const [registerDrawer, { openDrawer }] = useDrawer();
......
...@@ -69,7 +69,7 @@ ...@@ -69,7 +69,7 @@
console.log(res); console.log(res);
closeDrawer(); closeDrawer();
emit('success'); emit('success', res);
} finally { } finally {
setDrawerProps({ confirmLoading: false }); setDrawerProps({ confirmLoading: false });
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment