329 lines
8.5 KiB
Vue
329 lines
8.5 KiB
Vue
<!--
|
|
* Copyright (c) 2013-Now https://jeesite.com All rights reserved.
|
|
* No deletion without permission, or be held responsible to law.
|
|
* @author gaoxq
|
|
-->
|
|
<template>
|
|
<div>
|
|
<BasicTable @register="registerTable">
|
|
<template #tableTitle>
|
|
<Icon :icon="getTitle.icon" class="m-1 pr-1" />
|
|
<span> {{ getTitle.value }} </span>
|
|
</template>
|
|
<template #toolbar>
|
|
<a-button type="default" :loading="loading" @click="handleExport()">
|
|
<Icon icon="i-ant-design:download-outlined" /> {{ t('导出') }}
|
|
</a-button>
|
|
<a-button type="primary" @click="handleForm({})" v-auth="'biz:myProjectInfo:edit'">
|
|
<Icon icon="i-fluent:add-12-filled" /> {{ t('新增') }}
|
|
</a-button>
|
|
</template>
|
|
<template #bizScopeKey="{ record, text, value }">
|
|
<a @click="handleForm({ projectId: record.projectId })" :title="value">
|
|
{{ text }}
|
|
</a>
|
|
</template>
|
|
</BasicTable>
|
|
<InputForm @register="registerDrawer" @success="handleSuccess" />
|
|
</div>
|
|
</template>
|
|
<script lang="ts" setup name="ViewsBizMyProjectInfoList">
|
|
import { onMounted, ref, unref } from 'vue';
|
|
import { useI18n } from '@jeesite/core/hooks/web/useI18n';
|
|
import { useMessage } from '@jeesite/core/hooks/web/useMessage';
|
|
import { useGlobSetting } from '@jeesite/core/hooks/setting';
|
|
import { downloadByUrl } from '@jeesite/core/utils/file/download';
|
|
import { router } from '@jeesite/core/router';
|
|
import { Icon } from '@jeesite/core/components/Icon';
|
|
import { BasicTable, BasicColumn, useTable } from '@jeesite/core/components/Table';
|
|
import { MyProjectInfo, myProjectInfoList } from '@jeesite/biz/api/biz/myProjectInfo';
|
|
import { MyAreaSource, MyAreaSourceTreeData } from '@jeesite/biz/api/biz/myAreaSource';
|
|
import { myProjectInfoDelete, myProjectInfoListData } from '@jeesite/biz/api/biz/myProjectInfo';
|
|
import { useDrawer } from '@jeesite/core/components/Drawer';
|
|
import { useModal } from '@jeesite/core/components/Modal';
|
|
import { FormProps } from '@jeesite/core/components/Form';
|
|
import InputForm from './form.vue';
|
|
|
|
const { t } = useI18n('biz.myProjectInfo');
|
|
const { showMessage } = useMessage();
|
|
const { meta } = unref(router.currentRoute);
|
|
const record = ref<MyProjectInfo>({} as MyProjectInfo);
|
|
|
|
const areaListParams = ref<Recordable>({ areaLevel: '1' });
|
|
|
|
const getTitle = {
|
|
icon: meta.icon || 'i-ant-design:book-outlined',
|
|
value: meta.title || t('项目管理'),
|
|
};
|
|
const loading = ref(false);
|
|
|
|
const searchForm: FormProps<MyProjectInfo> = {
|
|
baseColProps: { md: 8, lg: 6 },
|
|
labelWidth: 90,
|
|
schemas: [
|
|
{
|
|
label: t('记录时间起'),
|
|
field: 'createTime_gte',
|
|
component: 'DatePicker',
|
|
componentProps: {
|
|
format: 'YYYY-MM-DD HH:mm',
|
|
showTime: { format: 'HH:mm' },
|
|
},
|
|
},
|
|
{
|
|
label: t('记录时间止'),
|
|
field: 'createTime_lte',
|
|
component: 'DatePicker',
|
|
componentProps: {
|
|
format: 'YYYY-MM-DD HH:mm',
|
|
showTime: { format: 'HH:mm' },
|
|
},
|
|
},
|
|
{
|
|
label: t('项目名称'),
|
|
field: 'projectName',
|
|
component: 'Input',
|
|
},
|
|
{
|
|
label: t('责任人员'),
|
|
field: 'personId',
|
|
fieldLabel: 'personName',
|
|
component: 'ListSelect',
|
|
componentProps: {
|
|
selectType: 'bizPersonSelect',
|
|
},
|
|
},
|
|
{
|
|
label: t('区域级别'),
|
|
field: 'areaLevel',
|
|
component: 'Select',
|
|
componentProps: {
|
|
dictType: 'area_level',
|
|
allowClear: true,
|
|
onChange: (value: string) => {
|
|
areaListParams.value.areaLevel = value;
|
|
},
|
|
},
|
|
},
|
|
{
|
|
label: t('区域名称'),
|
|
field: 'areaId',
|
|
fieldLabel: 'areaName',
|
|
component: 'TreeSelect',
|
|
componentProps: {
|
|
api: MyAreaSourceTreeData,
|
|
params: areaListParams.value,
|
|
allowClear: true,
|
|
},
|
|
},
|
|
{
|
|
label: t('项目状态'),
|
|
field: 'projectStatus',
|
|
component: 'Select',
|
|
componentProps: {
|
|
dictType: 'project_status',
|
|
allowClear: true,
|
|
},
|
|
},
|
|
],
|
|
};
|
|
|
|
const tableColumns: BasicColumn<MyProjectInfo>[] = [
|
|
{
|
|
title: t('记录时间'),
|
|
dataIndex: 'createTime',
|
|
key: 'a.create_time',
|
|
sorter: true,
|
|
width: 150,
|
|
align: 'center',
|
|
fixed: 'left',
|
|
},
|
|
{
|
|
title: t('项目编码'),
|
|
dataIndex: 'projectCode',
|
|
key: 'a.project_code',
|
|
sorter: true,
|
|
width: 130,
|
|
align: 'left',
|
|
},
|
|
{
|
|
title: t('项目名称'),
|
|
dataIndex: 'projectName',
|
|
key: 'a.project_name',
|
|
sorter: true,
|
|
width: 225,
|
|
align: 'left',
|
|
slot: 'bizScopeKey',
|
|
},
|
|
{
|
|
title: t('区域级别'),
|
|
dataIndex: 'areaLevel',
|
|
key: 'a.area_level',
|
|
sorter: true,
|
|
width: 130,
|
|
align: 'left',
|
|
dictType: 'area_level',
|
|
},
|
|
{
|
|
title: t('区域名称'),
|
|
dataIndex: 'areaName',
|
|
key: 'b.area_name',
|
|
sorter: true,
|
|
width: 130,
|
|
align: 'left',
|
|
},
|
|
{
|
|
title: t('区域全称'),
|
|
dataIndex: 'treeName',
|
|
key: 'b.tree_name',
|
|
sorter: true,
|
|
width: 200,
|
|
align: 'left',
|
|
},
|
|
{
|
|
title: t('责任人员'),
|
|
dataIndex: 'personName',
|
|
key: 'c.person_name',
|
|
sorter: true,
|
|
width: 130,
|
|
align: 'left',
|
|
},
|
|
{
|
|
title: t('预计开始日期'),
|
|
dataIndex: 'startDate',
|
|
key: 'a.start_date',
|
|
sorter: true,
|
|
width: 150,
|
|
align: 'center',
|
|
},
|
|
{
|
|
title: t('预计结束日期'),
|
|
dataIndex: 'endDate',
|
|
key: 'a.end_date',
|
|
sorter: true,
|
|
width: 150,
|
|
align: 'center',
|
|
},
|
|
{
|
|
title: t('实际结束日期'),
|
|
dataIndex: 'actualEndDate',
|
|
key: 'a.actual_end_date',
|
|
sorter: true,
|
|
width: 150,
|
|
align: 'center',
|
|
},
|
|
{
|
|
title: t('项目预算(元)'),
|
|
dataIndex: 'budget',
|
|
key: 'a.budget',
|
|
sorter: true,
|
|
width: 130,
|
|
align: 'right',
|
|
},
|
|
{
|
|
title: t('项目类型'),
|
|
dataIndex: 'projectType',
|
|
key: 'a.project_type',
|
|
sorter: true,
|
|
width: 130,
|
|
align: 'left',
|
|
dictType: 'project_type',
|
|
},
|
|
{
|
|
title: t('项目级别'),
|
|
dataIndex: 'priority',
|
|
key: 'a.priority',
|
|
sorter: true,
|
|
width: 130,
|
|
align: 'left',
|
|
dictType: 'biz_priority',
|
|
},
|
|
{
|
|
title: t('项目状态'),
|
|
dataIndex: 'projectStatus',
|
|
key: 'a.project_status',
|
|
sorter: true,
|
|
width: 130,
|
|
align: 'left',
|
|
dictType: 'project_status',
|
|
},
|
|
{
|
|
title: t('更新时间'),
|
|
dataIndex: 'updateTime',
|
|
key: 'a.update_time',
|
|
sorter: true,
|
|
width: 150,
|
|
align: 'center',
|
|
},
|
|
];
|
|
|
|
const actionColumn: BasicColumn<MyProjectInfo> = {
|
|
width: 160,
|
|
align: 'center',
|
|
actions: (record: MyProjectInfo) => [
|
|
{
|
|
icon: 'i-clarity:note-edit-line',
|
|
title: t('编辑'),
|
|
onClick: handleForm.bind(this, { projectId: record.projectId }),
|
|
auth: 'biz:myProjectInfo:edit',
|
|
},
|
|
{
|
|
icon: 'i-ant-design:delete-outlined',
|
|
color: 'error',
|
|
title: t('删除'),
|
|
popConfirm: {
|
|
title: t('是否确认删除项目?'),
|
|
confirm: handleDelete.bind(this, record),
|
|
},
|
|
auth: 'biz:myProjectInfo:edit',
|
|
},
|
|
],
|
|
};
|
|
|
|
const [registerTable, { reload, getForm }] = useTable<MyProjectInfo>({
|
|
api: myProjectInfoListData,
|
|
beforeFetch: (params) => {
|
|
return params;
|
|
},
|
|
columns: tableColumns,
|
|
actionColumn: actionColumn,
|
|
formConfig: searchForm,
|
|
showTableSetting: true,
|
|
useSearchForm: true,
|
|
canResize: true,
|
|
});
|
|
|
|
onMounted(async () => {
|
|
const res = await myProjectInfoList();
|
|
record.value = (res.myProjectInfo || {}) as MyProjectInfo;
|
|
await getForm().setFieldsValue(record.value);
|
|
});
|
|
|
|
const [registerDrawer, { openDrawer }] = useDrawer();
|
|
|
|
function handleForm(record: Recordable) {
|
|
openDrawer(true, record);
|
|
}
|
|
|
|
async function handleExport() {
|
|
loading.value = true;
|
|
const { ctxAdminPath } = useGlobSetting();
|
|
await downloadByUrl({
|
|
url: ctxAdminPath + '/biz/myProjectInfo/exportData',
|
|
params: getForm().getFieldsValue(),
|
|
});
|
|
loading.value = false;
|
|
}
|
|
|
|
async function handleDelete(record: Recordable) {
|
|
const params = { projectId: record.projectId };
|
|
const res = await myProjectInfoDelete(params);
|
|
showMessage(res.message);
|
|
await handleSuccess(record);
|
|
}
|
|
|
|
async function handleSuccess(record: Recordable) {
|
|
await reload({ record });
|
|
}
|
|
</script>
|