代码生成

This commit is contained in:
‘huanghaiixia’
2026-03-03 17:48:45 +08:00
parent 207f8cc311
commit 90fd1c6f98
42 changed files with 9399 additions and 0 deletions

View File

@ -0,0 +1,90 @@
import { LngPricePurPngAppPageModel, LngPricePurPngAppPageParams, LngPricePurPngAppPageResult } from './model/PricePurPngAppModel';
import { defHttp } from '/@/utils/http/axios';
import { ErrorMessageMode } from '/#/axios';
enum Api {
Page = '/price/pricePurPngApp/page',
List = '/price/pricePurPngApp/list',
Info = '/price/pricePurPngApp/info',
LngPricePurPngApp = '/price/pricePurPngApp',
DataLog = '/price/pricePurPngApp/datalog',
}
/**
* @description: 查询LngPricePurPngApp分页列表
*/
export async function getLngPricePurPngAppPage(params: LngPricePurPngAppPageParams, mode: ErrorMessageMode = 'modal') {
return defHttp.get<LngPricePurPngAppPageResult>(
{
url: Api.Page,
params,
},
{
errorMessageMode: mode,
},
);
}
/**
* @description: 获取LngPricePurPngApp信息
*/
export async function getLngPricePurPngApp(id: String, mode: ErrorMessageMode = 'modal') {
return defHttp.get<LngPricePurPngAppPageModel>(
{
url: Api.Info,
params: { id },
},
{
errorMessageMode: mode,
},
);
}
/**
* @description: 新增LngPricePurPngApp
*/
export async function addLngPricePurPngApp(lngPricePurPngApp: Recordable, mode: ErrorMessageMode = 'modal') {
return defHttp.post<boolean>(
{
url: Api.LngPricePurPngApp,
params: lngPricePurPngApp,
},
{
errorMessageMode: mode,
},
);
}
/**
* @description: 更新LngPricePurPngApp
*/
export async function updateLngPricePurPngApp(lngPricePurPngApp: Recordable, mode: ErrorMessageMode = 'modal') {
return defHttp.put<boolean>(
{
url: Api.LngPricePurPngApp,
params: lngPricePurPngApp,
},
{
errorMessageMode: mode,
},
);
}
/**
* @description: 删除LngPricePurPngApp批量删除
*/
export async function deleteLngPricePurPngApp(ids: string[], mode: ErrorMessageMode = 'modal') {
return defHttp.delete<boolean>(
{
url: Api.LngPricePurPngApp,
data: ids,
},
{
errorMessageMode: mode,
},
);
}

View File

@ -0,0 +1,165 @@
import { BasicPageParams, BasicFetchResult } from '/@/api/model/baseModel';
/**
* @description: LngPricePurPngApp分页参数 模型
*/
export interface LngPricePurPngAppPageParams extends BasicPageParams {
id: string;
appName: string;
priceTypeCode: string;
comId: string;
priceDesc: string;
approCode: string;
}
/**
* @description: LngPricePurPngApp分页返回值模型
*/
export interface LngPricePurPngAppPageModel {
id: string;
appName: string;
priceTypeCode: string;
comId: string;
priceDesc: string;
approCode: string;
}
/**
* @description: LngPricePurPngApp表类型
*/
export interface LngPricePurPngAppModel {
id: number;
comId: number;
appName: string;
priceTypeCode: string;
priceDesc: string;
dateSubmit: string;
approCode: string;
timeAppro: string;
note: string;
createUserId: number;
createDate: string;
modifyUserId: number;
modifyDate: string;
tenantId: number;
deptId: number;
ruleUserId: number;
lngPricePurPngAppSuList?: LngPricePurPngAppSuModel;
lngPricePurPngAppSuDtlList?: LngPricePurPngAppSuDtlModel;
}
/**
* @description: LngPricePurPngAppSu表类型
*/
export interface LngPricePurPngAppSuModel {
id: number;
pppaId: number;
suCode: string;
kId: number;
kpppId: number;
pointUpCode: string;
kpppsId: number;
pointDelyCode: string;
transSign: string;
uomCode: string;
dateFrom: string;
priceDesc: string;
note: string;
createUserId: number;
createDate: string;
modifyUserId: number;
modifyDate: string;
tenantId: number;
deptId: number;
ruleUserId: number;
}
/**
* @description: LngPricePurPngAppSuDtl表类型
*/
export interface LngPricePurPngAppSuDtlModel {
id: number;
pppasId: number;
priceCode: string;
sort: number;
rateM3Gj: number;
rateQtyGj: number;
rateQtyM3: number;
priceGj: number;
priceM3: number;
note: string;
createUserId: number;
createDate: string;
modifyUserId: number;
modifyDate: string;
tenantId: number;
deptId: number;
ruleUserId: number;
}
/**
* @description: LngPricePurPngApp分页返回值结构
*/
export type LngPricePurPngAppPageResult = BasicFetchResult<LngPricePurPngAppPageModel>;

View File

@ -0,0 +1,90 @@
import { LngPriceSalesPngAppPageModel, LngPriceSalesPngAppPageParams, LngPriceSalesPngAppPageResult } from './model/PriceSalesPngAppModel';
import { defHttp } from '/@/utils/http/axios';
import { ErrorMessageMode } from '/#/axios';
enum Api {
Page = '/price/priceSalesPngApp/page',
List = '/price/priceSalesPngApp/list',
Info = '/price/priceSalesPngApp/info',
LngPriceSalesPngApp = '/price/priceSalesPngApp',
DataLog = '/price/priceSalesPngApp/datalog',
}
/**
* @description: 查询LngPriceSalesPngApp分页列表
*/
export async function getLngPriceSalesPngAppPage(params: LngPriceSalesPngAppPageParams, mode: ErrorMessageMode = 'modal') {
return defHttp.get<LngPriceSalesPngAppPageResult>(
{
url: Api.Page,
params,
},
{
errorMessageMode: mode,
},
);
}
/**
* @description: 获取LngPriceSalesPngApp信息
*/
export async function getLngPriceSalesPngApp(id: String, mode: ErrorMessageMode = 'modal') {
return defHttp.get<LngPriceSalesPngAppPageModel>(
{
url: Api.Info,
params: { id },
},
{
errorMessageMode: mode,
},
);
}
/**
* @description: 新增LngPriceSalesPngApp
*/
export async function addLngPriceSalesPngApp(lngPriceSalesPngApp: Recordable, mode: ErrorMessageMode = 'modal') {
return defHttp.post<boolean>(
{
url: Api.LngPriceSalesPngApp,
params: lngPriceSalesPngApp,
},
{
errorMessageMode: mode,
},
);
}
/**
* @description: 更新LngPriceSalesPngApp
*/
export async function updateLngPriceSalesPngApp(lngPriceSalesPngApp: Recordable, mode: ErrorMessageMode = 'modal') {
return defHttp.put<boolean>(
{
url: Api.LngPriceSalesPngApp,
params: lngPriceSalesPngApp,
},
{
errorMessageMode: mode,
},
);
}
/**
* @description: 删除LngPriceSalesPngApp批量删除
*/
export async function deleteLngPriceSalesPngApp(ids: string[], mode: ErrorMessageMode = 'modal') {
return defHttp.delete<boolean>(
{
url: Api.LngPriceSalesPngApp,
data: ids,
},
{
errorMessageMode: mode,
},
);
}

View File

@ -0,0 +1,159 @@
import { BasicPageParams, BasicFetchResult } from '/@/api/model/baseModel';
/**
* @description: LngPriceSalesPngApp分页参数 模型
*/
export interface LngPriceSalesPngAppPageParams extends BasicPageParams {
id: string;
appName: string;
priceTypeCode: string;
priceDesc: string;
comId: string;
approCode: string;
}
/**
* @description: LngPriceSalesPngApp分页返回值模型
*/
export interface LngPriceSalesPngAppPageModel {
id: string;
appName: string;
priceTypeCode: string;
priceDesc: string;
comId: string;
approCode: string;
}
/**
* @description: LngPriceSalesPngApp表类型
*/
export interface LngPriceSalesPngAppModel {
id: number;
comId: number;
appName: string;
priceTypeCode: string;
priceDesc: string;
dateSubmit: string;
approCode: string;
timeAppro: string;
note: string;
createUserId: number;
createDate: string;
modifyUserId: number;
modifyDate: string;
tenantId: number;
deptId: number;
ruleUserId: number;
lngPriceSalesPngAppCuList?: LngPriceSalesPngAppCuModel;
lngPriceSalesPngAppCuDtlList?: LngPriceSalesPngAppCuDtlModel;
}
/**
* @description: LngPriceSalesPngAppCu表类型
*/
export interface LngPriceSalesPngAppCuModel {
id: number;
pspaId: number;
cuCode: string;
kId: number;
ksppId: number;
pointDelyCode: string;
uomCode: string;
dateFrom: string;
priceDesc: string;
note: string;
createUserId: number;
createDate: string;
modifyUserId: number;
modifyDate: string;
tenantId: number;
deptId: number;
ruleUserId: number;
}
/**
* @description: LngPriceSalesPngAppCuDtl表类型
*/
export interface LngPriceSalesPngAppCuDtlModel {
id: number;
pspacId: number;
priceCode: string;
sort: number;
rateM3Gj: number;
rateQtyGj: number;
rateQtyM3: number;
priceGj: number;
priceM3: number;
note: string;
createUserId: number;
createDate: string;
modifyUserId: number;
modifyDate: string;
tenantId: number;
deptId: number;
ruleUserId: number;
}
/**
* @description: LngPriceSalesPngApp分页返回值结构
*/
export type LngPriceSalesPngAppPageResult = BasicFetchResult<LngPriceSalesPngAppPageModel>;

View File

@ -0,0 +1,89 @@
import { LngMeaPurIntPageModel, LngMeaPurIntPageParams, LngMeaPurIntPageResult } from './model/MeaPurIntModel';
import { defHttp } from '/@/utils/http/axios';
import { ErrorMessageMode } from '/#/axios';
enum Api {
Page = '/ship/meaPurInt/page',
List = '/ship/meaPurInt/list',
Info = '/ship/meaPurInt/info',
LngMeaPurInt = '/ship/meaPurInt',
}
/**
* @description: 查询LngMeaPurInt分页列表
*/
export async function getLngMeaPurIntPage(params: LngMeaPurIntPageParams, mode: ErrorMessageMode = 'modal') {
return defHttp.get<LngMeaPurIntPageResult>(
{
url: Api.Page,
params,
},
{
errorMessageMode: mode,
},
);
}
/**
* @description: 获取LngMeaPurInt信息
*/
export async function getLngMeaPurInt(id: String, mode: ErrorMessageMode = 'modal') {
return defHttp.get<LngMeaPurIntPageModel>(
{
url: Api.Info,
params: { id },
},
{
errorMessageMode: mode,
},
);
}
/**
* @description: 新增LngMeaPurInt
*/
export async function addLngMeaPurInt(lngMeaPurInt: Recordable, mode: ErrorMessageMode = 'modal') {
return defHttp.post<boolean>(
{
url: Api.LngMeaPurInt,
params: lngMeaPurInt,
},
{
errorMessageMode: mode,
},
);
}
/**
* @description: 更新LngMeaPurInt
*/
export async function updateLngMeaPurInt(lngMeaPurInt: Recordable, mode: ErrorMessageMode = 'modal') {
return defHttp.put<boolean>(
{
url: Api.LngMeaPurInt,
params: lngMeaPurInt,
},
{
errorMessageMode: mode,
},
);
}
/**
* @description: 删除LngMeaPurInt批量删除
*/
export async function deleteLngMeaPurInt(ids: string[], mode: ErrorMessageMode = 'modal') {
return defHttp.delete<boolean>(
{
url: Api.LngMeaPurInt,
data: ids,
},
{
errorMessageMode: mode,
},
);
}

View File

@ -0,0 +1,74 @@
import { BasicPageParams, BasicFetchResult } from '/@/api/model/baseModel';
/**
* @description: LngMeaPurInt分页参数 模型
*/
export interface LngMeaPurIntPageParams extends BasicPageParams {
dateMea: string;
typeCode: string;
inspName: string;
id: string;
qtyMmbtu: string;
qtyGj: string;
qtyTon: string;
qtyM3L: string;
qtyM3: string;
rateTonM3L: string;
rateTonGj: string;
rateM3Gj: string;
rateTonM3: string;
note: string;
}
/**
* @description: LngMeaPurInt分页返回值模型
*/
export interface LngMeaPurIntPageModel {
id: string;
dateMea: string;
typeCode: string;
qtyMmbtu: string;
qtyGj: string;
qtyTon: string;
qtyM3L: string;
qtyM3: string;
rateTonM3L: string;
rateTonGj: string;
rateM3Gj: string;
rateTonM3: string;
inspName: string;
note: string;
}
0;
/**
* @description: LngMeaPurInt分页返回值结构
*/
export type LngMeaPurIntPageResult = BasicFetchResult<LngMeaPurIntPageModel>;

View File

@ -0,0 +1,90 @@
import { LngOpsPurIntPageModel, LngOpsPurIntPageParams, LngOpsPurIntPageResult } from './model/OpsPurIntModel';
import { defHttp } from '/@/utils/http/axios';
import { ErrorMessageMode } from '/#/axios';
enum Api {
Page = '/ship/opsPurInt/page',
List = '/ship/opsPurInt/list',
Info = '/ship/opsPurInt/info',
LngOpsPurInt = '/ship/opsPurInt',
DataLog = '/ship/opsPurInt/datalog',
}
/**
* @description: 查询LngOpsPurInt分页列表
*/
export async function getLngOpsPurIntPage(params: LngOpsPurIntPageParams, mode: ErrorMessageMode = 'modal') {
return defHttp.get<LngOpsPurIntPageResult>(
{
url: Api.Page,
params,
},
{
errorMessageMode: mode,
},
);
}
/**
* @description: 获取LngOpsPurInt信息
*/
export async function getLngOpsPurInt(id: String, mode: ErrorMessageMode = 'modal') {
return defHttp.get<LngOpsPurIntPageModel>(
{
url: Api.Info,
params: { id },
},
{
errorMessageMode: mode,
},
);
}
/**
* @description: 新增LngOpsPurInt
*/
export async function addLngOpsPurInt(lngOpsPurInt: Recordable, mode: ErrorMessageMode = 'modal') {
return defHttp.post<boolean>(
{
url: Api.LngOpsPurInt,
params: lngOpsPurInt,
},
{
errorMessageMode: mode,
},
);
}
/**
* @description: 更新LngOpsPurInt
*/
export async function updateLngOpsPurInt(lngOpsPurInt: Recordable, mode: ErrorMessageMode = 'modal') {
return defHttp.put<boolean>(
{
url: Api.LngOpsPurInt,
params: lngOpsPurInt,
},
{
errorMessageMode: mode,
},
);
}
/**
* @description: 删除LngOpsPurInt批量删除
*/
export async function deleteLngOpsPurInt(ids: string[], mode: ErrorMessageMode = 'modal') {
return defHttp.delete<boolean>(
{
url: Api.LngOpsPurInt,
data: ids,
},
{
errorMessageMode: mode,
},
);
}

View File

@ -0,0 +1,54 @@
import { BasicPageParams, BasicFetchResult } from '/@/api/model/baseModel';
/**
* @description: LngOpsPurInt分页参数 模型
*/
export interface LngOpsPurIntPageParams extends BasicPageParams {
id: string;
ssNo: string;
kId: string;
longSpotCode: string;
comId: string;
dateEta: string;
staCode: string;
suName: string;
ssTypeCode: string;
}
/**
* @description: LngOpsPurInt分页返回值模型
*/
export interface LngOpsPurIntPageModel {
id: string;
ssNo: string;
kId: string;
longSpotCode: string;
comId: string;
dateEta: string;
staCode: string;
suName: string;
ssTypeCode: string;
}
0;
/**
* @description: LngOpsPurInt分页返回值结构
*/
export type LngOpsPurIntPageResult = BasicFetchResult<LngOpsPurIntPageModel>;

View File

@ -0,0 +1,90 @@
import { LngOpsSalesIntPageModel, LngOpsSalesIntPageParams, LngOpsSalesIntPageResult } from './model/OpsSalesIntModel';
import { defHttp } from '/@/utils/http/axios';
import { ErrorMessageMode } from '/#/axios';
enum Api {
Page = '/ship/opsSalesInt/page',
List = '/ship/opsSalesInt/list',
Info = '/ship/opsSalesInt/info',
LngOpsSalesInt = '/ship/opsSalesInt',
DataLog = '/ship/opsSalesInt/datalog',
}
/**
* @description: 查询LngOpsSalesInt分页列表
*/
export async function getLngOpsSalesIntPage(params: LngOpsSalesIntPageParams, mode: ErrorMessageMode = 'modal') {
return defHttp.get<LngOpsSalesIntPageResult>(
{
url: Api.Page,
params,
},
{
errorMessageMode: mode,
},
);
}
/**
* @description: 获取LngOpsSalesInt信息
*/
export async function getLngOpsSalesInt(id: String, mode: ErrorMessageMode = 'modal') {
return defHttp.get<LngOpsSalesIntPageModel>(
{
url: Api.Info,
params: { id },
},
{
errorMessageMode: mode,
},
);
}
/**
* @description: 新增LngOpsSalesInt
*/
export async function addLngOpsSalesInt(lngOpsSalesInt: Recordable, mode: ErrorMessageMode = 'modal') {
return defHttp.post<boolean>(
{
url: Api.LngOpsSalesInt,
params: lngOpsSalesInt,
},
{
errorMessageMode: mode,
},
);
}
/**
* @description: 更新LngOpsSalesInt
*/
export async function updateLngOpsSalesInt(lngOpsSalesInt: Recordable, mode: ErrorMessageMode = 'modal') {
return defHttp.put<boolean>(
{
url: Api.LngOpsSalesInt,
params: lngOpsSalesInt,
},
{
errorMessageMode: mode,
},
);
}
/**
* @description: 删除LngOpsSalesInt批量删除
*/
export async function deleteLngOpsSalesInt(ids: string[], mode: ErrorMessageMode = 'modal') {
return defHttp.delete<boolean>(
{
url: Api.LngOpsSalesInt,
data: ids,
},
{
errorMessageMode: mode,
},
);
}

View File

@ -0,0 +1,50 @@
import { BasicPageParams, BasicFetchResult } from '/@/api/model/baseModel';
/**
* @description: LngOpsSalesInt分页参数 模型
*/
export interface LngOpsSalesIntPageParams extends BasicPageParams {
id: string;
ssNo: string;
kId: string;
longSpotCode: string;
comId: string;
dateEta: string;
portUnloading1Code: string;
cuName: string;
}
/**
* @description: LngOpsSalesInt分页返回值模型
*/
export interface LngOpsSalesIntPageModel {
id: string;
ssNo: string;
kId: string;
longSpotCode: string;
comId: string;
dateEta: string;
portUnloading1Code: string;
cuName: string;
}
0;
/**
* @description: LngOpsSalesInt分页返回值结构
*/
export type LngOpsSalesIntPageResult = BasicFetchResult<LngOpsSalesIntPageModel>;

View File

@ -0,0 +1,90 @@
import { LngShipSchedulePageModel, LngShipSchedulePageParams, LngShipSchedulePageResult } from './model/ShipScheduleModel';
import { defHttp } from '/@/utils/http/axios';
import { ErrorMessageMode } from '/#/axios';
enum Api {
Page = '/ship/shipSchedule/page',
List = '/ship/shipSchedule/list',
Info = '/ship/shipSchedule/info',
LngShipSchedule = '/ship/shipSchedule',
DataLog = '/ship/shipSchedule/datalog',
}
/**
* @description: 查询LngShipSchedule分页列表
*/
export async function getLngShipSchedulePage(params: LngShipSchedulePageParams, mode: ErrorMessageMode = 'modal') {
return defHttp.get<LngShipSchedulePageResult>(
{
url: Api.Page,
params,
},
{
errorMessageMode: mode,
},
);
}
/**
* @description: 获取LngShipSchedule信息
*/
export async function getLngShipSchedule(id: String, mode: ErrorMessageMode = 'modal') {
return defHttp.get<LngShipSchedulePageModel>(
{
url: Api.Info,
params: { id },
},
{
errorMessageMode: mode,
},
);
}
/**
* @description: 新增LngShipSchedule
*/
export async function addLngShipSchedule(lngShipSchedule: Recordable, mode: ErrorMessageMode = 'modal') {
return defHttp.post<boolean>(
{
url: Api.LngShipSchedule,
params: lngShipSchedule,
},
{
errorMessageMode: mode,
},
);
}
/**
* @description: 更新LngShipSchedule
*/
export async function updateLngShipSchedule(lngShipSchedule: Recordable, mode: ErrorMessageMode = 'modal') {
return defHttp.put<boolean>(
{
url: Api.LngShipSchedule,
params: lngShipSchedule,
},
{
errorMessageMode: mode,
},
);
}
/**
* @description: 删除LngShipSchedule批量删除
*/
export async function deleteLngShipSchedule(ids: string[], mode: ErrorMessageMode = 'modal') {
return defHttp.delete<boolean>(
{
url: Api.LngShipSchedule,
data: ids,
},
{
errorMessageMode: mode,
},
);
}

View File

@ -0,0 +1,62 @@
import { BasicPageParams, BasicFetchResult } from '/@/api/model/baseModel';
/**
* @description: LngShipSchedule分页参数 模型
*/
export interface LngShipSchedulePageParams extends BasicPageParams {
id: string;
ssNo: string;
kId: string;
longSpotCode: string;
comId: string;
dateEta: string;
staCode: string;
suName: string;
ssTypeCode: string;
opsPurId: string;
opsSalesId: string;
}
/**
* @description: LngShipSchedule分页返回值模型
*/
export interface LngShipSchedulePageModel {
id: string;
ssNo: string;
kId: string;
longSpotCode: string;
comId: string;
dateEta: string;
staCode: string;
suName: string;
ssTypeCode: string;
opsPurId: string;
opsSalesId: string;
}
0;
/**
* @description: LngShipSchedule分页返回值结构
*/
export type LngShipSchedulePageResult = BasicFetchResult<LngShipSchedulePageModel>;

View File

@ -0,0 +1,224 @@
<template>
<SimpleForm
ref="systemFormRef"
:formProps="data.formDataProps"
:formModel="{}"
:isWorkFlow="props.fromPage!=FromPageType.MENU"
/>
</template>
<script lang="ts" setup>
import { reactive, ref,onBeforeMount,onMounted } from 'vue';
import { formProps, formEventConfigs ,formConfig} from './config';
import SimpleForm from '/@/components/SimpleForm/src/SimpleForm.vue';
import { addLngPricePurPngApp, getLngPricePurPngApp, updateLngPricePurPngApp, deleteLngPricePurPngApp } from '/@/api/price/PricePurPngApp';
import { cloneDeep } from 'lodash-es';
import { FormDataProps } from '/@/components/Designer/src/types';
import { usePermission } from '/@/hooks/web/usePermission';
import { useFormConfig } from '/@/hooks/web/useFormConfig';
import { FromPageType } from '/@/enums/workflowEnum';
import { createFormEvent, getFormDataEvent, loadFormEvent, submitFormEvent,} from '/@/hooks/web/useFormEvent';
import { changeWorkFlowForm, changeSchemaDisabled } from '/@/hooks/web/useWorkFlowForm';
import { WorkFlowFormParams } from '/@/model/workflow/bpmnConfig';
import { useRouter } from 'vue-router';
const { filterFormSchemaAuth } = usePermission();
const { mergeFormSchemas,mergeFormEventConfigs } = useFormConfig();
const { currentRoute } = useRouter();
const RowKey = 'id';
const emits = defineEmits(['changeUploadComponentIds','loadingCompleted', 'form-mounted']);
const props = defineProps({
fromPage: {
type: Number,
default: FromPageType.MENU,
},
});
const systemFormRef = ref();
const data: { formDataProps: FormDataProps } = reactive({
formDataProps: {schemas:[]} as FormDataProps,
});
const state = reactive({
formModel: {},
});
let customFormEventConfigs=[];
onMounted(async () => {
try {
// 合并渲染覆盖配置中的字段配置、表单事件配置
await mergeCustomFormRenderConfig();
if (props.fromPage == FromPageType.MENU) {
setMenuPermission();
await createFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:初始化表单
await loadFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:加载表单
} else if (props.fromPage == FromPageType.FLOW) {
emits('loadingCompleted'); //告诉系统表单已经加载完毕
// loadingCompleted后 工作流页面直接利用Ref调用setWorkFlowForm方法
} else if (props.fromPage == FromPageType.PREVIEW) {
// 预览 无需权限,表单事件也无需执行
} else if (props.fromPage == FromPageType.DESKTOP) {
// 桌面设计 表单事件需要执行
emits('loadingCompleted'); //告诉系统表单已经加载完毕
await createFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:初始化表单
await loadFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:加载表单
}
emits('form-mounted', formProps);
} catch (error) {
}
});
async function mergeCustomFormRenderConfig() {
let cloneProps=cloneDeep(formProps);
let fEventConfigs=cloneDeep(formEventConfigs);
if (formConfig.useCustomConfig) {
if(props.fromPage !== FromPageType.FLOW){
let formPath=currentRoute.value.query.formPath;
//1.合并字段配置
cloneProps.schemas=await mergeFormSchemas({formSchema:cloneProps.schemas!,formPath:formPath});
//2.合并表单事件配置
fEventConfigs=await mergeFormEventConfigs({formEventConfigs:fEventConfigs,formPath:formPath});
}
}
data.formDataProps=cloneProps;
customFormEventConfigs=fEventConfigs;
}
// 根据菜单页面权限,设置表单属性(必填,禁用,显示)
function setMenuPermission() {
data.formDataProps.schemas = filterFormSchemaAuth(data.formDataProps.schemas!);
}
// 校验form 通过返回表单数据
async function validate() {
let values = [];
try {
values = await systemFormRef.value?.validate();
//添加隐藏组件
if (data.formDataProps.hiddenComponent?.length) {
data.formDataProps.hiddenComponent.forEach((component) => {
values[component.bindField] = component.value;
});
}
} finally {
}
return values;
}
// 根据行唯一ID查询行数据并设置表单数据 【编辑】
async function setFormDataFromId(rowId, skipUpdate) {
try {
const record = await getLngPricePurPngApp(rowId);
if (skipUpdate) {
return record;
}
setFieldsValue(record);
state.formModel = record;
await getFormDataEvent(customFormEventConfigs, state.formModel, systemFormRef.value, formProps.schemas); //表单事件:获取表单数据
return record;
} catch (error) {
}
}
// 辅助设置表单数据
function setFieldsValue(record) {
systemFormRef.value.setFieldsValue(record);
}
// 重置表单数据
async function resetFields() {
await systemFormRef.value.resetFields();
}
// 设置表单数据全部为Disabled 【查看】
async function setDisabledForm(isDisabled) {
data.formDataProps.schemas = changeSchemaDisabled(cloneDeep(data.formDataProps.schemas),isDisabled);
}
// 获取行键值
function getRowKey() {
return RowKey;
}
// 更新api表单数据
async function update({ values, rowId }) {
try {
values[RowKey] = rowId;
state.formModel = values;
let saveVal = await updateLngPricePurPngApp(values);
await submitFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:提交表单
return saveVal;
} catch (error) {}
}
// 新增api表单数据
async function add(values) {
try {
state.formModel = values;
let saveVal = await addLngPricePurPngApp(values);
await submitFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:提交表单
return saveVal;
} catch (error) {}
}
// 根据工作流页面权限,设置表单属性(必填,禁用,显示)
async function setWorkFlowForm(obj: WorkFlowFormParams) {
try {
const cloneProps=cloneDeep(formProps);
customFormEventConfigs=cloneDeep(formEventConfigs);
if (formConfig.useCustomConfig) {
const parts = obj.formConfigKey.split('_');
const formId=parts[1];
cloneProps.schemas=await mergeFormSchemas({formSchema:cloneProps.schemas!,formId:formId});
customFormEventConfigs=await mergeFormEventConfigs({formEventConfigs:customFormEventConfigs,formId:formId});
}
let flowData = changeWorkFlowForm(cloneProps, obj);
let { buildOptionJson, uploadComponentIds, formModels, isViewProcess } = flowData;
data.formDataProps = buildOptionJson;
emits('changeUploadComponentIds', uploadComponentIds); //工作流中必须保存上传组件id【附件汇总需要】
if (isViewProcess) {
setDisabledForm(); //查看
}
state.formModel = formModels;
if(formModels[RowKey]) {
setFormDataFromId(formModels[RowKey], false)
} else {
setFieldsValue(formModels)
}
} catch (error) {}
await createFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:初始化表单
await loadFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:加载表单
}
function getFormModel() {
return systemFormRef.value.formModel
}
async function handleDelete(id) {
return await deleteLngPricePurPngApp([id]);
}
defineExpose({
setFieldsValue,
resetFields,
validate,
add,
update,
setFormDataFromId,
setDisabledForm,
setMenuPermission,
setWorkFlowForm,
getRowKey,
getFormModel,
handleDelete
});
</script>

View File

@ -0,0 +1,110 @@
<template>
<BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" @cancel="handleClose" :paddingRight="15" :bodyStyle="{ minHeight: '400px !important' }">
<ModalForm ref="formRef" :fromPage="FromPageType.MENU" />
</BasicModal>
</template>
<script lang="ts" setup>
import { ref, computed, reactive } from 'vue';
import { BasicModal, useModalInner } from '/@/components/Modal';
import { useMessage } from '/@/hooks/web/useMessage';
import { useI18n } from '/@/hooks/web/useI18n';
import { formProps } from './config';
import ModalForm from './Form.vue';
import { FromPageType } from '/@/enums/workflowEnum';
const emit = defineEmits(['success', 'register']);
const { notification } = useMessage();
const formRef = ref();
const state = reactive({
formModel: {},
isUpdate: true,
isView: false,
isCopy: false,
rowId: '',
});
const { t } = useI18n();
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
state.isUpdate = !!data?.isUpdate;
state.isView = !!data?.isView;
state.isCopy = !!data?.isCopy;
setModalProps({
destroyOnClose: true,
maskClosable: false,
showCancelBtn: !state.isView,
showOkBtn: !state.isView,
canFullscreen: true,
width: 900,
});
if (state.isUpdate || state.isView || state.isCopy) {
state.rowId = data.id;
if (state.isView) {
await formRef.value.setDisabledForm();
}
await formRef.value.setFormDataFromId(state.rowId);
} else {
formRef.value.resetFields();
}
});
const getTitle = computed(() => (state.isView ? '查看' : !state.isUpdate ? '新增' : '编辑'));
async function saveModal() {
let saveSuccess = false;
try {
const values = await formRef.value?.validate();
//添加隐藏组件
if (formProps.hiddenComponent?.length) {
formProps.hiddenComponent.forEach((component) => {
values[component.bindField] = component.value;
});
}
if (values !== false) {
try {
if (!state.isUpdate || state.isCopy) {
saveSuccess = await formRef.value.add(values);
} else {
saveSuccess = await formRef.value.update({ values, rowId: state.rowId });
}
return saveSuccess;
} catch (error) {}
}
} catch (error) {
return saveSuccess;
}
}
async function handleSubmit() {
try {
const saveSuccess = await saveModal();
setModalProps({ confirmLoading: true });
if (saveSuccess) {
if (!state.isUpdate || state.isCopy) {
//false 新增
notification.success({
message: 'Tip',
description: t('新增成功!'),
}); //提示消息
} else {
notification.success({
message: 'Tip',
description: t('修改成功!'),
}); //提示消息
}
closeModal();
formRef.value.resetFields();
emit('success');
}
} finally {
setModalProps({ confirmLoading: false });
}
}
function handleClose() {
formRef.value.resetFields();
}
</script>

View File

@ -0,0 +1,513 @@
import { FormProps, FormSchema } from '/@/components/Form';
import { BasicColumn } from '/@/components/Table';
export const formConfig = {
useCustomConfig: false,
};
export const searchFormSchema: FormSchema[] = [
{
field: 'id',
label: 'Id',
component: 'Input',
},
{
field: 'appName',
label: '申请说明',
component: 'Input',
},
{
field: 'priceTypeCode',
label: '定价类型',
component: 'Input',
},
{
field: 'comId',
label: '交易主体',
component: 'Input',
},
{
field: 'priceDesc',
label: '说明',
component: 'Input',
},
{
field: 'approCode',
label: '审批状态',
component: 'XjrSelect',
componentProps: {
datasourceType: 'dic',
params: { itemId: '1990669393069129729' },
labelField: 'name',
valueField: 'value',
getPopupContainer: () => document.body,
},
},
];
export const columns: BasicColumn[] = [
{
dataIndex: 'id',
title: 'Id',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'appName',
title: '申请说明',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'priceTypeCode',
title: '定价类型',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'comId',
title: '交易主体',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'priceDesc',
title: '说明',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'approCode',
title: '审批状态',
componentType: 'select',
align: 'left',
sorter: true,
},
];
//表单事件
export const formEventConfigs = {
0: [
{
type: 'circle',
color: '#2774ff',
text: '开始节点',
icon: '#icon-kaishi',
bgcColor: '#D8E5FF',
isUserDefined: false,
},
{
color: '#F6AB01',
icon: '#icon-chushihua',
text: '初始化表单',
bgcColor: '#f9f5ea',
isUserDefined: false,
nodeInfo: { processEvent: [] },
},
],
1: [
{
color: '#B36EDB',
icon: '#icon-shujufenxi',
text: '获取表单数据',
detail: '(新增无此操作)',
bgcColor: '#F8F2FC',
isUserDefined: false,
nodeInfo: { processEvent: [] },
},
],
2: [
{
color: '#F8625C',
icon: '#icon-jiazai',
text: '加载表单',
bgcColor: '#FFF1F1',
isUserDefined: false,
nodeInfo: { processEvent: [] },
},
],
3: [
{
color: '#6C6AE0',
icon: '#icon-jsontijiao',
text: '提交表单',
bgcColor: '#F5F4FF',
isUserDefined: false,
nodeInfo: { processEvent: [] },
},
],
4: [
{
type: 'circle',
color: '#F8625C',
text: '结束节点',
icon: '#icon-jieshuzhiliao',
bgcColor: '#FFD6D6',
isLast: true,
isUserDefined: false,
},
],
};
export const formProps: FormProps = {
labelCol: { span: 3, offset: 0 },
labelAlign: 'right',
layout: 'horizontal',
size: 'default',
schemas: [
{
key: 'f4fa01f4a3064ce39de3ec27c4232382',
field: 'id',
label: 'Id',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入Id',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: '1d49b1f993424bfcac628210cfbbd10a',
field: 'appName',
label: '申请说明',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入申请说明',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: '992aadab6f59409e94231b7e4e5a5c3c',
field: 'priceTypeCode',
label: '定价类型',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入定价类型',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: '0d38008197d2483db6425929aaf32812',
field: 'comId',
label: '交易主体',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入交易主体',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: 'd010ae31c78244ae87bff655601cb9c6',
field: 'priceDesc',
label: '说明',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入说明',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: 'c2715e8e52be41018574cb36046e0db2',
field: 'approCode',
label: '审批状态',
type: 'select',
component: 'XjrSelect',
colProps: { span: 24 },
componentProps: {
width: '100%',
span: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请选择下拉选择',
sepTextField: '',
showLabel: true,
showSearch: false,
clearable: false,
disabled: true,
mode: '',
staticOptions: [
{ key: 1, label: 'Option 1', value: 'Option 1' },
{ key: 2, label: 'Option 2', value: 'Option 2' },
{ key: 3, label: 'Option 3', value: 'Option 3' },
],
defaultSelect: 'WTJ',
datasourceType: 'dic',
params: { itemId: '1990669393069129729' },
labelField: 'name',
valueField: 'value',
apiConfig: {
path: 'CodeGeneration/selection',
method: 'GET',
apiId: '93d735dcb7364a0f8102188ec4d77ac7',
},
dicOptions: [],
required: false,
rules: [],
events: {},
isShow: true,
itemId: '1990669393069129729',
style: { width: '100%' },
},
},
{
key: '9aaa8930082d4453929bd7842b69c0b9',
label: '表格组件',
field: 'lngPricePurPngAppSuList',
type: 'form',
component: 'SubForm',
required: true,
colProps: { span: 24 },
componentProps: {
mainKey: 'lngPricePurPngAppSuList',
columns: [
{
key: '3cf2a760f9f949189a343ecf4953f64f',
title: '单行文本',
dataIndex: 'id',
componentType: 'Input',
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入单行文本',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
},
},
{ title: '操作', key: 'action', fixed: 'right', width: '50px' },
],
span: '24',
preloadType: 'api',
apiConfig: {},
itemId: '',
dicOptions: [],
useSelectButton: false,
buttonName: '选择数据',
showLabel: true,
showComponentBorder: true,
showFormBorder: true,
showIndex: false,
isShow: true,
multipleHeads: [],
},
},
{
key: 'c08c0749343146b19ff6cf54a3b264ca',
label: '表格组件',
field: 'lngPricePurPngAppSuDtlList',
type: 'form',
component: 'SubForm',
required: true,
colProps: { span: 24 },
componentProps: {
mainKey: 'lngPricePurPngAppSuDtlList',
columns: [
{
key: '034ec72682e740a69d3a6ac6b457b95e',
title: '单行文本',
dataIndex: 'id',
componentType: 'Input',
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入单行文本',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
},
},
{ title: '操作', key: 'action', fixed: 'right', width: '50px' },
],
span: '24',
preloadType: 'api',
apiConfig: {},
itemId: '',
dicOptions: [],
useSelectButton: false,
buttonName: '选择数据',
showLabel: true,
showComponentBorder: true,
showFormBorder: true,
showIndex: false,
isShow: true,
multipleHeads: [],
},
},
],
showActionButtonGroup: false,
buttonLocation: 'center',
actionColOptions: { span: 24 },
showResetButton: false,
showSubmitButton: false,
hiddenComponent: [],
};

View File

@ -0,0 +1,150 @@
export const permissionList = [
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: 'Id',
fieldId: 'id',
isSubTable: false,
showChildren: true,
type: 'input',
key: 'f4fa01f4a3064ce39de3ec27c4232382',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '申请说明',
fieldId: 'appName',
isSubTable: false,
showChildren: true,
type: 'input',
key: '1d49b1f993424bfcac628210cfbbd10a',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '定价类型',
fieldId: 'priceTypeCode',
isSubTable: false,
showChildren: true,
type: 'input',
key: '992aadab6f59409e94231b7e4e5a5c3c',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '交易主体',
fieldId: 'comId',
isSubTable: false,
showChildren: true,
type: 'input',
key: '0d38008197d2483db6425929aaf32812',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '说明',
fieldId: 'priceDesc',
isSubTable: false,
showChildren: true,
type: 'input',
key: 'd010ae31c78244ae87bff655601cb9c6',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '审批状态',
fieldId: 'approCode',
isSubTable: false,
showChildren: true,
type: 'select',
key: 'c2715e8e52be41018574cb36046e0db2',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSubTable: true,
showChildren: false,
tableName: 'lngPricePurPngAppSuList',
fieldName: '表格组件',
fieldId: 'lngPricePurPngAppSuList',
type: 'form',
key: '9aaa8930082d4453929bd7842b69c0b9',
children: [
{
required: true,
view: true,
edit: true,
disabled: false,
isSubTable: true,
isSaveTable: false,
showChildren: false,
tableName: 'lngPricePurPngAppSuList',
fieldName: '单行文本',
fieldId: 'id',
key: '3cf2a760f9f949189a343ecf4953f64f',
children: [],
},
],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSubTable: true,
showChildren: false,
tableName: 'lngPricePurPngAppSuDtlList',
fieldName: '表格组件',
fieldId: 'lngPricePurPngAppSuDtlList',
type: 'form',
key: 'c08c0749343146b19ff6cf54a3b264ca',
children: [
{
required: true,
view: true,
edit: true,
disabled: false,
isSubTable: true,
isSaveTable: false,
showChildren: false,
tableName: 'lngPricePurPngAppSuDtlList',
fieldName: '单行文本',
fieldId: 'id',
key: '034ec72682e740a69d3a6ac6b457b95e',
children: [],
},
],
},
];

View File

@ -0,0 +1,405 @@
<template>
<PageWrapper dense fixedHeight contentFullHeight contentClass="flex">
<BasicTable @register="registerTable" ref="tableRef" @row-dbClick="dbClickRow">
<template #toolbar>
<template v-for="button in tableButtonConfig" :key="button.code">
<a-button v-if="button.isDefault" :type="button.type" @click="buttonClick(button.code)">
<template #icon><Icon :icon="button.icon" /></template>
{{ button.name }}
</a-button>
<a-button v-else :type="button.type">
<template #icon><Icon :icon="button.icon" /></template>
{{ button.name }}
</a-button>
</template>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.dataIndex === 'action'">
<TableAction :actions="getActions(record)" />
</template>
</template>
</BasicTable>
<PricePurPngAppModal @register="registerModal" @success="handleSuccess" />
<DataLog :logId="logId" :logPath="logPath" v-model:visible="modalVisible"/>
</PageWrapper>
</template>
<script lang="ts" setup>
const modalVisible = ref(false);
const logId = ref('')
const logPath = ref('/price/pricePurPngApp/datalog');
import { DataLog } from '/@/components/pcitc';
import { ref, computed, onMounted, onUnmounted, createVNode,
} from 'vue';
import { Modal } from 'ant-design-vue';
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
import { BasicTable, useTable, TableAction, ActionItem } from '/@/components/Table';
import { getLngPricePurPngAppPage, deleteLngPricePurPngApp} from '/@/api/price/PricePurPngApp';
import { PageWrapper } from '/@/components/Page';
import { useMessage } from '/@/hooks/web/useMessage';
import { useI18n } from '/@/hooks/web/useI18n';
import { usePermission } from '/@/hooks/web/usePermission';
import { useFormConfig } from '/@/hooks/web/useFormConfig';
import { useRouter } from 'vue-router';
import { setIndexFlowStatus } from '/@/utils/flow/index'
import { getLngPricePurPngApp } from '/@/api/price/PricePurPngApp';
import { useModal,BasicModal } from '/@/components/Modal';
import LookProcess from '/@/views/workflow/task/components/LookProcess.vue';
import LaunchProcess from '/@/views/workflow/task/components/LaunchProcess.vue';
import ApprovalProcess from '/@/views/workflow/task/components/ApprovalProcess.vue';
import { getDraftInfo } from '/@/api/workflow/process';
import { isValidJSON } from '/@/utils/event/design';
import PricePurPngAppModal from './components/PricePurPngAppModal.vue';
import {formConfig, searchFormSchema, columns } from './components/config';
import Icon from '/@/components/Icon/index';
import FlowRecord from '/@/views/workflow/task/components/flow/FlowRecord.vue';
import useEventBus from '/@/hooks/event/useEventBus';
import { cloneDeep } from 'lodash-es';
const { bus, CREATE_FLOW, FLOW_PROCESSED, FORM_LIST_MODIFIED } = useEventBus();
const { notification } = useMessage();
const { t } = useI18n();
defineEmits(['register']);
const { filterColumnAuth, filterButtonAuth } = usePermission();
const { mergeColumns,mergeSearchFormSchema,mergeButtons } = useFormConfig();
const filterColumns = cloneDeep(filterColumnAuth(columns));
const customConfigColums =ref(filterColumns);
const customSearchFormSchema =ref(searchFormSchema);
const tableRef = ref();
//所有按钮
const buttons = ref([{"isUse":true,"name":"新增","code":"add","icon":"ant-design:plus-outlined","isDefault":true,"type":"primary"},{"isUse":true,"name":"编辑","code":"edit","icon":"ant-design:form-outlined","isDefault":true},{"isUse":true,"name":"刷新","code":"refresh","icon":"ant-design:reload-outlined","isDefault":true},{"isUse":true,"name":"查看","code":"view","icon":"ant-design:eye-outlined","isDefault":true},{"isUse":true,"name":"数据日志","code":"datalog","icon":"ant-design:profile-outlined","isDefault":true},{"isUse":true,"name":"发起审批","code":"startwork","icon":"ant-design:form-outlined","isDefault":true},{"isUse":true,"name":"查看流转记录","code":"flowRecord","icon":"ant-design:form-outlined","isDefault":true},{"isUse":true,"name":"审批","code":"approve","icon":"ant-design:check-outlined","isDefault":true},{"isUse":true,"name":"删除","code":"delete","icon":"ant-design:delete-outlined","isDefault":true}]);
//展示在列表内的按钮
const actionButtons = ref<string[]>(['view', 'edit','datalog', 'copyData', 'delete', 'startwork','flowRecord']);
const buttonConfigs = computed(()=>{
return filterButtonAuth(buttons.value);
})
const tableButtonConfig = computed(() => {
return buttonConfigs.value?.filter((x) => !actionButtons.value.includes(x.code));
});
const actionButtonConfig = computed(() => {
return buttonConfigs.value?.filter((x) => actionButtons.value.includes(x.code));
});
const btnEvent = {add : handleAdd,edit : handleEdit,refresh : handleRefresh,view : handleView,datalog : handleDatalog,startwork : handleStartwork,flowRecord : handleFlowRecord,approve : handleApprove,delete : handleDelete,}
const { currentRoute } = useRouter();
const router = useRouter();
const formIdComputedRef = ref();
formIdComputedRef.value = currentRoute.value.meta.formId
const schemaIdComputedRef = ref();
schemaIdComputedRef.value = currentRoute.value.meta.schemaId
const visibleLookProcessRef = ref(false);
const processIdRef = ref('');
const visibleLaunchProcessRef = ref(false);
const schemaIdRef = ref('');
const formDataRef = ref();
const rowKeyData = ref();
const draftsId = ref();
const visibleApproveProcessRef = ref(false);
const taskIdRef = ref('');
const visibleFlowRecordModal = ref(false);
const [registerModal, { openModal }] = useModal();
const formName='管道气采购价格申请单';
const [registerTable, { reload, }] = useTable({
title: '' || (formName + '列表'),
api: getLngPricePurPngAppPage,
rowKey: 'id',
columns: customConfigColums,
formConfig: {
rowProps: {
gutter: 16,
},
schemas: customSearchFormSchema,
fieldMapToTime: [],
showResetButton: false,
},
beforeFetch: (params) => {
return { ...params, FormId: formIdComputedRef.value, PK: 'id' };
},
afterFetch: (res) => {
tableRef.value.setToolBarWidth();
},
useSearchForm: true,
showTableSetting: true,
striped: false,
actionColumn: {
width: 160,
title: '操作',
dataIndex: 'action',
slots: { customRender: 'action' },
},
tableSetting: {
size: false,
setting: false,
},
});
function dbClickRow(record) {
if (!actionButtonConfig?.value.some(element => element.code == 'view')) {
return;
}
const { processId, taskIds, schemaId } = record.workflowData || {};
if (taskIds && taskIds.length) {
router.push({
path: '/flow/' + schemaId + '/' + (processId || '') + '/approveFlow',
query: {
taskId: taskIds[0],
formName: formName,
formId:currentRoute.value.meta.formId
}
});
} else if (schemaId && !taskIds && processId) {
router.push({
path: '/flow/' + schemaId + '/' + processId + '/approveFlow',
query: {
readonly: 1,
taskId: '',
formName: formName,
formId:currentRoute.value.meta.formId
}
});
} else {
router.push({
path: '/form/PricePurPngApp/' + record.id + '/viewForm',
query: {
formPath: 'price/PricePurPngApp',
formName: formName,
formId:currentRoute.value.meta.formId
}
});
}
}
function buttonClick(code) {
btnEvent[code]();
}
function handleDatalog (record: Recordable) {
modalVisible.value = true
logId.value = record.id
}
function handleAdd() {
if (schemaIdComputedRef.value) {
router.push({
path: '/flow/' + schemaIdComputedRef.value + '/0/createFlow'
});
} else {
router.push({
path: '/form/PricePurPngApp/0/createForm',
query: {
formPath: 'price/PricePurPngApp',
formName: formName,
formId:currentRoute.value.meta.formId
}
});
}
}
function handleEdit(record: Recordable) {
router.push({
path: '/form/PricePurPngApp/' + record.id + '/updateForm',
query: {
formPath: 'price/PricePurPngApp',
formName: formName,
formId:currentRoute.value.meta.formId
}
});
}
function handleDelete(record: Recordable) {
deleteList([record.id]);
}
function deleteList(ids) {
Modal.confirm({
title: '提示信息',
icon: createVNode(ExclamationCircleOutlined),
content: '是否确认删除?',
okText: '确认',
cancelText: '取消',
onOk() {
deleteLngPricePurPngApp(ids).then((_) => {
handleSuccess();
notification.success({
message: 'Tip',
description: t('删除成功!'),
});
});
},
onCancel() {},
});
}
function handleRefresh() {
reload();
}
function handleSuccess() {
reload();
}
function handleView(record: Recordable) {
dbClickRow(record);
}
onMounted(() => {
if (schemaIdComputedRef.value) {
bus.on(FLOW_PROCESSED, handleRefresh);
bus.on(CREATE_FLOW, handleRefresh);
} else {
bus.on(FORM_LIST_MODIFIED, handleRefresh);
}
// 合并渲染覆盖配置中的列表配置,包括展示字段配置、搜索字段配置、按钮配置
mergeCustomListRenderConfig();
});
onUnmounted(() => {
if (schemaIdComputedRef.value) {
bus.off(FLOW_PROCESSED, handleRefresh);
bus.off(CREATE_FLOW, handleRefresh);
} else {
bus.off(FORM_LIST_MODIFIED, handleRefresh);
}
});
function getActions(record: Recordable):ActionItem[] {
let actionsList: ActionItem[] = [];
let editAndDelBtn: ActionItem[] = [];
let hasFlowRecord = false;
actionButtonConfig.value?.map((button) => {
if (['view', 'copyData'].includes(button.code)) {
actionsList.push({
icon: button?.icon,
tooltip: button?.name,
onClick: btnEvent[button.code].bind(null, record),
});
}
if (['edit', 'delete'].includes(button.code)) {
editAndDelBtn.push({
icon: button?.icon,
tooltip: button?.name,
color: button.code === 'delete' ? 'error' : undefined,
onClick: btnEvent[button.code].bind(null, record),
});
}
if (button.code === 'flowRecord') hasFlowRecord = true;
});
if (record.workflowData?.enabled) {
//与工作流有关联的表单
if (record.workflowData.status) {
actionsList.unshift(setIndexFlowStatus(record.workflowData))
} else {
actionsList = actionsList.concat(editAndDelBtn);
}
} else {
if (!record.workflowData?.processId) {
//与工作流没有关联的表单并且在当前页面新增的数据 如选择编辑、删除按钮则加上
actionsList = actionsList.concat(editAndDelBtn);
}
}
return actionsList;
}
function handleStartwork(record: Recordable) {
const { processId, schemaId } = record.workflowData;
router.push({
path: '/flow/' + schemaId + '/' + (processId || '') + '/approveFlow',
query: {
readonly: 1,
taskId: '',
formName: formName
}
});
}
function handleFlowRecord(record: Recordable) {
if (record.workflowData) {
visibleFlowRecordModal.value = true;
processIdRef.value = record.workflowData?.processId;
}
}
async function handleLaunchProcess(record: Recordable) {
const schemaId=record.workflowData?.schemaId||schemaIdComputedRef.value;
if(schemaId){
if(record.workflowData?.draftId){
let res = await getDraftInfo(record.workflowData.draftId);
if (isValidJSON(res.formData)) {
localStorage.setItem('draftsJsonStr', res.formData);
router.push({
path: '/flow/' + schemaId + '/'+record.workflowData.draftId+'/createFlow'
});
return;
}
}
const result = await getLngPricePurPngApp(record['id']);
const form={};
const key="form_"+schemaId+"_"+record['id'];
form[key]=result;
localStorage.setItem('formJsonStr', JSON.stringify(form));
router.push({
path: '/flow/' + schemaId + '/0/createFlow',
query: {
fromKey: key
}
});
}
}
function handleApproveProcess(record: Recordable) {
const { processId, taskIds, schemaId } = record.workflowData;
router.push({
path: '/flow/' + schemaId + '/' + processId + '/approveFlow',
query: {
taskId: taskIds[0],
formName: formName
}
});
}
function handleCloseLaunch() {
visibleLaunchProcessRef.value = false;
reload();
}
function handleCloseApproval() {
visibleApproveProcessRef.value = false;
reload();
}
async function mergeCustomListRenderConfig(){
if (formConfig.useCustomConfig) {
let formId=currentRoute.value.meta.formId;
//1.合并展示字段配置
let cols= await mergeColumns(customConfigColums.value,formId);
customConfigColums.value=cols;
//2.合并搜索字段配置
let sFormSchema= await mergeSearchFormSchema(customSearchFormSchema.value,formId);
customSearchFormSchema.value=sFormSchema;
//3.合并按钮配置
let btns= await mergeButtons(buttons.value,formId);
buttons.value=btns;
}
};
</script>
<style lang="less" scoped>
:deep(.ant-table-selection-col) {
width: 50px;
}
.show{
display: flex;
}
.hide{
display: none !important;
}
</style>

View File

@ -0,0 +1,224 @@
<template>
<SimpleForm
ref="systemFormRef"
:formProps="data.formDataProps"
:formModel="{}"
:isWorkFlow="props.fromPage!=FromPageType.MENU"
/>
</template>
<script lang="ts" setup>
import { reactive, ref,onBeforeMount,onMounted } from 'vue';
import { formProps, formEventConfigs ,formConfig} from './config';
import SimpleForm from '/@/components/SimpleForm/src/SimpleForm.vue';
import { addLngPriceSalesPngApp, getLngPriceSalesPngApp, updateLngPriceSalesPngApp, deleteLngPriceSalesPngApp } from '/@/api/price/PriceSalesPngApp';
import { cloneDeep } from 'lodash-es';
import { FormDataProps } from '/@/components/Designer/src/types';
import { usePermission } from '/@/hooks/web/usePermission';
import { useFormConfig } from '/@/hooks/web/useFormConfig';
import { FromPageType } from '/@/enums/workflowEnum';
import { createFormEvent, getFormDataEvent, loadFormEvent, submitFormEvent,} from '/@/hooks/web/useFormEvent';
import { changeWorkFlowForm, changeSchemaDisabled } from '/@/hooks/web/useWorkFlowForm';
import { WorkFlowFormParams } from '/@/model/workflow/bpmnConfig';
import { useRouter } from 'vue-router';
const { filterFormSchemaAuth } = usePermission();
const { mergeFormSchemas,mergeFormEventConfigs } = useFormConfig();
const { currentRoute } = useRouter();
const RowKey = 'id';
const emits = defineEmits(['changeUploadComponentIds','loadingCompleted', 'form-mounted']);
const props = defineProps({
fromPage: {
type: Number,
default: FromPageType.MENU,
},
});
const systemFormRef = ref();
const data: { formDataProps: FormDataProps } = reactive({
formDataProps: {schemas:[]} as FormDataProps,
});
const state = reactive({
formModel: {},
});
let customFormEventConfigs=[];
onMounted(async () => {
try {
// 合并渲染覆盖配置中的字段配置、表单事件配置
await mergeCustomFormRenderConfig();
if (props.fromPage == FromPageType.MENU) {
setMenuPermission();
await createFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:初始化表单
await loadFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:加载表单
} else if (props.fromPage == FromPageType.FLOW) {
emits('loadingCompleted'); //告诉系统表单已经加载完毕
// loadingCompleted后 工作流页面直接利用Ref调用setWorkFlowForm方法
} else if (props.fromPage == FromPageType.PREVIEW) {
// 预览 无需权限,表单事件也无需执行
} else if (props.fromPage == FromPageType.DESKTOP) {
// 桌面设计 表单事件需要执行
emits('loadingCompleted'); //告诉系统表单已经加载完毕
await createFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:初始化表单
await loadFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:加载表单
}
emits('form-mounted', formProps);
} catch (error) {
}
});
async function mergeCustomFormRenderConfig() {
let cloneProps=cloneDeep(formProps);
let fEventConfigs=cloneDeep(formEventConfigs);
if (formConfig.useCustomConfig) {
if(props.fromPage !== FromPageType.FLOW){
let formPath=currentRoute.value.query.formPath;
//1.合并字段配置
cloneProps.schemas=await mergeFormSchemas({formSchema:cloneProps.schemas!,formPath:formPath});
//2.合并表单事件配置
fEventConfigs=await mergeFormEventConfigs({formEventConfigs:fEventConfigs,formPath:formPath});
}
}
data.formDataProps=cloneProps;
customFormEventConfigs=fEventConfigs;
}
// 根据菜单页面权限,设置表单属性(必填,禁用,显示)
function setMenuPermission() {
data.formDataProps.schemas = filterFormSchemaAuth(data.formDataProps.schemas!);
}
// 校验form 通过返回表单数据
async function validate() {
let values = [];
try {
values = await systemFormRef.value?.validate();
//添加隐藏组件
if (data.formDataProps.hiddenComponent?.length) {
data.formDataProps.hiddenComponent.forEach((component) => {
values[component.bindField] = component.value;
});
}
} finally {
}
return values;
}
// 根据行唯一ID查询行数据并设置表单数据 【编辑】
async function setFormDataFromId(rowId, skipUpdate) {
try {
const record = await getLngPriceSalesPngApp(rowId);
if (skipUpdate) {
return record;
}
setFieldsValue(record);
state.formModel = record;
await getFormDataEvent(customFormEventConfigs, state.formModel, systemFormRef.value, formProps.schemas); //表单事件:获取表单数据
return record;
} catch (error) {
}
}
// 辅助设置表单数据
function setFieldsValue(record) {
systemFormRef.value.setFieldsValue(record);
}
// 重置表单数据
async function resetFields() {
await systemFormRef.value.resetFields();
}
// 设置表单数据全部为Disabled 【查看】
async function setDisabledForm(isDisabled) {
data.formDataProps.schemas = changeSchemaDisabled(cloneDeep(data.formDataProps.schemas),isDisabled);
}
// 获取行键值
function getRowKey() {
return RowKey;
}
// 更新api表单数据
async function update({ values, rowId }) {
try {
values[RowKey] = rowId;
state.formModel = values;
let saveVal = await updateLngPriceSalesPngApp(values);
await submitFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:提交表单
return saveVal;
} catch (error) {}
}
// 新增api表单数据
async function add(values) {
try {
state.formModel = values;
let saveVal = await addLngPriceSalesPngApp(values);
await submitFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:提交表单
return saveVal;
} catch (error) {}
}
// 根据工作流页面权限,设置表单属性(必填,禁用,显示)
async function setWorkFlowForm(obj: WorkFlowFormParams) {
try {
const cloneProps=cloneDeep(formProps);
customFormEventConfigs=cloneDeep(formEventConfigs);
if (formConfig.useCustomConfig) {
const parts = obj.formConfigKey.split('_');
const formId=parts[1];
cloneProps.schemas=await mergeFormSchemas({formSchema:cloneProps.schemas!,formId:formId});
customFormEventConfigs=await mergeFormEventConfigs({formEventConfigs:customFormEventConfigs,formId:formId});
}
let flowData = changeWorkFlowForm(cloneProps, obj);
let { buildOptionJson, uploadComponentIds, formModels, isViewProcess } = flowData;
data.formDataProps = buildOptionJson;
emits('changeUploadComponentIds', uploadComponentIds); //工作流中必须保存上传组件id【附件汇总需要】
if (isViewProcess) {
setDisabledForm(); //查看
}
state.formModel = formModels;
if(formModels[RowKey]) {
setFormDataFromId(formModels[RowKey], false)
} else {
setFieldsValue(formModels)
}
} catch (error) {}
await createFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:初始化表单
await loadFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:加载表单
}
function getFormModel() {
return systemFormRef.value.formModel
}
async function handleDelete(id) {
return await deleteLngPriceSalesPngApp([id]);
}
defineExpose({
setFieldsValue,
resetFields,
validate,
add,
update,
setFormDataFromId,
setDisabledForm,
setMenuPermission,
setWorkFlowForm,
getRowKey,
getFormModel,
handleDelete
});
</script>

View File

@ -0,0 +1,110 @@
<template>
<BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" @cancel="handleClose" :paddingRight="15" :bodyStyle="{ minHeight: '400px !important' }">
<ModalForm ref="formRef" :fromPage="FromPageType.MENU" />
</BasicModal>
</template>
<script lang="ts" setup>
import { ref, computed, reactive } from 'vue';
import { BasicModal, useModalInner } from '/@/components/Modal';
import { useMessage } from '/@/hooks/web/useMessage';
import { useI18n } from '/@/hooks/web/useI18n';
import { formProps } from './config';
import ModalForm from './Form.vue';
import { FromPageType } from '/@/enums/workflowEnum';
const emit = defineEmits(['success', 'register']);
const { notification } = useMessage();
const formRef = ref();
const state = reactive({
formModel: {},
isUpdate: true,
isView: false,
isCopy: false,
rowId: '',
});
const { t } = useI18n();
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
state.isUpdate = !!data?.isUpdate;
state.isView = !!data?.isView;
state.isCopy = !!data?.isCopy;
setModalProps({
destroyOnClose: true,
maskClosable: false,
showCancelBtn: !state.isView,
showOkBtn: !state.isView,
canFullscreen: true,
width: 900,
});
if (state.isUpdate || state.isView || state.isCopy) {
state.rowId = data.id;
if (state.isView) {
await formRef.value.setDisabledForm();
}
await formRef.value.setFormDataFromId(state.rowId);
} else {
formRef.value.resetFields();
}
});
const getTitle = computed(() => (state.isView ? '查看' : !state.isUpdate ? '新增' : '编辑'));
async function saveModal() {
let saveSuccess = false;
try {
const values = await formRef.value?.validate();
//添加隐藏组件
if (formProps.hiddenComponent?.length) {
formProps.hiddenComponent.forEach((component) => {
values[component.bindField] = component.value;
});
}
if (values !== false) {
try {
if (!state.isUpdate || state.isCopy) {
saveSuccess = await formRef.value.add(values);
} else {
saveSuccess = await formRef.value.update({ values, rowId: state.rowId });
}
return saveSuccess;
} catch (error) {}
}
} catch (error) {
return saveSuccess;
}
}
async function handleSubmit() {
try {
const saveSuccess = await saveModal();
setModalProps({ confirmLoading: true });
if (saveSuccess) {
if (!state.isUpdate || state.isCopy) {
//false 新增
notification.success({
message: 'Tip',
description: t('新增成功!'),
}); //提示消息
} else {
notification.success({
message: 'Tip',
description: t('修改成功!'),
}); //提示消息
}
closeModal();
formRef.value.resetFields();
emit('success');
}
} finally {
setModalProps({ confirmLoading: false });
}
}
function handleClose() {
formRef.value.resetFields();
}
</script>

View File

@ -0,0 +1,494 @@
import { FormProps, FormSchema } from '/@/components/Form';
import { BasicColumn } from '/@/components/Table';
export const formConfig = {
useCustomConfig: false,
};
export const searchFormSchema: FormSchema[] = [
{
field: 'id',
label: 'id',
component: 'Input',
},
{
field: 'appName',
label: '申请说明',
component: 'Input',
},
{
field: 'priceTypeCode',
label: '定价类型',
component: 'Input',
},
{
field: 'priceDesc',
label: '说明',
component: 'Input',
},
{
field: 'comId',
label: '交易主体',
component: 'Input',
},
{
field: 'approCode',
label: '审批状态',
component: 'Input',
},
];
export const columns: BasicColumn[] = [
{
dataIndex: 'id',
title: 'id',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'appName',
title: '申请说明',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'priceTypeCode',
title: '定价类型',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'priceDesc',
title: '说明',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'comId',
title: '交易主体',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'approCode',
title: '审批状态',
componentType: 'input',
align: 'left',
sorter: true,
},
];
//表单事件
export const formEventConfigs = {
0: [
{
type: 'circle',
color: '#2774ff',
text: '开始节点',
icon: '#icon-kaishi',
bgcColor: '#D8E5FF',
isUserDefined: false,
},
{
color: '#F6AB01',
icon: '#icon-chushihua',
text: '初始化表单',
bgcColor: '#f9f5ea',
isUserDefined: false,
nodeInfo: { processEvent: [] },
},
],
1: [
{
color: '#B36EDB',
icon: '#icon-shujufenxi',
text: '获取表单数据',
detail: '(新增无此操作)',
bgcColor: '#F8F2FC',
isUserDefined: false,
nodeInfo: { processEvent: [] },
},
],
2: [
{
color: '#F8625C',
icon: '#icon-jiazai',
text: '加载表单',
bgcColor: '#FFF1F1',
isUserDefined: false,
nodeInfo: { processEvent: [] },
},
],
3: [
{
color: '#6C6AE0',
icon: '#icon-jsontijiao',
text: '提交表单',
bgcColor: '#F5F4FF',
isUserDefined: false,
nodeInfo: { processEvent: [] },
},
],
4: [
{
type: 'circle',
color: '#F8625C',
text: '结束节点',
icon: '#icon-jieshuzhiliao',
bgcColor: '#FFD6D6',
isLast: true,
isUserDefined: false,
},
],
};
export const formProps: FormProps = {
labelCol: { span: 3, offset: 0 },
labelAlign: 'right',
layout: 'horizontal',
size: 'default',
schemas: [
{
key: 'd97ea4a51d5444c58898ecf1d3af1df4',
field: 'id',
label: 'id',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入id',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: 'a97d07c63f044c86b415aa6d582a2e9b',
field: 'appName',
label: '申请说明',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入申请说明',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: 'ea4d39f2a5724276bd20319ba87fbf42',
field: 'priceTypeCode',
label: '定价类型',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入定价类型',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: '3ab359efb3884e549791c99bb31d6ac6',
field: 'priceDesc',
label: '说明',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入说明',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: '534d74fdff5f4f3ba79dbe3fc7be2035',
field: 'comId',
label: '交易主体',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入交易主体',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: '1fb3f070a0ac4950b540e7caa9a50bf9',
field: 'approCode',
label: '审批状态',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入审批状态',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: 'c0c8ff76091f4cb580a6a837331ec22d',
label: '表格组件',
field: 'lngPriceSalesPngAppCuList',
type: 'form',
component: 'SubForm',
required: true,
colProps: { span: 24 },
componentProps: {
mainKey: 'lngPriceSalesPngAppCuList',
columns: [
{
key: '50ada716ed004ada8087130f563f054b',
title: '单行文本',
dataIndex: 'id',
componentType: 'Input',
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入单行文本',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
},
},
{ title: '操作', key: 'action', fixed: 'right', width: '50px' },
],
span: '24',
preloadType: 'api',
apiConfig: {},
itemId: '',
dicOptions: [],
useSelectButton: false,
buttonName: '选择数据',
showLabel: true,
showComponentBorder: true,
showFormBorder: true,
showIndex: false,
isShow: true,
multipleHeads: [],
},
},
{
key: '3da9bdaa8ba341f9ba29b9ed815dc03c',
label: '表格组件',
field: 'lngPriceSalesPngAppCuDtlList',
type: 'form',
component: 'SubForm',
required: true,
colProps: { span: 24 },
componentProps: {
mainKey: 'lngPriceSalesPngAppCuDtlList',
columns: [
{
key: '6d20cbed13414712aecba95024fe3bb6',
title: '单行文本',
dataIndex: 'id',
componentType: 'Input',
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入单行文本',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
},
},
{ title: '操作', key: 'action', fixed: 'right', width: '50px' },
],
span: '24',
preloadType: 'api',
apiConfig: {},
itemId: '',
dicOptions: [],
useSelectButton: false,
buttonName: '选择数据',
showLabel: true,
showComponentBorder: true,
showFormBorder: true,
showIndex: false,
isShow: true,
multipleHeads: [],
},
},
],
showActionButtonGroup: false,
buttonLocation: 'center',
actionColOptions: { span: 24 },
showResetButton: false,
showSubmitButton: false,
hiddenComponent: [],
};

View File

@ -0,0 +1,150 @@
export const permissionList = [
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: 'id',
fieldId: 'id',
isSubTable: false,
showChildren: true,
type: 'input',
key: 'd97ea4a51d5444c58898ecf1d3af1df4',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '申请说明',
fieldId: 'appName',
isSubTable: false,
showChildren: true,
type: 'input',
key: 'a97d07c63f044c86b415aa6d582a2e9b',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '定价类型',
fieldId: 'priceTypeCode',
isSubTable: false,
showChildren: true,
type: 'input',
key: 'ea4d39f2a5724276bd20319ba87fbf42',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '说明',
fieldId: 'priceDesc',
isSubTable: false,
showChildren: true,
type: 'input',
key: '3ab359efb3884e549791c99bb31d6ac6',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '交易主体',
fieldId: 'comId',
isSubTable: false,
showChildren: true,
type: 'input',
key: '534d74fdff5f4f3ba79dbe3fc7be2035',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '审批状态',
fieldId: 'approCode',
isSubTable: false,
showChildren: true,
type: 'input',
key: '1fb3f070a0ac4950b540e7caa9a50bf9',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSubTable: true,
showChildren: false,
tableName: 'lngPriceSalesPngAppCuList',
fieldName: '表格组件',
fieldId: 'lngPriceSalesPngAppCuList',
type: 'form',
key: 'c0c8ff76091f4cb580a6a837331ec22d',
children: [
{
required: true,
view: true,
edit: true,
disabled: false,
isSubTable: true,
isSaveTable: false,
showChildren: false,
tableName: 'lngPriceSalesPngAppCuList',
fieldName: '单行文本',
fieldId: 'id',
key: '50ada716ed004ada8087130f563f054b',
children: [],
},
],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSubTable: true,
showChildren: false,
tableName: 'lngPriceSalesPngAppCuDtlList',
fieldName: '表格组件',
fieldId: 'lngPriceSalesPngAppCuDtlList',
type: 'form',
key: '3da9bdaa8ba341f9ba29b9ed815dc03c',
children: [
{
required: true,
view: true,
edit: true,
disabled: false,
isSubTable: true,
isSaveTable: false,
showChildren: false,
tableName: 'lngPriceSalesPngAppCuDtlList',
fieldName: '单行文本',
fieldId: 'id',
key: '6d20cbed13414712aecba95024fe3bb6',
children: [],
},
],
},
];

View File

@ -0,0 +1,405 @@
<template>
<PageWrapper dense fixedHeight contentFullHeight contentClass="flex">
<BasicTable @register="registerTable" ref="tableRef" @row-dbClick="dbClickRow">
<template #toolbar>
<template v-for="button in tableButtonConfig" :key="button.code">
<a-button v-if="button.isDefault" :type="button.type" @click="buttonClick(button.code)">
<template #icon><Icon :icon="button.icon" /></template>
{{ button.name }}
</a-button>
<a-button v-else :type="button.type">
<template #icon><Icon :icon="button.icon" /></template>
{{ button.name }}
</a-button>
</template>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.dataIndex === 'action'">
<TableAction :actions="getActions(record)" />
</template>
</template>
</BasicTable>
<PriceSalesPngAppModal @register="registerModal" @success="handleSuccess" />
<DataLog :logId="logId" :logPath="logPath" v-model:visible="modalVisible"/>
</PageWrapper>
</template>
<script lang="ts" setup>
const modalVisible = ref(false);
const logId = ref('')
const logPath = ref('/price/priceSalesPngApp/datalog');
import { DataLog } from '/@/components/pcitc';
import { ref, computed, onMounted, onUnmounted, createVNode,
} from 'vue';
import { Modal } from 'ant-design-vue';
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
import { BasicTable, useTable, TableAction, ActionItem } from '/@/components/Table';
import { getLngPriceSalesPngAppPage, deleteLngPriceSalesPngApp} from '/@/api/price/PriceSalesPngApp';
import { PageWrapper } from '/@/components/Page';
import { useMessage } from '/@/hooks/web/useMessage';
import { useI18n } from '/@/hooks/web/useI18n';
import { usePermission } from '/@/hooks/web/usePermission';
import { useFormConfig } from '/@/hooks/web/useFormConfig';
import { useRouter } from 'vue-router';
import { setIndexFlowStatus } from '/@/utils/flow/index'
import { getLngPriceSalesPngApp } from '/@/api/price/PriceSalesPngApp';
import { useModal,BasicModal } from '/@/components/Modal';
import LookProcess from '/@/views/workflow/task/components/LookProcess.vue';
import LaunchProcess from '/@/views/workflow/task/components/LaunchProcess.vue';
import ApprovalProcess from '/@/views/workflow/task/components/ApprovalProcess.vue';
import { getDraftInfo } from '/@/api/workflow/process';
import { isValidJSON } from '/@/utils/event/design';
import PriceSalesPngAppModal from './components/PriceSalesPngAppModal.vue';
import {formConfig, searchFormSchema, columns } from './components/config';
import Icon from '/@/components/Icon/index';
import FlowRecord from '/@/views/workflow/task/components/flow/FlowRecord.vue';
import useEventBus from '/@/hooks/event/useEventBus';
import { cloneDeep } from 'lodash-es';
const { bus, CREATE_FLOW, FLOW_PROCESSED, FORM_LIST_MODIFIED } = useEventBus();
const { notification } = useMessage();
const { t } = useI18n();
defineEmits(['register']);
const { filterColumnAuth, filterButtonAuth } = usePermission();
const { mergeColumns,mergeSearchFormSchema,mergeButtons } = useFormConfig();
const filterColumns = cloneDeep(filterColumnAuth(columns));
const customConfigColums =ref(filterColumns);
const customSearchFormSchema =ref(searchFormSchema);
const tableRef = ref();
//所有按钮
const buttons = ref([{"isUse":true,"name":"新增","code":"add","icon":"ant-design:plus-outlined","isDefault":true,"type":"primary"},{"isUse":true,"name":"编辑","code":"edit","icon":"ant-design:form-outlined","isDefault":true},{"isUse":true,"name":"刷新","code":"refresh","icon":"ant-design:reload-outlined","isDefault":true},{"isUse":true,"name":"查看","code":"view","icon":"ant-design:eye-outlined","isDefault":true},{"isUse":true,"name":"数据日志","code":"datalog","icon":"ant-design:profile-outlined","isDefault":true},{"isUse":true,"name":"发起审批","code":"startwork","icon":"ant-design:form-outlined","isDefault":true},{"isUse":true,"name":"查看流转记录","code":"flowRecord","icon":"ant-design:form-outlined","isDefault":true},{"isUse":true,"name":"审批","code":"approve","icon":"ant-design:check-outlined","isDefault":true},{"isUse":true,"name":"删除","code":"delete","icon":"ant-design:delete-outlined","isDefault":true}]);
//展示在列表内的按钮
const actionButtons = ref<string[]>(['view', 'edit','datalog', 'copyData', 'delete', 'startwork','flowRecord']);
const buttonConfigs = computed(()=>{
return filterButtonAuth(buttons.value);
})
const tableButtonConfig = computed(() => {
return buttonConfigs.value?.filter((x) => !actionButtons.value.includes(x.code));
});
const actionButtonConfig = computed(() => {
return buttonConfigs.value?.filter((x) => actionButtons.value.includes(x.code));
});
const btnEvent = {add : handleAdd,edit : handleEdit,refresh : handleRefresh,view : handleView,datalog : handleDatalog,startwork : handleStartwork,flowRecord : handleFlowRecord,approve : handleApprove,delete : handleDelete,}
const { currentRoute } = useRouter();
const router = useRouter();
const formIdComputedRef = ref();
formIdComputedRef.value = currentRoute.value.meta.formId
const schemaIdComputedRef = ref();
schemaIdComputedRef.value = currentRoute.value.meta.schemaId
const visibleLookProcessRef = ref(false);
const processIdRef = ref('');
const visibleLaunchProcessRef = ref(false);
const schemaIdRef = ref('');
const formDataRef = ref();
const rowKeyData = ref();
const draftsId = ref();
const visibleApproveProcessRef = ref(false);
const taskIdRef = ref('');
const visibleFlowRecordModal = ref(false);
const [registerModal, { openModal }] = useModal();
const formName='管道气销售价格申请';
const [registerTable, { reload, }] = useTable({
title: '' || (formName + '列表'),
api: getLngPriceSalesPngAppPage,
rowKey: 'id',
columns: customConfigColums,
formConfig: {
rowProps: {
gutter: 16,
},
schemas: customSearchFormSchema,
fieldMapToTime: [],
showResetButton: false,
},
beforeFetch: (params) => {
return { ...params, FormId: formIdComputedRef.value, PK: 'id' };
},
afterFetch: (res) => {
tableRef.value.setToolBarWidth();
},
useSearchForm: true,
showTableSetting: true,
striped: false,
actionColumn: {
width: 160,
title: '操作',
dataIndex: 'action',
slots: { customRender: 'action' },
},
tableSetting: {
size: false,
setting: false,
},
});
function dbClickRow(record) {
if (!actionButtonConfig?.value.some(element => element.code == 'view')) {
return;
}
const { processId, taskIds, schemaId } = record.workflowData || {};
if (taskIds && taskIds.length) {
router.push({
path: '/flow/' + schemaId + '/' + (processId || '') + '/approveFlow',
query: {
taskId: taskIds[0],
formName: formName,
formId:currentRoute.value.meta.formId
}
});
} else if (schemaId && !taskIds && processId) {
router.push({
path: '/flow/' + schemaId + '/' + processId + '/approveFlow',
query: {
readonly: 1,
taskId: '',
formName: formName,
formId:currentRoute.value.meta.formId
}
});
} else {
router.push({
path: '/form/PriceSalesPngApp/' + record.id + '/viewForm',
query: {
formPath: 'price/PriceSalesPngApp',
formName: formName,
formId:currentRoute.value.meta.formId
}
});
}
}
function buttonClick(code) {
btnEvent[code]();
}
function handleDatalog (record: Recordable) {
modalVisible.value = true
logId.value = record.id
}
function handleAdd() {
if (schemaIdComputedRef.value) {
router.push({
path: '/flow/' + schemaIdComputedRef.value + '/0/createFlow'
});
} else {
router.push({
path: '/form/PriceSalesPngApp/0/createForm',
query: {
formPath: 'price/PriceSalesPngApp',
formName: formName,
formId:currentRoute.value.meta.formId
}
});
}
}
function handleEdit(record: Recordable) {
router.push({
path: '/form/PriceSalesPngApp/' + record.id + '/updateForm',
query: {
formPath: 'price/PriceSalesPngApp',
formName: formName,
formId:currentRoute.value.meta.formId
}
});
}
function handleDelete(record: Recordable) {
deleteList([record.id]);
}
function deleteList(ids) {
Modal.confirm({
title: '提示信息',
icon: createVNode(ExclamationCircleOutlined),
content: '是否确认删除?',
okText: '确认',
cancelText: '取消',
onOk() {
deleteLngPriceSalesPngApp(ids).then((_) => {
handleSuccess();
notification.success({
message: 'Tip',
description: t('删除成功!'),
});
});
},
onCancel() {},
});
}
function handleRefresh() {
reload();
}
function handleSuccess() {
reload();
}
function handleView(record: Recordable) {
dbClickRow(record);
}
onMounted(() => {
if (schemaIdComputedRef.value) {
bus.on(FLOW_PROCESSED, handleRefresh);
bus.on(CREATE_FLOW, handleRefresh);
} else {
bus.on(FORM_LIST_MODIFIED, handleRefresh);
}
// 合并渲染覆盖配置中的列表配置,包括展示字段配置、搜索字段配置、按钮配置
mergeCustomListRenderConfig();
});
onUnmounted(() => {
if (schemaIdComputedRef.value) {
bus.off(FLOW_PROCESSED, handleRefresh);
bus.off(CREATE_FLOW, handleRefresh);
} else {
bus.off(FORM_LIST_MODIFIED, handleRefresh);
}
});
function getActions(record: Recordable):ActionItem[] {
let actionsList: ActionItem[] = [];
let editAndDelBtn: ActionItem[] = [];
let hasFlowRecord = false;
actionButtonConfig.value?.map((button) => {
if (['view', 'copyData'].includes(button.code)) {
actionsList.push({
icon: button?.icon,
tooltip: button?.name,
onClick: btnEvent[button.code].bind(null, record),
});
}
if (['edit', 'delete'].includes(button.code)) {
editAndDelBtn.push({
icon: button?.icon,
tooltip: button?.name,
color: button.code === 'delete' ? 'error' : undefined,
onClick: btnEvent[button.code].bind(null, record),
});
}
if (button.code === 'flowRecord') hasFlowRecord = true;
});
if (record.workflowData?.enabled) {
//与工作流有关联的表单
if (record.workflowData.status) {
actionsList.unshift(setIndexFlowStatus(record.workflowData))
} else {
actionsList = actionsList.concat(editAndDelBtn);
}
} else {
if (!record.workflowData?.processId) {
//与工作流没有关联的表单并且在当前页面新增的数据 如选择编辑、删除按钮则加上
actionsList = actionsList.concat(editAndDelBtn);
}
}
return actionsList;
}
function handleStartwork(record: Recordable) {
const { processId, schemaId } = record.workflowData;
router.push({
path: '/flow/' + schemaId + '/' + (processId || '') + '/approveFlow',
query: {
readonly: 1,
taskId: '',
formName: formName
}
});
}
function handleFlowRecord(record: Recordable) {
if (record.workflowData) {
visibleFlowRecordModal.value = true;
processIdRef.value = record.workflowData?.processId;
}
}
async function handleLaunchProcess(record: Recordable) {
const schemaId=record.workflowData?.schemaId||schemaIdComputedRef.value;
if(schemaId){
if(record.workflowData?.draftId){
let res = await getDraftInfo(record.workflowData.draftId);
if (isValidJSON(res.formData)) {
localStorage.setItem('draftsJsonStr', res.formData);
router.push({
path: '/flow/' + schemaId + '/'+record.workflowData.draftId+'/createFlow'
});
return;
}
}
const result = await getLngPriceSalesPngApp(record['id']);
const form={};
const key="form_"+schemaId+"_"+record['id'];
form[key]=result;
localStorage.setItem('formJsonStr', JSON.stringify(form));
router.push({
path: '/flow/' + schemaId + '/0/createFlow',
query: {
fromKey: key
}
});
}
}
function handleApproveProcess(record: Recordable) {
const { processId, taskIds, schemaId } = record.workflowData;
router.push({
path: '/flow/' + schemaId + '/' + processId + '/approveFlow',
query: {
taskId: taskIds[0],
formName: formName
}
});
}
function handleCloseLaunch() {
visibleLaunchProcessRef.value = false;
reload();
}
function handleCloseApproval() {
visibleApproveProcessRef.value = false;
reload();
}
async function mergeCustomListRenderConfig(){
if (formConfig.useCustomConfig) {
let formId=currentRoute.value.meta.formId;
//1.合并展示字段配置
let cols= await mergeColumns(customConfigColums.value,formId);
customConfigColums.value=cols;
//2.合并搜索字段配置
let sFormSchema= await mergeSearchFormSchema(customSearchFormSchema.value,formId);
customSearchFormSchema.value=sFormSchema;
//3.合并按钮配置
let btns= await mergeButtons(buttons.value,formId);
buttons.value=btns;
}
};
</script>
<style lang="less" scoped>
:deep(.ant-table-selection-col) {
width: 50px;
}
.show{
display: flex;
}
.hide{
display: none !important;
}
</style>

View File

@ -0,0 +1,224 @@
<template>
<SimpleForm
ref="systemFormRef"
:formProps="data.formDataProps"
:formModel="{}"
:isWorkFlow="props.fromPage!=FromPageType.MENU"
/>
</template>
<script lang="ts" setup>
import { reactive, ref,onBeforeMount,onMounted } from 'vue';
import { formProps, formEventConfigs ,formConfig} from './config';
import SimpleForm from '/@/components/SimpleForm/src/SimpleForm.vue';
import { addLngMeaPurInt, getLngMeaPurInt, updateLngMeaPurInt, deleteLngMeaPurInt } from '/@/api/ship/MeaPurInt';
import { cloneDeep } from 'lodash-es';
import { FormDataProps } from '/@/components/Designer/src/types';
import { usePermission } from '/@/hooks/web/usePermission';
import { useFormConfig } from '/@/hooks/web/useFormConfig';
import { FromPageType } from '/@/enums/workflowEnum';
import { createFormEvent, getFormDataEvent, loadFormEvent, submitFormEvent,} from '/@/hooks/web/useFormEvent';
import { changeWorkFlowForm, changeSchemaDisabled } from '/@/hooks/web/useWorkFlowForm';
import { WorkFlowFormParams } from '/@/model/workflow/bpmnConfig';
import { useRouter } from 'vue-router';
const { filterFormSchemaAuth } = usePermission();
const { mergeFormSchemas,mergeFormEventConfigs } = useFormConfig();
const { currentRoute } = useRouter();
const RowKey = 'id';
const emits = defineEmits(['changeUploadComponentIds','loadingCompleted', 'form-mounted']);
const props = defineProps({
fromPage: {
type: Number,
default: FromPageType.MENU,
},
});
const systemFormRef = ref();
const data: { formDataProps: FormDataProps } = reactive({
formDataProps: {schemas:[]} as FormDataProps,
});
const state = reactive({
formModel: {},
});
let customFormEventConfigs=[];
onMounted(async () => {
try {
// 合并渲染覆盖配置中的字段配置、表单事件配置
await mergeCustomFormRenderConfig();
if (props.fromPage == FromPageType.MENU) {
setMenuPermission();
await createFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:初始化表单
await loadFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:加载表单
} else if (props.fromPage == FromPageType.FLOW) {
emits('loadingCompleted'); //告诉系统表单已经加载完毕
// loadingCompleted后 工作流页面直接利用Ref调用setWorkFlowForm方法
} else if (props.fromPage == FromPageType.PREVIEW) {
// 预览 无需权限,表单事件也无需执行
} else if (props.fromPage == FromPageType.DESKTOP) {
// 桌面设计 表单事件需要执行
emits('loadingCompleted'); //告诉系统表单已经加载完毕
await createFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:初始化表单
await loadFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:加载表单
}
emits('form-mounted', formProps);
} catch (error) {
}
});
async function mergeCustomFormRenderConfig() {
let cloneProps=cloneDeep(formProps);
let fEventConfigs=cloneDeep(formEventConfigs);
if (formConfig.useCustomConfig) {
if(props.fromPage !== FromPageType.FLOW){
let formPath=currentRoute.value.query.formPath;
//1.合并字段配置
cloneProps.schemas=await mergeFormSchemas({formSchema:cloneProps.schemas!,formPath:formPath});
//2.合并表单事件配置
fEventConfigs=await mergeFormEventConfigs({formEventConfigs:fEventConfigs,formPath:formPath});
}
}
data.formDataProps=cloneProps;
customFormEventConfigs=fEventConfigs;
}
// 根据菜单页面权限,设置表单属性(必填,禁用,显示)
function setMenuPermission() {
data.formDataProps.schemas = filterFormSchemaAuth(data.formDataProps.schemas!);
}
// 校验form 通过返回表单数据
async function validate() {
let values = [];
try {
values = await systemFormRef.value?.validate();
//添加隐藏组件
if (data.formDataProps.hiddenComponent?.length) {
data.formDataProps.hiddenComponent.forEach((component) => {
values[component.bindField] = component.value;
});
}
} finally {
}
return values;
}
// 根据行唯一ID查询行数据并设置表单数据 【编辑】
async function setFormDataFromId(rowId, skipUpdate) {
try {
const record = await getLngMeaPurInt(rowId);
if (skipUpdate) {
return record;
}
setFieldsValue(record);
state.formModel = record;
await getFormDataEvent(customFormEventConfigs, state.formModel, systemFormRef.value, formProps.schemas); //表单事件:获取表单数据
return record;
} catch (error) {
}
}
// 辅助设置表单数据
function setFieldsValue(record) {
systemFormRef.value.setFieldsValue(record);
}
// 重置表单数据
async function resetFields() {
await systemFormRef.value.resetFields();
}
// 设置表单数据全部为Disabled 【查看】
async function setDisabledForm(isDisabled) {
data.formDataProps.schemas = changeSchemaDisabled(cloneDeep(data.formDataProps.schemas),isDisabled);
}
// 获取行键值
function getRowKey() {
return RowKey;
}
// 更新api表单数据
async function update({ values, rowId }) {
try {
values[RowKey] = rowId;
state.formModel = values;
let saveVal = await updateLngMeaPurInt(values);
await submitFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:提交表单
return saveVal;
} catch (error) {}
}
// 新增api表单数据
async function add(values) {
try {
state.formModel = values;
let saveVal = await addLngMeaPurInt(values);
await submitFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:提交表单
return saveVal;
} catch (error) {}
}
// 根据工作流页面权限,设置表单属性(必填,禁用,显示)
async function setWorkFlowForm(obj: WorkFlowFormParams) {
try {
const cloneProps=cloneDeep(formProps);
customFormEventConfigs=cloneDeep(formEventConfigs);
if (formConfig.useCustomConfig) {
const parts = obj.formConfigKey.split('_');
const formId=parts[1];
cloneProps.schemas=await mergeFormSchemas({formSchema:cloneProps.schemas!,formId:formId});
customFormEventConfigs=await mergeFormEventConfigs({formEventConfigs:customFormEventConfigs,formId:formId});
}
let flowData = changeWorkFlowForm(cloneProps, obj);
let { buildOptionJson, uploadComponentIds, formModels, isViewProcess } = flowData;
data.formDataProps = buildOptionJson;
emits('changeUploadComponentIds', uploadComponentIds); //工作流中必须保存上传组件id【附件汇总需要】
if (isViewProcess) {
setDisabledForm(); //查看
}
state.formModel = formModels;
if(formModels[RowKey]) {
setFormDataFromId(formModels[RowKey], false)
} else {
setFieldsValue(formModels)
}
} catch (error) {}
await createFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:初始化表单
await loadFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:加载表单
}
function getFormModel() {
return systemFormRef.value.formModel
}
async function handleDelete(id) {
return await deleteLngMeaPurInt([id]);
}
defineExpose({
setFieldsValue,
resetFields,
validate,
add,
update,
setFormDataFromId,
setDisabledForm,
setMenuPermission,
setWorkFlowForm,
getRowKey,
getFormModel,
handleDelete
});
</script>

View File

@ -0,0 +1,110 @@
<template>
<BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" @cancel="handleClose" :paddingRight="15" :bodyStyle="{ minHeight: '400px !important' }">
<ModalForm ref="formRef" :fromPage="FromPageType.MENU" />
</BasicModal>
</template>
<script lang="ts" setup>
import { ref, computed, reactive } from 'vue';
import { BasicModal, useModalInner } from '/@/components/Modal';
import { useMessage } from '/@/hooks/web/useMessage';
import { useI18n } from '/@/hooks/web/useI18n';
import { formProps } from './config';
import ModalForm from './Form.vue';
import { FromPageType } from '/@/enums/workflowEnum';
const emit = defineEmits(['success', 'register']);
const { notification } = useMessage();
const formRef = ref();
const state = reactive({
formModel: {},
isUpdate: true,
isView: false,
isCopy: false,
rowId: '',
});
const { t } = useI18n();
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
state.isUpdate = !!data?.isUpdate;
state.isView = !!data?.isView;
state.isCopy = !!data?.isCopy;
setModalProps({
destroyOnClose: true,
maskClosable: false,
showCancelBtn: !state.isView,
showOkBtn: !state.isView,
canFullscreen: true,
width: 900,
});
if (state.isUpdate || state.isView || state.isCopy) {
state.rowId = data.id;
if (state.isView) {
await formRef.value.setDisabledForm();
}
await formRef.value.setFormDataFromId(state.rowId);
} else {
formRef.value.resetFields();
}
});
const getTitle = computed(() => (state.isView ? '查看' : !state.isUpdate ? '新增' : '编辑'));
async function saveModal() {
let saveSuccess = false;
try {
const values = await formRef.value?.validate();
//添加隐藏组件
if (formProps.hiddenComponent?.length) {
formProps.hiddenComponent.forEach((component) => {
values[component.bindField] = component.value;
});
}
if (values !== false) {
try {
if (!state.isUpdate || state.isCopy) {
saveSuccess = await formRef.value.add(values);
} else {
saveSuccess = await formRef.value.update({ values, rowId: state.rowId });
}
return saveSuccess;
} catch (error) {}
}
} catch (error) {
return saveSuccess;
}
}
async function handleSubmit() {
try {
const saveSuccess = await saveModal();
setModalProps({ confirmLoading: true });
if (saveSuccess) {
if (!state.isUpdate || state.isCopy) {
//false 新增
notification.success({
message: 'Tip',
description: t('新增成功!'),
}); //提示消息
} else {
notification.success({
message: 'Tip',
description: t('修改成功!'),
}); //提示消息
}
closeModal();
formRef.value.resetFields();
emit('success');
}
} finally {
setModalProps({ confirmLoading: false });
}
}
function handleClose() {
formRef.value.resetFields();
}
</script>

View File

@ -0,0 +1,746 @@
import { FormProps, FormSchema } from '/@/components/Form';
import { BasicColumn } from '/@/components/Table';
export const formConfig = {
useCustomConfig: false,
};
export const searchFormSchema: FormSchema[] = [
{
field: 'dateMea',
label: '计量时间',
component: 'Input',
},
{
field: 'typeCode',
label: '计量类型',
component: 'Input',
},
{
field: 'inspName',
label: '商检公司',
component: 'Input',
},
{
field: 'id',
label: 'id',
component: 'Input',
},
{
field: 'qtyMmbtu',
label: '热值MMBtu',
component: 'Input',
},
{
field: 'qtyGj',
label: '热值GJ',
component: 'Input',
},
{
field: 'qtyTon',
label: '重量(吨)',
component: 'Input',
},
{
field: 'qtyM3L',
label: '液态体积(方)',
component: 'Input',
},
{
field: 'qtyM3',
label: '气态体积(方)',
component: 'Input',
},
{
field: 'rateTonM3L',
label: '密度(吨/液态方)',
component: 'Input',
},
{
field: 'rateTonGj',
label: '热值比(吨/GJ)',
component: 'Input',
},
{
field: 'rateM3Gj',
label: '热值比(气态方/GJ)',
component: 'Input',
},
{
field: 'rateTonM3',
label: '气化率(吨/气态方)',
component: 'Input',
},
{
field: 'note',
label: '备注',
component: 'Input',
},
];
export const columns: BasicColumn[] = [
{
dataIndex: 'id',
title: 'id',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'dateMea',
title: '计量时间',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'typeCode',
title: '计量类型',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'qtyMmbtu',
title: '热值MMBtu',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'qtyGj',
title: '热值GJ',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'qtyTon',
title: '重量(吨)',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'qtyM3L',
title: '液态体积(方)',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'qtyM3',
title: '气态体积(方)',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'rateTonM3L',
title: '密度(吨/液态方)',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'rateTonGj',
title: '热值比(吨/GJ)',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'rateM3Gj',
title: '热值比(气态方/GJ)',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'rateTonM3',
title: '气化率(吨/气态方)',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'inspName',
title: '商检公司',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'note',
title: '备注',
componentType: 'input',
align: 'left',
sorter: true,
},
];
//表单事件
export const formEventConfigs = {
0: [
{
type: 'circle',
color: '#2774ff',
text: '开始节点',
icon: '#icon-kaishi',
bgcColor: '#D8E5FF',
isUserDefined: false,
},
{
color: '#F6AB01',
icon: '#icon-chushihua',
text: '初始化表单',
bgcColor: '#f9f5ea',
isUserDefined: false,
nodeInfo: { processEvent: [] },
},
],
1: [
{
color: '#B36EDB',
icon: '#icon-shujufenxi',
text: '获取表单数据',
detail: '(新增无此操作)',
bgcColor: '#F8F2FC',
isUserDefined: false,
nodeInfo: { processEvent: [] },
},
],
2: [
{
color: '#F8625C',
icon: '#icon-jiazai',
text: '加载表单',
bgcColor: '#FFF1F1',
isUserDefined: false,
nodeInfo: { processEvent: [] },
},
],
3: [
{
color: '#6C6AE0',
icon: '#icon-jsontijiao',
text: '提交表单',
bgcColor: '#F5F4FF',
isUserDefined: false,
nodeInfo: { processEvent: [] },
},
],
4: [
{
type: 'circle',
color: '#F8625C',
text: '结束节点',
icon: '#icon-jieshuzhiliao',
bgcColor: '#FFD6D6',
isLast: true,
isUserDefined: false,
},
],
};
export const formProps: FormProps = {
labelCol: { span: 3, offset: 0 },
labelAlign: 'right',
layout: 'horizontal',
size: 'default',
schemas: [
{
key: '3ae9c90410474669ba5bd53480e1b75b',
field: 'id',
label: 'id',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入id',
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: '308d9a66a67b4762a9120a9febfd3eb9',
field: 'dateMea',
label: '计量时间',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入计量时间',
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: '3df94eac56774f83bacdf6aea872cd2a',
field: 'typeCode',
label: '计量类型',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入计量类型',
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: '2ea1d9d61e544bd58ddb4883d8711f02',
field: 'qtyMmbtu',
label: '热值MMBtu',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入热值MMBtu',
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: 'b48b482dabab4a1ea6ea3064e3a1938b',
field: 'qtyGj',
label: '热值GJ',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入热值GJ',
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: '29ec78cc27d24e7d9bd766fb9f94de35',
field: 'qtyTon',
label: '重量(吨)',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入重量(吨)',
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: '215863caaaaf4a3eb5ba2d314cc3b218',
field: 'qtyM3L',
label: '液态体积(方)',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入液态体积(方)',
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: '85607cf5efe9483fb0f9ca0a3a0273ee',
field: 'qtyM3',
label: '气态体积(方)',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入气态体积(方)',
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: '49c82f8959a048e391b106539dd16363',
field: 'rateTonM3L',
label: '密度(吨/液态方)',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入密度(吨/液态方)',
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: 'f5cdcb155e9f42359ae26c8bdadacee9',
field: 'rateTonGj',
label: '热值比(吨/GJ)',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入热值比(吨/GJ)',
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: '0c0d7fe1be4942ed940a7dbe5a6d4a96',
field: 'rateM3Gj',
label: '热值比(气态方/GJ)',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入热值比(气态方/GJ)',
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: 'c4b147a273e14ff89a4966de18e1bd30',
field: 'rateTonM3',
label: '气化率(吨/气态方)',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入气化率(吨/气态方)',
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: '65cdc0bb9cbe42f28d94772465f6fe2e',
field: 'inspName',
label: '商检公司',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入商检公司',
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: 'a19c701d9daa4acdbdd8a70d72aa69dc',
field: 'note',
label: '备注',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入备注',
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
],
showActionButtonGroup: false,
buttonLocation: 'center',
actionColOptions: { span: 24 },
showResetButton: false,
showSubmitButton: false,
hiddenComponent: [],
};

View File

@ -0,0 +1,212 @@
export const permissionList = [
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: 'id',
fieldId: 'id',
isSubTable: false,
showChildren: true,
type: 'input',
key: '3ae9c90410474669ba5bd53480e1b75b',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '计量时间',
fieldId: 'dateMea',
isSubTable: false,
showChildren: true,
type: 'input',
key: '308d9a66a67b4762a9120a9febfd3eb9',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '计量类型',
fieldId: 'typeCode',
isSubTable: false,
showChildren: true,
type: 'input',
key: '3df94eac56774f83bacdf6aea872cd2a',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '热值MMBtu',
fieldId: 'qtyMmbtu',
isSubTable: false,
showChildren: true,
type: 'input',
key: '2ea1d9d61e544bd58ddb4883d8711f02',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '热值GJ',
fieldId: 'qtyGj',
isSubTable: false,
showChildren: true,
type: 'input',
key: 'b48b482dabab4a1ea6ea3064e3a1938b',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '重量(吨)',
fieldId: 'qtyTon',
isSubTable: false,
showChildren: true,
type: 'input',
key: '29ec78cc27d24e7d9bd766fb9f94de35',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '液态体积(方)',
fieldId: 'qtyM3L',
isSubTable: false,
showChildren: true,
type: 'input',
key: '215863caaaaf4a3eb5ba2d314cc3b218',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '气态体积(方)',
fieldId: 'qtyM3',
isSubTable: false,
showChildren: true,
type: 'input',
key: '85607cf5efe9483fb0f9ca0a3a0273ee',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '密度(吨/液态方)',
fieldId: 'rateTonM3L',
isSubTable: false,
showChildren: true,
type: 'input',
key: '49c82f8959a048e391b106539dd16363',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '热值比(吨/GJ)',
fieldId: 'rateTonGj',
isSubTable: false,
showChildren: true,
type: 'input',
key: 'f5cdcb155e9f42359ae26c8bdadacee9',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '热值比(气态方/GJ)',
fieldId: 'rateM3Gj',
isSubTable: false,
showChildren: true,
type: 'input',
key: '0c0d7fe1be4942ed940a7dbe5a6d4a96',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '气化率(吨/气态方)',
fieldId: 'rateTonM3',
isSubTable: false,
showChildren: true,
type: 'input',
key: 'c4b147a273e14ff89a4966de18e1bd30',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '商检公司',
fieldId: 'inspName',
isSubTable: false,
showChildren: true,
type: 'input',
key: '65cdc0bb9cbe42f28d94772465f6fe2e',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '备注',
fieldId: 'note',
isSubTable: false,
showChildren: true,
type: 'input',
key: 'a19c701d9daa4acdbdd8a70d72aa69dc',
children: [],
},
];

View File

@ -0,0 +1,308 @@
<template>
<PageWrapper dense fixedHeight contentFullHeight contentClass="flex">
<BasicTable @register="registerTable" ref="tableRef" @row-dbClick="dbClickRow">
<template #toolbar>
<template v-for="button in tableButtonConfig" :key="button.code">
<a-button v-if="button.isDefault" :type="button.type" @click="buttonClick(button.code)">
<template #icon><Icon :icon="button.icon" /></template>
{{ button.name }}
</a-button>
<a-button v-else :type="button.type">
<template #icon><Icon :icon="button.icon" /></template>
{{ button.name }}
</a-button>
</template>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.dataIndex === 'action'">
<TableAction :actions="getActions(record)" />
</template>
</template>
</BasicTable>
<MeaPurIntModal @register="registerModal" @success="handleSuccess" />
<DataLog :logId="logId" :logPath="logPath" v-model:visible="modalVisible"/>
</PageWrapper>
</template>
<script lang="ts" setup>
const modalVisible = ref(false);
const logId = ref('')
const logPath = ref('/ship/meaPurInt/datalog');
import { DataLog } from '/@/components/pcitc';
import { ref, computed, onMounted, onUnmounted, createVNode,
} from 'vue';
import { Modal } from 'ant-design-vue';
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
import { BasicTable, useTable, TableAction, ActionItem } from '/@/components/Table';
import { getLngMeaPurIntPage, deleteLngMeaPurInt} from '/@/api/ship/MeaPurInt';
import { PageWrapper } from '/@/components/Page';
import { useMessage } from '/@/hooks/web/useMessage';
import { useI18n } from '/@/hooks/web/useI18n';
import { usePermission } from '/@/hooks/web/usePermission';
import { useFormConfig } from '/@/hooks/web/useFormConfig';
import { useRouter } from 'vue-router';
import { setIndexFlowStatus } from '/@/utils/flow/index'
import { getLngMeaPurInt } from '/@/api/ship/MeaPurInt';
import { useModal } from '/@/components/Modal';
import MeaPurIntModal from './components/MeaPurIntModal.vue';
import {formConfig, searchFormSchema, columns } from './components/config';
import Icon from '/@/components/Icon/index';
import useEventBus from '/@/hooks/event/useEventBus';
import { cloneDeep } from 'lodash-es';
const { bus, CREATE_FLOW, FLOW_PROCESSED, FORM_LIST_MODIFIED } = useEventBus();
const { notification } = useMessage();
const { t } = useI18n();
defineEmits(['register']);
const { filterColumnAuth, filterButtonAuth } = usePermission();
const { mergeColumns,mergeSearchFormSchema,mergeButtons } = useFormConfig();
const filterColumns = cloneDeep(filterColumnAuth(columns));
const customConfigColums =ref(filterColumns);
const customSearchFormSchema =ref(searchFormSchema);
const tableRef = ref();
//所有按钮
const buttons = ref([{"name":"新增","code":"add","icon":"ant-design:plus-outlined","isDefault":true,"isUse":true},{"name":"编辑","code":"edit","icon":"ant-design:form-outlined","isDefault":true,"isUse":true},{"name":"刷新","code":"refresh","icon":"ant-design:reload-outlined","isDefault":true,"isUse":true},{"name":"查看","code":"view","icon":"ant-design:eye-outlined","isDefault":true,"isUse":true},{"name":"删除","code":"delete","icon":"ant-design:delete-outlined","isDefault":true,"isUse":true}]);
//展示在列表内的按钮
const actionButtons = ref<string[]>(['view', 'edit','datalog', 'copyData', 'delete', 'startwork','flowRecord']);
const buttonConfigs = computed(()=>{
return filterButtonAuth(buttons.value);
})
const tableButtonConfig = computed(() => {
return buttonConfigs.value?.filter((x) => !actionButtons.value.includes(x.code));
});
const actionButtonConfig = computed(() => {
return buttonConfigs.value?.filter((x) => actionButtons.value.includes(x.code));
});
const btnEvent = {add : handleAdd,edit : handleEdit,refresh : handleRefresh,view : handleView,delete : handleDelete,}
const { currentRoute } = useRouter();
const router = useRouter();
const formIdComputedRef = ref();
formIdComputedRef.value = currentRoute.value.meta.formId
const schemaIdComputedRef = ref();
schemaIdComputedRef.value = currentRoute.value.meta.schemaId
const [registerModal, { openModal }] = useModal();
const formName='国际采购计量';
const [registerTable, { reload, }] = useTable({
title: '' || (formName + '列表'),
api: getLngMeaPurIntPage,
rowKey: 'id',
columns: customConfigColums,
formConfig: {
rowProps: {
gutter: 16,
},
schemas: customSearchFormSchema,
fieldMapToTime: [],
showResetButton: false,
},
beforeFetch: (params) => {
return { ...params, FormId: formIdComputedRef.value, PK: 'id' };
},
afterFetch: (res) => {
tableRef.value.setToolBarWidth();
},
useSearchForm: true,
showTableSetting: true,
striped: false,
actionColumn: {
width: 160,
title: '操作',
dataIndex: 'action',
slots: { customRender: 'action' },
},
tableSetting: {
size: false,
setting: false,
},
});
function dbClickRow(record) {
if (!actionButtonConfig?.value.some(element => element.code == 'view')) {
return;
}
const { processId, taskIds, schemaId } = record.workflowData || {};
if (taskIds && taskIds.length) {
router.push({
path: '/flow/' + schemaId + '/' + (processId || '') + '/approveFlow',
query: {
taskId: taskIds[0],
formName: formName,
formId:currentRoute.value.meta.formId
}
});
} else if (schemaId && !taskIds && processId) {
router.push({
path: '/flow/' + schemaId + '/' + processId + '/approveFlow',
query: {
readonly: 1,
taskId: '',
formName: formName,
formId:currentRoute.value.meta.formId
}
});
} else {
router.push({
path: '/form/MeaPurInt/' + record.id + '/viewForm',
query: {
formPath: 'ship/MeaPurInt',
formName: formName,
formId:currentRoute.value.meta.formId
}
});
}
}
function buttonClick(code) {
btnEvent[code]();
}
function handleDatalog (record: Recordable) {
modalVisible.value = true
logId.value = record.id
}
function handleAdd() {
if (schemaIdComputedRef.value) {
router.push({
path: '/flow/' + schemaIdComputedRef.value + '/0/createFlow'
});
} else {
router.push({
path: '/form/MeaPurInt/0/createForm',
query: {
formPath: 'ship/MeaPurInt',
formName: formName,
formId:currentRoute.value.meta.formId
}
});
}
}
function handleEdit(record: Recordable) {
router.push({
path: '/form/MeaPurInt/' + record.id + '/updateForm',
query: {
formPath: 'ship/MeaPurInt',
formName: formName,
formId:currentRoute.value.meta.formId
}
});
}
function handleDelete(record: Recordable) {
deleteList([record.id]);
}
function deleteList(ids) {
Modal.confirm({
title: '提示信息',
icon: createVNode(ExclamationCircleOutlined),
content: '是否确认删除?',
okText: '确认',
cancelText: '取消',
onOk() {
deleteLngMeaPurInt(ids).then((_) => {
handleSuccess();
notification.success({
message: 'Tip',
description: t('删除成功!'),
});
});
},
onCancel() {},
});
}
function handleRefresh() {
reload();
}
function handleSuccess() {
reload();
}
function handleView(record: Recordable) {
dbClickRow(record);
}
onMounted(() => {
if (schemaIdComputedRef.value) {
bus.on(FLOW_PROCESSED, handleRefresh);
bus.on(CREATE_FLOW, handleRefresh);
} else {
bus.on(FORM_LIST_MODIFIED, handleRefresh);
}
// 合并渲染覆盖配置中的列表配置,包括展示字段配置、搜索字段配置、按钮配置
mergeCustomListRenderConfig();
});
onUnmounted(() => {
if (schemaIdComputedRef.value) {
bus.off(FLOW_PROCESSED, handleRefresh);
bus.off(CREATE_FLOW, handleRefresh);
} else {
bus.off(FORM_LIST_MODIFIED, handleRefresh);
}
});
function getActions(record: Recordable):ActionItem[] {
const actionsList: ActionItem[] = actionButtonConfig.value?.map((button) => {
if (!record.workflowData?.processId) {
return {
icon: button?.icon,
tooltip: button?.name,
color: button.code === 'delete' ? 'error' : undefined,
onClick: btnEvent[button.code].bind(null, record),
};
} else {
if (button.code === 'view') {
return {
icon: button?.icon,
tooltip: button?.name,
onClick: btnEvent[button.code].bind(null, record),
};
} else {
return {};
}
}
});
return actionsList;
}
async function mergeCustomListRenderConfig(){
if (formConfig.useCustomConfig) {
let formId=currentRoute.value.meta.formId;
//1.合并展示字段配置
let cols= await mergeColumns(customConfigColums.value,formId);
customConfigColums.value=cols;
//2.合并搜索字段配置
let sFormSchema= await mergeSearchFormSchema(customSearchFormSchema.value,formId);
customSearchFormSchema.value=sFormSchema;
//3.合并按钮配置
let btns= await mergeButtons(buttons.value,formId);
buttons.value=btns;
}
};
</script>
<style lang="less" scoped>
:deep(.ant-table-selection-col) {
width: 50px;
}
.show{
display: flex;
}
.hide{
display: none !important;
}
</style>

View File

@ -0,0 +1,224 @@
<template>
<SimpleForm
ref="systemFormRef"
:formProps="data.formDataProps"
:formModel="{}"
:isWorkFlow="props.fromPage!=FromPageType.MENU"
/>
</template>
<script lang="ts" setup>
import { reactive, ref,onBeforeMount,onMounted } from 'vue';
import { formProps, formEventConfigs ,formConfig} from './config';
import SimpleForm from '/@/components/SimpleForm/src/SimpleForm.vue';
import { addLngOpsPurInt, getLngOpsPurInt, updateLngOpsPurInt, deleteLngOpsPurInt } from '/@/api/ship/OpsPurInt';
import { cloneDeep } from 'lodash-es';
import { FormDataProps } from '/@/components/Designer/src/types';
import { usePermission } from '/@/hooks/web/usePermission';
import { useFormConfig } from '/@/hooks/web/useFormConfig';
import { FromPageType } from '/@/enums/workflowEnum';
import { createFormEvent, getFormDataEvent, loadFormEvent, submitFormEvent,} from '/@/hooks/web/useFormEvent';
import { changeWorkFlowForm, changeSchemaDisabled } from '/@/hooks/web/useWorkFlowForm';
import { WorkFlowFormParams } from '/@/model/workflow/bpmnConfig';
import { useRouter } from 'vue-router';
const { filterFormSchemaAuth } = usePermission();
const { mergeFormSchemas,mergeFormEventConfigs } = useFormConfig();
const { currentRoute } = useRouter();
const RowKey = 'id';
const emits = defineEmits(['changeUploadComponentIds','loadingCompleted', 'form-mounted']);
const props = defineProps({
fromPage: {
type: Number,
default: FromPageType.MENU,
},
});
const systemFormRef = ref();
const data: { formDataProps: FormDataProps } = reactive({
formDataProps: {schemas:[]} as FormDataProps,
});
const state = reactive({
formModel: {},
});
let customFormEventConfigs=[];
onMounted(async () => {
try {
// 合并渲染覆盖配置中的字段配置、表单事件配置
await mergeCustomFormRenderConfig();
if (props.fromPage == FromPageType.MENU) {
setMenuPermission();
await createFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:初始化表单
await loadFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:加载表单
} else if (props.fromPage == FromPageType.FLOW) {
emits('loadingCompleted'); //告诉系统表单已经加载完毕
// loadingCompleted后 工作流页面直接利用Ref调用setWorkFlowForm方法
} else if (props.fromPage == FromPageType.PREVIEW) {
// 预览 无需权限,表单事件也无需执行
} else if (props.fromPage == FromPageType.DESKTOP) {
// 桌面设计 表单事件需要执行
emits('loadingCompleted'); //告诉系统表单已经加载完毕
await createFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:初始化表单
await loadFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:加载表单
}
emits('form-mounted', formProps);
} catch (error) {
}
});
async function mergeCustomFormRenderConfig() {
let cloneProps=cloneDeep(formProps);
let fEventConfigs=cloneDeep(formEventConfigs);
if (formConfig.useCustomConfig) {
if(props.fromPage !== FromPageType.FLOW){
let formPath=currentRoute.value.query.formPath;
//1.合并字段配置
cloneProps.schemas=await mergeFormSchemas({formSchema:cloneProps.schemas!,formPath:formPath});
//2.合并表单事件配置
fEventConfigs=await mergeFormEventConfigs({formEventConfigs:fEventConfigs,formPath:formPath});
}
}
data.formDataProps=cloneProps;
customFormEventConfigs=fEventConfigs;
}
// 根据菜单页面权限,设置表单属性(必填,禁用,显示)
function setMenuPermission() {
data.formDataProps.schemas = filterFormSchemaAuth(data.formDataProps.schemas!);
}
// 校验form 通过返回表单数据
async function validate() {
let values = [];
try {
values = await systemFormRef.value?.validate();
//添加隐藏组件
if (data.formDataProps.hiddenComponent?.length) {
data.formDataProps.hiddenComponent.forEach((component) => {
values[component.bindField] = component.value;
});
}
} finally {
}
return values;
}
// 根据行唯一ID查询行数据并设置表单数据 【编辑】
async function setFormDataFromId(rowId, skipUpdate) {
try {
const record = await getLngOpsPurInt(rowId);
if (skipUpdate) {
return record;
}
setFieldsValue(record);
state.formModel = record;
await getFormDataEvent(customFormEventConfigs, state.formModel, systemFormRef.value, formProps.schemas); //表单事件:获取表单数据
return record;
} catch (error) {
}
}
// 辅助设置表单数据
function setFieldsValue(record) {
systemFormRef.value.setFieldsValue(record);
}
// 重置表单数据
async function resetFields() {
await systemFormRef.value.resetFields();
}
// 设置表单数据全部为Disabled 【查看】
async function setDisabledForm(isDisabled) {
data.formDataProps.schemas = changeSchemaDisabled(cloneDeep(data.formDataProps.schemas),isDisabled);
}
// 获取行键值
function getRowKey() {
return RowKey;
}
// 更新api表单数据
async function update({ values, rowId }) {
try {
values[RowKey] = rowId;
state.formModel = values;
let saveVal = await updateLngOpsPurInt(values);
await submitFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:提交表单
return saveVal;
} catch (error) {}
}
// 新增api表单数据
async function add(values) {
try {
state.formModel = values;
let saveVal = await addLngOpsPurInt(values);
await submitFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:提交表单
return saveVal;
} catch (error) {}
}
// 根据工作流页面权限,设置表单属性(必填,禁用,显示)
async function setWorkFlowForm(obj: WorkFlowFormParams) {
try {
const cloneProps=cloneDeep(formProps);
customFormEventConfigs=cloneDeep(formEventConfigs);
if (formConfig.useCustomConfig) {
const parts = obj.formConfigKey.split('_');
const formId=parts[1];
cloneProps.schemas=await mergeFormSchemas({formSchema:cloneProps.schemas!,formId:formId});
customFormEventConfigs=await mergeFormEventConfigs({formEventConfigs:customFormEventConfigs,formId:formId});
}
let flowData = changeWorkFlowForm(cloneProps, obj);
let { buildOptionJson, uploadComponentIds, formModels, isViewProcess } = flowData;
data.formDataProps = buildOptionJson;
emits('changeUploadComponentIds', uploadComponentIds); //工作流中必须保存上传组件id【附件汇总需要】
if (isViewProcess) {
setDisabledForm(); //查看
}
state.formModel = formModels;
if(formModels[RowKey]) {
setFormDataFromId(formModels[RowKey], false)
} else {
setFieldsValue(formModels)
}
} catch (error) {}
await createFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:初始化表单
await loadFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:加载表单
}
function getFormModel() {
return systemFormRef.value.formModel
}
async function handleDelete(id) {
return await deleteLngOpsPurInt([id]);
}
defineExpose({
setFieldsValue,
resetFields,
validate,
add,
update,
setFormDataFromId,
setDisabledForm,
setMenuPermission,
setWorkFlowForm,
getRowKey,
getFormModel,
handleDelete
});
</script>

View File

@ -0,0 +1,110 @@
<template>
<BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" @cancel="handleClose" :paddingRight="15" :bodyStyle="{ minHeight: '400px !important' }">
<ModalForm ref="formRef" :fromPage="FromPageType.MENU" />
</BasicModal>
</template>
<script lang="ts" setup>
import { ref, computed, reactive } from 'vue';
import { BasicModal, useModalInner } from '/@/components/Modal';
import { useMessage } from '/@/hooks/web/useMessage';
import { useI18n } from '/@/hooks/web/useI18n';
import { formProps } from './config';
import ModalForm from './Form.vue';
import { FromPageType } from '/@/enums/workflowEnum';
const emit = defineEmits(['success', 'register']);
const { notification } = useMessage();
const formRef = ref();
const state = reactive({
formModel: {},
isUpdate: true,
isView: false,
isCopy: false,
rowId: '',
});
const { t } = useI18n();
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
state.isUpdate = !!data?.isUpdate;
state.isView = !!data?.isView;
state.isCopy = !!data?.isCopy;
setModalProps({
destroyOnClose: true,
maskClosable: false,
showCancelBtn: !state.isView,
showOkBtn: !state.isView,
canFullscreen: true,
width: 900,
});
if (state.isUpdate || state.isView || state.isCopy) {
state.rowId = data.id;
if (state.isView) {
await formRef.value.setDisabledForm();
}
await formRef.value.setFormDataFromId(state.rowId);
} else {
formRef.value.resetFields();
}
});
const getTitle = computed(() => (state.isView ? '查看' : !state.isUpdate ? '新增' : '编辑'));
async function saveModal() {
let saveSuccess = false;
try {
const values = await formRef.value?.validate();
//添加隐藏组件
if (formProps.hiddenComponent?.length) {
formProps.hiddenComponent.forEach((component) => {
values[component.bindField] = component.value;
});
}
if (values !== false) {
try {
if (!state.isUpdate || state.isCopy) {
saveSuccess = await formRef.value.add(values);
} else {
saveSuccess = await formRef.value.update({ values, rowId: state.rowId });
}
return saveSuccess;
} catch (error) {}
}
} catch (error) {
return saveSuccess;
}
}
async function handleSubmit() {
try {
const saveSuccess = await saveModal();
setModalProps({ confirmLoading: true });
if (saveSuccess) {
if (!state.isUpdate || state.isCopy) {
//false 新增
notification.success({
message: 'Tip',
description: t('新增成功!'),
}); //提示消息
} else {
notification.success({
message: 'Tip',
description: t('修改成功!'),
}); //提示消息
}
closeModal();
formRef.value.resetFields();
emit('success');
}
} finally {
setModalProps({ confirmLoading: false });
}
}
function handleClose() {
formRef.value.resetFields();
}
</script>

View File

@ -0,0 +1,520 @@
import { FormProps, FormSchema } from '/@/components/Form';
import { BasicColumn } from '/@/components/Table';
export const formConfig = {
useCustomConfig: false,
};
export const searchFormSchema: FormSchema[] = [
{
field: 'id',
label: 'id',
component: 'Input',
},
{
field: 'ssNo',
label: '船期编号',
component: 'Input',
},
{
field: 'kId',
label: '合同',
component: 'Input',
},
{
field: 'longSpotCode',
label: '长协/现货',
component: 'Input',
},
{
field: 'comId',
label: '交易主体',
component: 'Input',
},
{
field: 'dateEta',
label: '卸港ETA',
component: 'Input',
},
{
field: 'staCode',
label: '接收站',
component: 'Input',
},
{
field: 'suName',
label: '供应商',
component: 'Input',
},
{
field: 'ssTypeCode',
label: '业务类型',
component: 'Input',
},
];
export const columns: BasicColumn[] = [
{
dataIndex: 'id',
title: 'id',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'ssNo',
title: '船期编号',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'kId',
title: '合同',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'longSpotCode',
title: '长协/现货',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'comId',
title: '交易主体',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'dateEta',
title: '卸港ETA',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'staCode',
title: '接收站',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'suName',
title: '供应商',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'ssTypeCode',
title: '业务类型',
componentType: 'input',
align: 'left',
sorter: true,
},
];
//表单事件
export const formEventConfigs = {
0: [
{
type: 'circle',
color: '#2774ff',
text: '开始节点',
icon: '#icon-kaishi',
bgcColor: '#D8E5FF',
isUserDefined: false,
},
{
color: '#F6AB01',
icon: '#icon-chushihua',
text: '初始化表单',
bgcColor: '#f9f5ea',
isUserDefined: false,
nodeInfo: { processEvent: [] },
},
],
1: [
{
color: '#B36EDB',
icon: '#icon-shujufenxi',
text: '获取表单数据',
detail: '(新增无此操作)',
bgcColor: '#F8F2FC',
isUserDefined: false,
nodeInfo: { processEvent: [] },
},
],
2: [
{
color: '#F8625C',
icon: '#icon-jiazai',
text: '加载表单',
bgcColor: '#FFF1F1',
isUserDefined: false,
nodeInfo: { processEvent: [] },
},
],
3: [
{
color: '#6C6AE0',
icon: '#icon-jsontijiao',
text: '提交表单',
bgcColor: '#F5F4FF',
isUserDefined: false,
nodeInfo: { processEvent: [] },
},
],
4: [
{
type: 'circle',
color: '#F8625C',
text: '结束节点',
icon: '#icon-jieshuzhiliao',
bgcColor: '#FFD6D6',
isLast: true,
isUserDefined: false,
},
],
};
export const formProps: FormProps = {
labelCol: { span: 3, offset: 0 },
labelAlign: 'right',
layout: 'horizontal',
size: 'default',
schemas: [
{
key: '747fffbaf6f047bd8c58dd35996bfded',
field: 'id',
label: 'id',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入id',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: 'ac48af371e454a0092a92723479c8423',
field: 'ssNo',
label: '船期编号',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入船期编号',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: '0c59bc923f7d42ee9e64985f445d4e14',
field: 'kId',
label: '合同',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入合同',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: '6f86351503794cf0b17296c49beae2ee',
field: 'longSpotCode',
label: '长协/现货',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入长协/现货',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: '14618367d87849e6b5ca1163adb633fc',
field: 'comId',
label: '交易主体',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入交易主体',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: '4a1f6263b59b4363a8584cbeeaa70add',
field: 'dateEta',
label: '卸港ETA',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入卸港ETA',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: 'd934a9e60d7f49688966349ac81aa84b',
field: 'staCode',
label: '接收站',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入接收站',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: '89ecce1f60c041f5b381cf24455011e9',
field: 'suName',
label: '供应商',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入供应商',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: '7bfdfd702e1b479d968b599c3c49bcbf',
field: 'ssTypeCode',
label: '业务类型',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入业务类型',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
],
showActionButtonGroup: false,
buttonLocation: 'center',
actionColOptions: { span: 24 },
showResetButton: false,
showSubmitButton: false,
hiddenComponent: [],
};

View File

@ -0,0 +1,137 @@
export const permissionList = [
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: 'id',
fieldId: 'id',
isSubTable: false,
showChildren: true,
type: 'input',
key: '747fffbaf6f047bd8c58dd35996bfded',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '船期编号',
fieldId: 'ssNo',
isSubTable: false,
showChildren: true,
type: 'input',
key: 'ac48af371e454a0092a92723479c8423',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '合同',
fieldId: 'kId',
isSubTable: false,
showChildren: true,
type: 'input',
key: '0c59bc923f7d42ee9e64985f445d4e14',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '长协/现货',
fieldId: 'longSpotCode',
isSubTable: false,
showChildren: true,
type: 'input',
key: '6f86351503794cf0b17296c49beae2ee',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '交易主体',
fieldId: 'comId',
isSubTable: false,
showChildren: true,
type: 'input',
key: '14618367d87849e6b5ca1163adb633fc',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '卸港ETA',
fieldId: 'dateEta',
isSubTable: false,
showChildren: true,
type: 'input',
key: '4a1f6263b59b4363a8584cbeeaa70add',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '接收站',
fieldId: 'staCode',
isSubTable: false,
showChildren: true,
type: 'input',
key: 'd934a9e60d7f49688966349ac81aa84b',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '供应商',
fieldId: 'suName',
isSubTable: false,
showChildren: true,
type: 'input',
key: '89ecce1f60c041f5b381cf24455011e9',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '业务类型',
fieldId: 'ssTypeCode',
isSubTable: false,
showChildren: true,
type: 'input',
key: '7bfdfd702e1b479d968b599c3c49bcbf',
children: [],
},
];

View File

@ -0,0 +1,308 @@
<template>
<PageWrapper dense fixedHeight contentFullHeight contentClass="flex">
<BasicTable @register="registerTable" ref="tableRef" @row-dbClick="dbClickRow">
<template #toolbar>
<template v-for="button in tableButtonConfig" :key="button.code">
<a-button v-if="button.isDefault" :type="button.type" @click="buttonClick(button.code)">
<template #icon><Icon :icon="button.icon" /></template>
{{ button.name }}
</a-button>
<a-button v-else :type="button.type">
<template #icon><Icon :icon="button.icon" /></template>
{{ button.name }}
</a-button>
</template>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.dataIndex === 'action'">
<TableAction :actions="getActions(record)" />
</template>
</template>
</BasicTable>
<OpsPurIntModal @register="registerModal" @success="handleSuccess" />
<DataLog :logId="logId" :logPath="logPath" v-model:visible="modalVisible"/>
</PageWrapper>
</template>
<script lang="ts" setup>
const modalVisible = ref(false);
const logId = ref('')
const logPath = ref('/ship/opsPurInt/datalog');
import { DataLog } from '/@/components/pcitc';
import { ref, computed, onMounted, onUnmounted, createVNode,
} from 'vue';
import { Modal } from 'ant-design-vue';
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
import { BasicTable, useTable, TableAction, ActionItem } from '/@/components/Table';
import { getLngOpsPurIntPage, deleteLngOpsPurInt} from '/@/api/ship/OpsPurInt';
import { PageWrapper } from '/@/components/Page';
import { useMessage } from '/@/hooks/web/useMessage';
import { useI18n } from '/@/hooks/web/useI18n';
import { usePermission } from '/@/hooks/web/usePermission';
import { useFormConfig } from '/@/hooks/web/useFormConfig';
import { useRouter } from 'vue-router';
import { setIndexFlowStatus } from '/@/utils/flow/index'
import { getLngOpsPurInt } from '/@/api/ship/OpsPurInt';
import { useModal } from '/@/components/Modal';
import OpsPurIntModal from './components/OpsPurIntModal.vue';
import {formConfig, searchFormSchema, columns } from './components/config';
import Icon from '/@/components/Icon/index';
import useEventBus from '/@/hooks/event/useEventBus';
import { cloneDeep } from 'lodash-es';
const { bus, CREATE_FLOW, FLOW_PROCESSED, FORM_LIST_MODIFIED } = useEventBus();
const { notification } = useMessage();
const { t } = useI18n();
defineEmits(['register']);
const { filterColumnAuth, filterButtonAuth } = usePermission();
const { mergeColumns,mergeSearchFormSchema,mergeButtons } = useFormConfig();
const filterColumns = cloneDeep(filterColumnAuth(columns));
const customConfigColums =ref(filterColumns);
const customSearchFormSchema =ref(searchFormSchema);
const tableRef = ref();
//所有按钮
const buttons = ref([{"isUse":true,"name":"新增","code":"add","icon":"ant-design:plus-outlined","isDefault":true,"type":"primary"},{"isUse":true,"name":"编辑","code":"edit","icon":"ant-design:form-outlined","isDefault":true},{"isUse":true,"name":"刷新","code":"refresh","icon":"ant-design:reload-outlined","isDefault":true},{"isUse":true,"name":"查看","code":"view","icon":"ant-design:eye-outlined","isDefault":true},{"isUse":true,"name":"数据日志","code":"datalog","icon":"ant-design:profile-outlined","isDefault":true},{"isUse":true,"name":"删除","code":"delete","icon":"ant-design:delete-outlined","isDefault":true}]);
//展示在列表内的按钮
const actionButtons = ref<string[]>(['view', 'edit','datalog', 'copyData', 'delete', 'startwork','flowRecord']);
const buttonConfigs = computed(()=>{
return filterButtonAuth(buttons.value);
})
const tableButtonConfig = computed(() => {
return buttonConfigs.value?.filter((x) => !actionButtons.value.includes(x.code));
});
const actionButtonConfig = computed(() => {
return buttonConfigs.value?.filter((x) => actionButtons.value.includes(x.code));
});
const btnEvent = {add : handleAdd,edit : handleEdit,refresh : handleRefresh,view : handleView,datalog : handleDatalog,delete : handleDelete,}
const { currentRoute } = useRouter();
const router = useRouter();
const formIdComputedRef = ref();
formIdComputedRef.value = currentRoute.value.meta.formId
const schemaIdComputedRef = ref();
schemaIdComputedRef.value = currentRoute.value.meta.schemaId
const [registerModal, { openModal }] = useModal();
const formName='采购执行';
const [registerTable, { reload, }] = useTable({
title: '' || (formName + '列表'),
api: getLngOpsPurIntPage,
rowKey: 'id',
columns: customConfigColums,
formConfig: {
rowProps: {
gutter: 16,
},
schemas: customSearchFormSchema,
fieldMapToTime: [],
showResetButton: false,
},
beforeFetch: (params) => {
return { ...params, FormId: formIdComputedRef.value, PK: 'id' };
},
afterFetch: (res) => {
tableRef.value.setToolBarWidth();
},
useSearchForm: true,
showTableSetting: true,
striped: false,
actionColumn: {
width: 160,
title: '操作',
dataIndex: 'action',
slots: { customRender: 'action' },
},
tableSetting: {
size: false,
setting: false,
},
});
function dbClickRow(record) {
if (!actionButtonConfig?.value.some(element => element.code == 'view')) {
return;
}
const { processId, taskIds, schemaId } = record.workflowData || {};
if (taskIds && taskIds.length) {
router.push({
path: '/flow/' + schemaId + '/' + (processId || '') + '/approveFlow',
query: {
taskId: taskIds[0],
formName: formName,
formId:currentRoute.value.meta.formId
}
});
} else if (schemaId && !taskIds && processId) {
router.push({
path: '/flow/' + schemaId + '/' + processId + '/approveFlow',
query: {
readonly: 1,
taskId: '',
formName: formName,
formId:currentRoute.value.meta.formId
}
});
} else {
router.push({
path: '/form/OpsPurInt/' + record.id + '/viewForm',
query: {
formPath: 'ship/OpsPurInt',
formName: formName,
formId:currentRoute.value.meta.formId
}
});
}
}
function buttonClick(code) {
btnEvent[code]();
}
function handleDatalog (record: Recordable) {
modalVisible.value = true
logId.value = record.id
}
function handleAdd() {
if (schemaIdComputedRef.value) {
router.push({
path: '/flow/' + schemaIdComputedRef.value + '/0/createFlow'
});
} else {
router.push({
path: '/form/OpsPurInt/0/createForm',
query: {
formPath: 'ship/OpsPurInt',
formName: formName,
formId:currentRoute.value.meta.formId
}
});
}
}
function handleEdit(record: Recordable) {
router.push({
path: '/form/OpsPurInt/' + record.id + '/updateForm',
query: {
formPath: 'ship/OpsPurInt',
formName: formName,
formId:currentRoute.value.meta.formId
}
});
}
function handleDelete(record: Recordable) {
deleteList([record.id]);
}
function deleteList(ids) {
Modal.confirm({
title: '提示信息',
icon: createVNode(ExclamationCircleOutlined),
content: '是否确认删除?',
okText: '确认',
cancelText: '取消',
onOk() {
deleteLngOpsPurInt(ids).then((_) => {
handleSuccess();
notification.success({
message: 'Tip',
description: t('删除成功!'),
});
});
},
onCancel() {},
});
}
function handleRefresh() {
reload();
}
function handleSuccess() {
reload();
}
function handleView(record: Recordable) {
dbClickRow(record);
}
onMounted(() => {
if (schemaIdComputedRef.value) {
bus.on(FLOW_PROCESSED, handleRefresh);
bus.on(CREATE_FLOW, handleRefresh);
} else {
bus.on(FORM_LIST_MODIFIED, handleRefresh);
}
// 合并渲染覆盖配置中的列表配置,包括展示字段配置、搜索字段配置、按钮配置
mergeCustomListRenderConfig();
});
onUnmounted(() => {
if (schemaIdComputedRef.value) {
bus.off(FLOW_PROCESSED, handleRefresh);
bus.off(CREATE_FLOW, handleRefresh);
} else {
bus.off(FORM_LIST_MODIFIED, handleRefresh);
}
});
function getActions(record: Recordable):ActionItem[] {
const actionsList: ActionItem[] = actionButtonConfig.value?.map((button) => {
if (!record.workflowData?.processId) {
return {
icon: button?.icon,
tooltip: button?.name,
color: button.code === 'delete' ? 'error' : undefined,
onClick: btnEvent[button.code].bind(null, record),
};
} else {
if (button.code === 'view') {
return {
icon: button?.icon,
tooltip: button?.name,
onClick: btnEvent[button.code].bind(null, record),
};
} else {
return {};
}
}
});
return actionsList;
}
async function mergeCustomListRenderConfig(){
if (formConfig.useCustomConfig) {
let formId=currentRoute.value.meta.formId;
//1.合并展示字段配置
let cols= await mergeColumns(customConfigColums.value,formId);
customConfigColums.value=cols;
//2.合并搜索字段配置
let sFormSchema= await mergeSearchFormSchema(customSearchFormSchema.value,formId);
customSearchFormSchema.value=sFormSchema;
//3.合并按钮配置
let btns= await mergeButtons(buttons.value,formId);
buttons.value=btns;
}
};
</script>
<style lang="less" scoped>
:deep(.ant-table-selection-col) {
width: 50px;
}
.show{
display: flex;
}
.hide{
display: none !important;
}
</style>

View File

@ -0,0 +1,224 @@
<template>
<SimpleForm
ref="systemFormRef"
:formProps="data.formDataProps"
:formModel="{}"
:isWorkFlow="props.fromPage!=FromPageType.MENU"
/>
</template>
<script lang="ts" setup>
import { reactive, ref,onBeforeMount,onMounted } from 'vue';
import { formProps, formEventConfigs ,formConfig} from './config';
import SimpleForm from '/@/components/SimpleForm/src/SimpleForm.vue';
import { addLngOpsSalesInt, getLngOpsSalesInt, updateLngOpsSalesInt, deleteLngOpsSalesInt } from '/@/api/ship/OpsSalesInt';
import { cloneDeep } from 'lodash-es';
import { FormDataProps } from '/@/components/Designer/src/types';
import { usePermission } from '/@/hooks/web/usePermission';
import { useFormConfig } from '/@/hooks/web/useFormConfig';
import { FromPageType } from '/@/enums/workflowEnum';
import { createFormEvent, getFormDataEvent, loadFormEvent, submitFormEvent,} from '/@/hooks/web/useFormEvent';
import { changeWorkFlowForm, changeSchemaDisabled } from '/@/hooks/web/useWorkFlowForm';
import { WorkFlowFormParams } from '/@/model/workflow/bpmnConfig';
import { useRouter } from 'vue-router';
const { filterFormSchemaAuth } = usePermission();
const { mergeFormSchemas,mergeFormEventConfigs } = useFormConfig();
const { currentRoute } = useRouter();
const RowKey = 'id';
const emits = defineEmits(['changeUploadComponentIds','loadingCompleted', 'form-mounted']);
const props = defineProps({
fromPage: {
type: Number,
default: FromPageType.MENU,
},
});
const systemFormRef = ref();
const data: { formDataProps: FormDataProps } = reactive({
formDataProps: {schemas:[]} as FormDataProps,
});
const state = reactive({
formModel: {},
});
let customFormEventConfigs=[];
onMounted(async () => {
try {
// 合并渲染覆盖配置中的字段配置、表单事件配置
await mergeCustomFormRenderConfig();
if (props.fromPage == FromPageType.MENU) {
setMenuPermission();
await createFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:初始化表单
await loadFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:加载表单
} else if (props.fromPage == FromPageType.FLOW) {
emits('loadingCompleted'); //告诉系统表单已经加载完毕
// loadingCompleted后 工作流页面直接利用Ref调用setWorkFlowForm方法
} else if (props.fromPage == FromPageType.PREVIEW) {
// 预览 无需权限,表单事件也无需执行
} else if (props.fromPage == FromPageType.DESKTOP) {
// 桌面设计 表单事件需要执行
emits('loadingCompleted'); //告诉系统表单已经加载完毕
await createFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:初始化表单
await loadFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:加载表单
}
emits('form-mounted', formProps);
} catch (error) {
}
});
async function mergeCustomFormRenderConfig() {
let cloneProps=cloneDeep(formProps);
let fEventConfigs=cloneDeep(formEventConfigs);
if (formConfig.useCustomConfig) {
if(props.fromPage !== FromPageType.FLOW){
let formPath=currentRoute.value.query.formPath;
//1.合并字段配置
cloneProps.schemas=await mergeFormSchemas({formSchema:cloneProps.schemas!,formPath:formPath});
//2.合并表单事件配置
fEventConfigs=await mergeFormEventConfigs({formEventConfigs:fEventConfigs,formPath:formPath});
}
}
data.formDataProps=cloneProps;
customFormEventConfigs=fEventConfigs;
}
// 根据菜单页面权限,设置表单属性(必填,禁用,显示)
function setMenuPermission() {
data.formDataProps.schemas = filterFormSchemaAuth(data.formDataProps.schemas!);
}
// 校验form 通过返回表单数据
async function validate() {
let values = [];
try {
values = await systemFormRef.value?.validate();
//添加隐藏组件
if (data.formDataProps.hiddenComponent?.length) {
data.formDataProps.hiddenComponent.forEach((component) => {
values[component.bindField] = component.value;
});
}
} finally {
}
return values;
}
// 根据行唯一ID查询行数据并设置表单数据 【编辑】
async function setFormDataFromId(rowId, skipUpdate) {
try {
const record = await getLngOpsSalesInt(rowId);
if (skipUpdate) {
return record;
}
setFieldsValue(record);
state.formModel = record;
await getFormDataEvent(customFormEventConfigs, state.formModel, systemFormRef.value, formProps.schemas); //表单事件:获取表单数据
return record;
} catch (error) {
}
}
// 辅助设置表单数据
function setFieldsValue(record) {
systemFormRef.value.setFieldsValue(record);
}
// 重置表单数据
async function resetFields() {
await systemFormRef.value.resetFields();
}
// 设置表单数据全部为Disabled 【查看】
async function setDisabledForm(isDisabled) {
data.formDataProps.schemas = changeSchemaDisabled(cloneDeep(data.formDataProps.schemas),isDisabled);
}
// 获取行键值
function getRowKey() {
return RowKey;
}
// 更新api表单数据
async function update({ values, rowId }) {
try {
values[RowKey] = rowId;
state.formModel = values;
let saveVal = await updateLngOpsSalesInt(values);
await submitFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:提交表单
return saveVal;
} catch (error) {}
}
// 新增api表单数据
async function add(values) {
try {
state.formModel = values;
let saveVal = await addLngOpsSalesInt(values);
await submitFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:提交表单
return saveVal;
} catch (error) {}
}
// 根据工作流页面权限,设置表单属性(必填,禁用,显示)
async function setWorkFlowForm(obj: WorkFlowFormParams) {
try {
const cloneProps=cloneDeep(formProps);
customFormEventConfigs=cloneDeep(formEventConfigs);
if (formConfig.useCustomConfig) {
const parts = obj.formConfigKey.split('_');
const formId=parts[1];
cloneProps.schemas=await mergeFormSchemas({formSchema:cloneProps.schemas!,formId:formId});
customFormEventConfigs=await mergeFormEventConfigs({formEventConfigs:customFormEventConfigs,formId:formId});
}
let flowData = changeWorkFlowForm(cloneProps, obj);
let { buildOptionJson, uploadComponentIds, formModels, isViewProcess } = flowData;
data.formDataProps = buildOptionJson;
emits('changeUploadComponentIds', uploadComponentIds); //工作流中必须保存上传组件id【附件汇总需要】
if (isViewProcess) {
setDisabledForm(); //查看
}
state.formModel = formModels;
if(formModels[RowKey]) {
setFormDataFromId(formModels[RowKey], false)
} else {
setFieldsValue(formModels)
}
} catch (error) {}
await createFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:初始化表单
await loadFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:加载表单
}
function getFormModel() {
return systemFormRef.value.formModel
}
async function handleDelete(id) {
return await deleteLngOpsSalesInt([id]);
}
defineExpose({
setFieldsValue,
resetFields,
validate,
add,
update,
setFormDataFromId,
setDisabledForm,
setMenuPermission,
setWorkFlowForm,
getRowKey,
getFormModel,
handleDelete
});
</script>

View File

@ -0,0 +1,110 @@
<template>
<BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" @cancel="handleClose" :paddingRight="15" :bodyStyle="{ minHeight: '400px !important' }">
<ModalForm ref="formRef" :fromPage="FromPageType.MENU" />
</BasicModal>
</template>
<script lang="ts" setup>
import { ref, computed, reactive } from 'vue';
import { BasicModal, useModalInner } from '/@/components/Modal';
import { useMessage } from '/@/hooks/web/useMessage';
import { useI18n } from '/@/hooks/web/useI18n';
import { formProps } from './config';
import ModalForm from './Form.vue';
import { FromPageType } from '/@/enums/workflowEnum';
const emit = defineEmits(['success', 'register']);
const { notification } = useMessage();
const formRef = ref();
const state = reactive({
formModel: {},
isUpdate: true,
isView: false,
isCopy: false,
rowId: '',
});
const { t } = useI18n();
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
state.isUpdate = !!data?.isUpdate;
state.isView = !!data?.isView;
state.isCopy = !!data?.isCopy;
setModalProps({
destroyOnClose: true,
maskClosable: false,
showCancelBtn: !state.isView,
showOkBtn: !state.isView,
canFullscreen: true,
width: 900,
});
if (state.isUpdate || state.isView || state.isCopy) {
state.rowId = data.id;
if (state.isView) {
await formRef.value.setDisabledForm();
}
await formRef.value.setFormDataFromId(state.rowId);
} else {
formRef.value.resetFields();
}
});
const getTitle = computed(() => (state.isView ? '查看' : !state.isUpdate ? '新增' : '编辑'));
async function saveModal() {
let saveSuccess = false;
try {
const values = await formRef.value?.validate();
//添加隐藏组件
if (formProps.hiddenComponent?.length) {
formProps.hiddenComponent.forEach((component) => {
values[component.bindField] = component.value;
});
}
if (values !== false) {
try {
if (!state.isUpdate || state.isCopy) {
saveSuccess = await formRef.value.add(values);
} else {
saveSuccess = await formRef.value.update({ values, rowId: state.rowId });
}
return saveSuccess;
} catch (error) {}
}
} catch (error) {
return saveSuccess;
}
}
async function handleSubmit() {
try {
const saveSuccess = await saveModal();
setModalProps({ confirmLoading: true });
if (saveSuccess) {
if (!state.isUpdate || state.isCopy) {
//false 新增
notification.success({
message: 'Tip',
description: t('新增成功!'),
}); //提示消息
} else {
notification.success({
message: 'Tip',
description: t('修改成功!'),
}); //提示消息
}
closeModal();
formRef.value.resetFields();
emit('success');
}
} finally {
setModalProps({ confirmLoading: false });
}
}
function handleClose() {
formRef.value.resetFields();
}
</script>

View File

@ -0,0 +1,472 @@
import { FormProps, FormSchema } from '/@/components/Form';
import { BasicColumn } from '/@/components/Table';
export const formConfig = {
useCustomConfig: false,
};
export const searchFormSchema: FormSchema[] = [
{
field: 'id',
label: 'id',
component: 'Input',
},
{
field: 'ssNo',
label: '船期编号',
component: 'Input',
},
{
field: 'kId',
label: '合同',
component: 'Input',
},
{
field: 'longSpotCode',
label: '长协/现货',
component: 'Input',
},
{
field: 'comId',
label: '交易主体',
component: 'Input',
},
{
field: 'dateEta',
label: '卸港ETA',
component: 'Input',
},
{
field: 'portUnloading1Code',
label: '卸港港口',
component: 'Input',
},
{
field: 'cuName',
label: '客户',
component: 'Input',
},
];
export const columns: BasicColumn[] = [
{
dataIndex: 'id',
title: 'id',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'ssNo',
title: '船期编号',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'kId',
title: '合同',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'longSpotCode',
title: '长协/现货',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'comId',
title: '交易主体',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'dateEta',
title: '卸港ETA',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'portUnloading1Code',
title: '卸港港口',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'cuName',
title: '客户',
componentType: 'input',
align: 'left',
sorter: true,
},
];
//表单事件
export const formEventConfigs = {
0: [
{
type: 'circle',
color: '#2774ff',
text: '开始节点',
icon: '#icon-kaishi',
bgcColor: '#D8E5FF',
isUserDefined: false,
},
{
color: '#F6AB01',
icon: '#icon-chushihua',
text: '初始化表单',
bgcColor: '#f9f5ea',
isUserDefined: false,
nodeInfo: { processEvent: [] },
},
],
1: [
{
color: '#B36EDB',
icon: '#icon-shujufenxi',
text: '获取表单数据',
detail: '(新增无此操作)',
bgcColor: '#F8F2FC',
isUserDefined: false,
nodeInfo: { processEvent: [] },
},
],
2: [
{
color: '#F8625C',
icon: '#icon-jiazai',
text: '加载表单',
bgcColor: '#FFF1F1',
isUserDefined: false,
nodeInfo: { processEvent: [] },
},
],
3: [
{
color: '#6C6AE0',
icon: '#icon-jsontijiao',
text: '提交表单',
bgcColor: '#F5F4FF',
isUserDefined: false,
nodeInfo: { processEvent: [] },
},
],
4: [
{
type: 'circle',
color: '#F8625C',
text: '结束节点',
icon: '#icon-jieshuzhiliao',
bgcColor: '#FFD6D6',
isLast: true,
isUserDefined: false,
},
],
};
export const formProps: FormProps = {
labelCol: { span: 3, offset: 0 },
labelAlign: 'right',
layout: 'horizontal',
size: 'default',
schemas: [
{
key: '1e3972a0c590458fba8b5461855daf04',
field: 'id',
label: 'id',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入id',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: 'a3a65cdf7def40c8af5e32350bbc7b8b',
field: 'ssNo',
label: '船期编号',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入船期编号',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: 'c2cf7b2d16514e6fb05a33e9d7b5ea55',
field: 'kId',
label: '合同',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入合同',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: '2798f304d6464c53a67283e375b54776',
field: 'longSpotCode',
label: '长协/现货',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入长协/现货',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: '04670dc9277a41e8ba07a7d2369b91a8',
field: 'comId',
label: '交易主体',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入交易主体',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: 'a097d56a0cb54b42aad8318522f937c2',
field: 'dateEta',
label: '卸港ETA',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入卸港ETA',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: '2e7ffaedf4f34d178644175740160cb1',
field: 'portUnloading1Code',
label: '卸港港口',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入卸港港口',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: 'a74dfdcce3674f61b579b46b522ed23b',
field: 'cuName',
label: '客户',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入客户',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
],
showActionButtonGroup: false,
buttonLocation: 'center',
actionColOptions: { span: 24 },
showResetButton: false,
showSubmitButton: false,
hiddenComponent: [],
};

View File

@ -0,0 +1,122 @@
export const permissionList = [
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: 'id',
fieldId: 'id',
isSubTable: false,
showChildren: true,
type: 'input',
key: '1e3972a0c590458fba8b5461855daf04',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '船期编号',
fieldId: 'ssNo',
isSubTable: false,
showChildren: true,
type: 'input',
key: 'a3a65cdf7def40c8af5e32350bbc7b8b',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '合同',
fieldId: 'kId',
isSubTable: false,
showChildren: true,
type: 'input',
key: 'c2cf7b2d16514e6fb05a33e9d7b5ea55',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '长协/现货',
fieldId: 'longSpotCode',
isSubTable: false,
showChildren: true,
type: 'input',
key: '2798f304d6464c53a67283e375b54776',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '交易主体',
fieldId: 'comId',
isSubTable: false,
showChildren: true,
type: 'input',
key: '04670dc9277a41e8ba07a7d2369b91a8',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '卸港ETA',
fieldId: 'dateEta',
isSubTable: false,
showChildren: true,
type: 'input',
key: 'a097d56a0cb54b42aad8318522f937c2',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '卸港港口',
fieldId: 'portUnloading1Code',
isSubTable: false,
showChildren: true,
type: 'input',
key: '2e7ffaedf4f34d178644175740160cb1',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '客户',
fieldId: 'cuName',
isSubTable: false,
showChildren: true,
type: 'input',
key: 'a74dfdcce3674f61b579b46b522ed23b',
children: [],
},
];

View File

@ -0,0 +1,308 @@
<template>
<PageWrapper dense fixedHeight contentFullHeight contentClass="flex">
<BasicTable @register="registerTable" ref="tableRef" @row-dbClick="dbClickRow">
<template #toolbar>
<template v-for="button in tableButtonConfig" :key="button.code">
<a-button v-if="button.isDefault" :type="button.type" @click="buttonClick(button.code)">
<template #icon><Icon :icon="button.icon" /></template>
{{ button.name }}
</a-button>
<a-button v-else :type="button.type">
<template #icon><Icon :icon="button.icon" /></template>
{{ button.name }}
</a-button>
</template>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.dataIndex === 'action'">
<TableAction :actions="getActions(record)" />
</template>
</template>
</BasicTable>
<OpsSalesIntModal @register="registerModal" @success="handleSuccess" />
<DataLog :logId="logId" :logPath="logPath" v-model:visible="modalVisible"/>
</PageWrapper>
</template>
<script lang="ts" setup>
const modalVisible = ref(false);
const logId = ref('')
const logPath = ref('/ship/opsSalesInt/datalog');
import { DataLog } from '/@/components/pcitc';
import { ref, computed, onMounted, onUnmounted, createVNode,
} from 'vue';
import { Modal } from 'ant-design-vue';
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
import { BasicTable, useTable, TableAction, ActionItem } from '/@/components/Table';
import { getLngOpsSalesIntPage, deleteLngOpsSalesInt} from '/@/api/ship/OpsSalesInt';
import { PageWrapper } from '/@/components/Page';
import { useMessage } from '/@/hooks/web/useMessage';
import { useI18n } from '/@/hooks/web/useI18n';
import { usePermission } from '/@/hooks/web/usePermission';
import { useFormConfig } from '/@/hooks/web/useFormConfig';
import { useRouter } from 'vue-router';
import { setIndexFlowStatus } from '/@/utils/flow/index'
import { getLngOpsSalesInt } from '/@/api/ship/OpsSalesInt';
import { useModal } from '/@/components/Modal';
import OpsSalesIntModal from './components/OpsSalesIntModal.vue';
import {formConfig, searchFormSchema, columns } from './components/config';
import Icon from '/@/components/Icon/index';
import useEventBus from '/@/hooks/event/useEventBus';
import { cloneDeep } from 'lodash-es';
const { bus, CREATE_FLOW, FLOW_PROCESSED, FORM_LIST_MODIFIED } = useEventBus();
const { notification } = useMessage();
const { t } = useI18n();
defineEmits(['register']);
const { filterColumnAuth, filterButtonAuth } = usePermission();
const { mergeColumns,mergeSearchFormSchema,mergeButtons } = useFormConfig();
const filterColumns = cloneDeep(filterColumnAuth(columns));
const customConfigColums =ref(filterColumns);
const customSearchFormSchema =ref(searchFormSchema);
const tableRef = ref();
//所有按钮
const buttons = ref([{"isUse":true,"name":"新增","code":"add","icon":"ant-design:plus-outlined","isDefault":true,"type":"primary"},{"isUse":true,"name":"编辑","code":"edit","icon":"ant-design:form-outlined","isDefault":true},{"isUse":true,"name":"刷新","code":"refresh","icon":"ant-design:reload-outlined","isDefault":true},{"isUse":true,"name":"查看","code":"view","icon":"ant-design:eye-outlined","isDefault":true},{"isUse":true,"name":"数据日志","code":"datalog","icon":"ant-design:profile-outlined","isDefault":true},{"isUse":true,"name":"删除","code":"delete","icon":"ant-design:delete-outlined","isDefault":true}]);
//展示在列表内的按钮
const actionButtons = ref<string[]>(['view', 'edit','datalog', 'copyData', 'delete', 'startwork','flowRecord']);
const buttonConfigs = computed(()=>{
return filterButtonAuth(buttons.value);
})
const tableButtonConfig = computed(() => {
return buttonConfigs.value?.filter((x) => !actionButtons.value.includes(x.code));
});
const actionButtonConfig = computed(() => {
return buttonConfigs.value?.filter((x) => actionButtons.value.includes(x.code));
});
const btnEvent = {add : handleAdd,edit : handleEdit,refresh : handleRefresh,view : handleView,datalog : handleDatalog,delete : handleDelete,}
const { currentRoute } = useRouter();
const router = useRouter();
const formIdComputedRef = ref();
formIdComputedRef.value = currentRoute.value.meta.formId
const schemaIdComputedRef = ref();
schemaIdComputedRef.value = currentRoute.value.meta.schemaId
const [registerModal, { openModal }] = useModal();
const formName='销售执行';
const [registerTable, { reload, }] = useTable({
title: '' || (formName + '列表'),
api: getLngOpsSalesIntPage,
rowKey: 'id',
columns: customConfigColums,
formConfig: {
rowProps: {
gutter: 16,
},
schemas: customSearchFormSchema,
fieldMapToTime: [],
showResetButton: false,
},
beforeFetch: (params) => {
return { ...params, FormId: formIdComputedRef.value, PK: 'id' };
},
afterFetch: (res) => {
tableRef.value.setToolBarWidth();
},
useSearchForm: true,
showTableSetting: true,
striped: false,
actionColumn: {
width: 160,
title: '操作',
dataIndex: 'action',
slots: { customRender: 'action' },
},
tableSetting: {
size: false,
setting: false,
},
});
function dbClickRow(record) {
if (!actionButtonConfig?.value.some(element => element.code == 'view')) {
return;
}
const { processId, taskIds, schemaId } = record.workflowData || {};
if (taskIds && taskIds.length) {
router.push({
path: '/flow/' + schemaId + '/' + (processId || '') + '/approveFlow',
query: {
taskId: taskIds[0],
formName: formName,
formId:currentRoute.value.meta.formId
}
});
} else if (schemaId && !taskIds && processId) {
router.push({
path: '/flow/' + schemaId + '/' + processId + '/approveFlow',
query: {
readonly: 1,
taskId: '',
formName: formName,
formId:currentRoute.value.meta.formId
}
});
} else {
router.push({
path: '/form/OpsSalesInt/' + record.id + '/viewForm',
query: {
formPath: 'ship/OpsSalesInt',
formName: formName,
formId:currentRoute.value.meta.formId
}
});
}
}
function buttonClick(code) {
btnEvent[code]();
}
function handleDatalog (record: Recordable) {
modalVisible.value = true
logId.value = record.id
}
function handleAdd() {
if (schemaIdComputedRef.value) {
router.push({
path: '/flow/' + schemaIdComputedRef.value + '/0/createFlow'
});
} else {
router.push({
path: '/form/OpsSalesInt/0/createForm',
query: {
formPath: 'ship/OpsSalesInt',
formName: formName,
formId:currentRoute.value.meta.formId
}
});
}
}
function handleEdit(record: Recordable) {
router.push({
path: '/form/OpsSalesInt/' + record.id + '/updateForm',
query: {
formPath: 'ship/OpsSalesInt',
formName: formName,
formId:currentRoute.value.meta.formId
}
});
}
function handleDelete(record: Recordable) {
deleteList([record.id]);
}
function deleteList(ids) {
Modal.confirm({
title: '提示信息',
icon: createVNode(ExclamationCircleOutlined),
content: '是否确认删除?',
okText: '确认',
cancelText: '取消',
onOk() {
deleteLngOpsSalesInt(ids).then((_) => {
handleSuccess();
notification.success({
message: 'Tip',
description: t('删除成功!'),
});
});
},
onCancel() {},
});
}
function handleRefresh() {
reload();
}
function handleSuccess() {
reload();
}
function handleView(record: Recordable) {
dbClickRow(record);
}
onMounted(() => {
if (schemaIdComputedRef.value) {
bus.on(FLOW_PROCESSED, handleRefresh);
bus.on(CREATE_FLOW, handleRefresh);
} else {
bus.on(FORM_LIST_MODIFIED, handleRefresh);
}
// 合并渲染覆盖配置中的列表配置,包括展示字段配置、搜索字段配置、按钮配置
mergeCustomListRenderConfig();
});
onUnmounted(() => {
if (schemaIdComputedRef.value) {
bus.off(FLOW_PROCESSED, handleRefresh);
bus.off(CREATE_FLOW, handleRefresh);
} else {
bus.off(FORM_LIST_MODIFIED, handleRefresh);
}
});
function getActions(record: Recordable):ActionItem[] {
const actionsList: ActionItem[] = actionButtonConfig.value?.map((button) => {
if (!record.workflowData?.processId) {
return {
icon: button?.icon,
tooltip: button?.name,
color: button.code === 'delete' ? 'error' : undefined,
onClick: btnEvent[button.code].bind(null, record),
};
} else {
if (button.code === 'view') {
return {
icon: button?.icon,
tooltip: button?.name,
onClick: btnEvent[button.code].bind(null, record),
};
} else {
return {};
}
}
});
return actionsList;
}
async function mergeCustomListRenderConfig(){
if (formConfig.useCustomConfig) {
let formId=currentRoute.value.meta.formId;
//1.合并展示字段配置
let cols= await mergeColumns(customConfigColums.value,formId);
customConfigColums.value=cols;
//2.合并搜索字段配置
let sFormSchema= await mergeSearchFormSchema(customSearchFormSchema.value,formId);
customSearchFormSchema.value=sFormSchema;
//3.合并按钮配置
let btns= await mergeButtons(buttons.value,formId);
buttons.value=btns;
}
};
</script>
<style lang="less" scoped>
:deep(.ant-table-selection-col) {
width: 50px;
}
.show{
display: flex;
}
.hide{
display: none !important;
}
</style>

View File

@ -0,0 +1,224 @@
<template>
<SimpleForm
ref="systemFormRef"
:formProps="data.formDataProps"
:formModel="{}"
:isWorkFlow="props.fromPage!=FromPageType.MENU"
/>
</template>
<script lang="ts" setup>
import { reactive, ref,onBeforeMount,onMounted } from 'vue';
import { formProps, formEventConfigs ,formConfig} from './config';
import SimpleForm from '/@/components/SimpleForm/src/SimpleForm.vue';
import { addLngShipSchedule, getLngShipSchedule, updateLngShipSchedule, deleteLngShipSchedule } from '/@/api/ship/ShipSchedule';
import { cloneDeep } from 'lodash-es';
import { FormDataProps } from '/@/components/Designer/src/types';
import { usePermission } from '/@/hooks/web/usePermission';
import { useFormConfig } from '/@/hooks/web/useFormConfig';
import { FromPageType } from '/@/enums/workflowEnum';
import { createFormEvent, getFormDataEvent, loadFormEvent, submitFormEvent,} from '/@/hooks/web/useFormEvent';
import { changeWorkFlowForm, changeSchemaDisabled } from '/@/hooks/web/useWorkFlowForm';
import { WorkFlowFormParams } from '/@/model/workflow/bpmnConfig';
import { useRouter } from 'vue-router';
const { filterFormSchemaAuth } = usePermission();
const { mergeFormSchemas,mergeFormEventConfigs } = useFormConfig();
const { currentRoute } = useRouter();
const RowKey = 'id';
const emits = defineEmits(['changeUploadComponentIds','loadingCompleted', 'form-mounted']);
const props = defineProps({
fromPage: {
type: Number,
default: FromPageType.MENU,
},
});
const systemFormRef = ref();
const data: { formDataProps: FormDataProps } = reactive({
formDataProps: {schemas:[]} as FormDataProps,
});
const state = reactive({
formModel: {},
});
let customFormEventConfigs=[];
onMounted(async () => {
try {
// 合并渲染覆盖配置中的字段配置、表单事件配置
await mergeCustomFormRenderConfig();
if (props.fromPage == FromPageType.MENU) {
setMenuPermission();
await createFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:初始化表单
await loadFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:加载表单
} else if (props.fromPage == FromPageType.FLOW) {
emits('loadingCompleted'); //告诉系统表单已经加载完毕
// loadingCompleted后 工作流页面直接利用Ref调用setWorkFlowForm方法
} else if (props.fromPage == FromPageType.PREVIEW) {
// 预览 无需权限,表单事件也无需执行
} else if (props.fromPage == FromPageType.DESKTOP) {
// 桌面设计 表单事件需要执行
emits('loadingCompleted'); //告诉系统表单已经加载完毕
await createFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:初始化表单
await loadFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:加载表单
}
emits('form-mounted', formProps);
} catch (error) {
}
});
async function mergeCustomFormRenderConfig() {
let cloneProps=cloneDeep(formProps);
let fEventConfigs=cloneDeep(formEventConfigs);
if (formConfig.useCustomConfig) {
if(props.fromPage !== FromPageType.FLOW){
let formPath=currentRoute.value.query.formPath;
//1.合并字段配置
cloneProps.schemas=await mergeFormSchemas({formSchema:cloneProps.schemas!,formPath:formPath});
//2.合并表单事件配置
fEventConfigs=await mergeFormEventConfigs({formEventConfigs:fEventConfigs,formPath:formPath});
}
}
data.formDataProps=cloneProps;
customFormEventConfigs=fEventConfigs;
}
// 根据菜单页面权限,设置表单属性(必填,禁用,显示)
function setMenuPermission() {
data.formDataProps.schemas = filterFormSchemaAuth(data.formDataProps.schemas!);
}
// 校验form 通过返回表单数据
async function validate() {
let values = [];
try {
values = await systemFormRef.value?.validate();
//添加隐藏组件
if (data.formDataProps.hiddenComponent?.length) {
data.formDataProps.hiddenComponent.forEach((component) => {
values[component.bindField] = component.value;
});
}
} finally {
}
return values;
}
// 根据行唯一ID查询行数据并设置表单数据 【编辑】
async function setFormDataFromId(rowId, skipUpdate) {
try {
const record = await getLngShipSchedule(rowId);
if (skipUpdate) {
return record;
}
setFieldsValue(record);
state.formModel = record;
await getFormDataEvent(customFormEventConfigs, state.formModel, systemFormRef.value, formProps.schemas); //表单事件:获取表单数据
return record;
} catch (error) {
}
}
// 辅助设置表单数据
function setFieldsValue(record) {
systemFormRef.value.setFieldsValue(record);
}
// 重置表单数据
async function resetFields() {
await systemFormRef.value.resetFields();
}
// 设置表单数据全部为Disabled 【查看】
async function setDisabledForm(isDisabled) {
data.formDataProps.schemas = changeSchemaDisabled(cloneDeep(data.formDataProps.schemas),isDisabled);
}
// 获取行键值
function getRowKey() {
return RowKey;
}
// 更新api表单数据
async function update({ values, rowId }) {
try {
values[RowKey] = rowId;
state.formModel = values;
let saveVal = await updateLngShipSchedule(values);
await submitFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:提交表单
return saveVal;
} catch (error) {}
}
// 新增api表单数据
async function add(values) {
try {
state.formModel = values;
let saveVal = await addLngShipSchedule(values);
await submitFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:提交表单
return saveVal;
} catch (error) {}
}
// 根据工作流页面权限,设置表单属性(必填,禁用,显示)
async function setWorkFlowForm(obj: WorkFlowFormParams) {
try {
const cloneProps=cloneDeep(formProps);
customFormEventConfigs=cloneDeep(formEventConfigs);
if (formConfig.useCustomConfig) {
const parts = obj.formConfigKey.split('_');
const formId=parts[1];
cloneProps.schemas=await mergeFormSchemas({formSchema:cloneProps.schemas!,formId:formId});
customFormEventConfigs=await mergeFormEventConfigs({formEventConfigs:customFormEventConfigs,formId:formId});
}
let flowData = changeWorkFlowForm(cloneProps, obj);
let { buildOptionJson, uploadComponentIds, formModels, isViewProcess } = flowData;
data.formDataProps = buildOptionJson;
emits('changeUploadComponentIds', uploadComponentIds); //工作流中必须保存上传组件id【附件汇总需要】
if (isViewProcess) {
setDisabledForm(); //查看
}
state.formModel = formModels;
if(formModels[RowKey]) {
setFormDataFromId(formModels[RowKey], false)
} else {
setFieldsValue(formModels)
}
} catch (error) {}
await createFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:初始化表单
await loadFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:加载表单
}
function getFormModel() {
return systemFormRef.value.formModel
}
async function handleDelete(id) {
return await deleteLngShipSchedule([id]);
}
defineExpose({
setFieldsValue,
resetFields,
validate,
add,
update,
setFormDataFromId,
setDisabledForm,
setMenuPermission,
setWorkFlowForm,
getRowKey,
getFormModel,
handleDelete
});
</script>

View File

@ -0,0 +1,110 @@
<template>
<BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" @cancel="handleClose" :paddingRight="15" :bodyStyle="{ minHeight: '400px !important' }">
<ModalForm ref="formRef" :fromPage="FromPageType.MENU" />
</BasicModal>
</template>
<script lang="ts" setup>
import { ref, computed, reactive } from 'vue';
import { BasicModal, useModalInner } from '/@/components/Modal';
import { useMessage } from '/@/hooks/web/useMessage';
import { useI18n } from '/@/hooks/web/useI18n';
import { formProps } from './config';
import ModalForm from './Form.vue';
import { FromPageType } from '/@/enums/workflowEnum';
const emit = defineEmits(['success', 'register']);
const { notification } = useMessage();
const formRef = ref();
const state = reactive({
formModel: {},
isUpdate: true,
isView: false,
isCopy: false,
rowId: '',
});
const { t } = useI18n();
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
state.isUpdate = !!data?.isUpdate;
state.isView = !!data?.isView;
state.isCopy = !!data?.isCopy;
setModalProps({
destroyOnClose: true,
maskClosable: false,
showCancelBtn: !state.isView,
showOkBtn: !state.isView,
canFullscreen: true,
width: 900,
});
if (state.isUpdate || state.isView || state.isCopy) {
state.rowId = data.id;
if (state.isView) {
await formRef.value.setDisabledForm();
}
await formRef.value.setFormDataFromId(state.rowId);
} else {
formRef.value.resetFields();
}
});
const getTitle = computed(() => (state.isView ? '查看' : !state.isUpdate ? '新增' : '编辑'));
async function saveModal() {
let saveSuccess = false;
try {
const values = await formRef.value?.validate();
//添加隐藏组件
if (formProps.hiddenComponent?.length) {
formProps.hiddenComponent.forEach((component) => {
values[component.bindField] = component.value;
});
}
if (values !== false) {
try {
if (!state.isUpdate || state.isCopy) {
saveSuccess = await formRef.value.add(values);
} else {
saveSuccess = await formRef.value.update({ values, rowId: state.rowId });
}
return saveSuccess;
} catch (error) {}
}
} catch (error) {
return saveSuccess;
}
}
async function handleSubmit() {
try {
const saveSuccess = await saveModal();
setModalProps({ confirmLoading: true });
if (saveSuccess) {
if (!state.isUpdate || state.isCopy) {
//false 新增
notification.success({
message: 'Tip',
description: t('新增成功!'),
}); //提示消息
} else {
notification.success({
message: 'Tip',
description: t('修改成功!'),
}); //提示消息
}
closeModal();
formRef.value.resetFields();
emit('success');
}
} finally {
setModalProps({ confirmLoading: false });
}
}
function handleClose() {
formRef.value.resetFields();
}
</script>

View File

@ -0,0 +1,567 @@
import { FormProps, FormSchema } from '/@/components/Form';
import { BasicColumn } from '/@/components/Table';
export const formConfig = {
useCustomConfig: false,
};
export const searchFormSchema: FormSchema[] = [
{
field: 'ssNo',
label: '船期编号',
component: 'Input',
},
{
field: 'comName',
label: '交易主体',
component: 'Input',
},
{
field: 'staName',
label: '接收站',
component: 'Input',
},
];
export const columns: BasicColumn[] = [
{
dataIndex: 'ssNo',
title: '船期编号',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'kId',
title: '合同',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'longSpotCode',
title: '长协/现货',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'comId',
title: '交易主体',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'dateEta',
title: '卸港ETA',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'staCode',
title: '接收站',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'suName',
title: '供应商',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'ssTypeCode',
title: '业务类型',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'opsPurId',
title: '采购执行状态',
componentType: 'input',
align: 'left',
sorter: true,
},
{
dataIndex: 'opsSalesId',
title: '销售执行状态',
componentType: 'input',
align: 'left',
sorter: true,
},
];
//表单事件
export const formEventConfigs = {
0: [
{
type: 'circle',
color: '#2774ff',
text: '开始节点',
icon: '#icon-kaishi',
bgcColor: '#D8E5FF',
isUserDefined: false,
},
{
color: '#F6AB01',
icon: '#icon-chushihua',
text: '初始化表单',
bgcColor: '#f9f5ea',
isUserDefined: false,
nodeInfo: { processEvent: [] },
},
],
1: [
{
color: '#B36EDB',
icon: '#icon-shujufenxi',
text: '获取表单数据',
detail: '(新增无此操作)',
bgcColor: '#F8F2FC',
isUserDefined: false,
nodeInfo: { processEvent: [] },
},
],
2: [
{
color: '#F8625C',
icon: '#icon-jiazai',
text: '加载表单',
bgcColor: '#FFF1F1',
isUserDefined: false,
nodeInfo: { processEvent: [] },
},
],
3: [
{
color: '#6C6AE0',
icon: '#icon-jsontijiao',
text: '提交表单',
bgcColor: '#F5F4FF',
isUserDefined: false,
nodeInfo: { processEvent: [] },
},
],
4: [
{
type: 'circle',
color: '#F8625C',
text: '结束节点',
icon: '#icon-jieshuzhiliao',
bgcColor: '#FFD6D6',
isLast: true,
isUserDefined: false,
},
],
};
export const formProps: FormProps = {
labelCol: { span: 3, offset: 0 },
labelAlign: 'right',
layout: 'horizontal',
size: 'default',
schemas: [
{
key: '727ecf2b215d409f91b921eabc435282',
field: 'id',
label: 'id',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入id',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: '9493071a374e43af9ef2435fe054e57c',
field: 'ssNo',
label: '船期编号',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入船期编号',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: '26cba2c0b33147adb57d870a00f5f138',
field: 'kId',
label: '合同',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入合同',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: '0258b609995d4216a3af4901a471d17e',
field: 'longSpotCode',
label: '长协/现货',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入长协/现货',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: 'a26ea714754344b988e81655ff2e3f1e',
field: 'comId',
label: '交易主体',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入交易主体',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: 'fc7562df234f4de3b627fc6f6e90cc76',
field: 'dateEta',
label: '卸港ETA',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入卸港ETA',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: 'e854bd6b50ff45dea6048479cb9db320',
field: 'staCode',
label: '接收站',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入接收站',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: '6a93e33ba7044ac69bf59d1607e23179',
field: 'suName',
label: '供应商',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入供应商',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: '28a11d8e4c5a411698c4d10e47afc1a9',
field: 'ssTypeCode',
label: '业务类型',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入业务类型',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: '35d258428cb4424898dfbe0ea2eb5651',
field: 'opsPurId',
label: '采购执行状态',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入采购执行状态',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
{
key: '5e312ff598574a559555bb57fd594918',
field: 'opsSalesId',
label: '销售执行状态',
type: 'input',
component: 'Input',
colProps: { span: 24 },
defaultValue: '',
componentProps: {
width: '100%',
span: '',
defaultValue: '',
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请输入销售执行状态',
maxlength: null,
prefix: '',
suffix: '',
addonBefore: '',
addonAfter: '',
disabled: false,
allowClear: false,
showLabel: true,
required: false,
rules: [],
events: {},
isSave: false,
isShow: true,
scan: false,
style: { width: '100%' },
},
},
],
showActionButtonGroup: false,
buttonLocation: 'center',
actionColOptions: { span: 24 },
showResetButton: false,
showSubmitButton: false,
hiddenComponent: [],
};

View File

@ -0,0 +1,167 @@
export const permissionList = [
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: 'id',
fieldId: 'id',
isSubTable: false,
showChildren: true,
type: 'input',
key: '727ecf2b215d409f91b921eabc435282',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '船期编号',
fieldId: 'ssNo',
isSubTable: false,
showChildren: true,
type: 'input',
key: '9493071a374e43af9ef2435fe054e57c',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '合同',
fieldId: 'kId',
isSubTable: false,
showChildren: true,
type: 'input',
key: '26cba2c0b33147adb57d870a00f5f138',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '长协/现货',
fieldId: 'longSpotCode',
isSubTable: false,
showChildren: true,
type: 'input',
key: '0258b609995d4216a3af4901a471d17e',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '交易主体',
fieldId: 'comId',
isSubTable: false,
showChildren: true,
type: 'input',
key: 'a26ea714754344b988e81655ff2e3f1e',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '卸港ETA',
fieldId: 'dateEta',
isSubTable: false,
showChildren: true,
type: 'input',
key: 'fc7562df234f4de3b627fc6f6e90cc76',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '接收站',
fieldId: 'staCode',
isSubTable: false,
showChildren: true,
type: 'input',
key: 'e854bd6b50ff45dea6048479cb9db320',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '供应商',
fieldId: 'suName',
isSubTable: false,
showChildren: true,
type: 'input',
key: '6a93e33ba7044ac69bf59d1607e23179',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '业务类型',
fieldId: 'ssTypeCode',
isSubTable: false,
showChildren: true,
type: 'input',
key: '28a11d8e4c5a411698c4d10e47afc1a9',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '采购执行状态',
fieldId: 'opsPurId',
isSubTable: false,
showChildren: true,
type: 'input',
key: '35d258428cb4424898dfbe0ea2eb5651',
children: [],
},
{
required: true,
view: true,
edit: true,
disabled: false,
isSaveTable: false,
tableName: '',
fieldName: '销售执行状态',
fieldId: 'opsSalesId',
isSubTable: false,
showChildren: true,
type: 'input',
key: '5e312ff598574a559555bb57fd594918',
children: [],
},
];

View File

@ -0,0 +1,308 @@
<template>
<PageWrapper dense fixedHeight contentFullHeight contentClass="flex">
<BasicTable @register="registerTable" ref="tableRef" @row-dbClick="dbClickRow">
<template #toolbar>
<template v-for="button in tableButtonConfig" :key="button.code">
<a-button v-if="button.isDefault" :type="button.type" @click="buttonClick(button.code)">
<template #icon><Icon :icon="button.icon" /></template>
{{ button.name }}
</a-button>
<a-button v-else :type="button.type">
<template #icon><Icon :icon="button.icon" /></template>
{{ button.name }}
</a-button>
</template>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.dataIndex === 'action'">
<TableAction :actions="getActions(record)" />
</template>
</template>
</BasicTable>
<ShipScheduleModal @register="registerModal" @success="handleSuccess" />
<DataLog :logId="logId" :logPath="logPath" v-model:visible="modalVisible"/>
</PageWrapper>
</template>
<script lang="ts" setup>
const modalVisible = ref(false);
const logId = ref('')
const logPath = ref('/ship/shipSchedule/datalog');
import { DataLog } from '/@/components/pcitc';
import { ref, computed, onMounted, onUnmounted, createVNode,
} from 'vue';
import { Modal } from 'ant-design-vue';
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
import { BasicTable, useTable, TableAction, ActionItem } from '/@/components/Table';
import { getLngShipSchedulePage, deleteLngShipSchedule} from '/@/api/ship/ShipSchedule';
import { PageWrapper } from '/@/components/Page';
import { useMessage } from '/@/hooks/web/useMessage';
import { useI18n } from '/@/hooks/web/useI18n';
import { usePermission } from '/@/hooks/web/usePermission';
import { useFormConfig } from '/@/hooks/web/useFormConfig';
import { useRouter } from 'vue-router';
import { setIndexFlowStatus } from '/@/utils/flow/index'
import { getLngShipSchedule } from '/@/api/ship/ShipSchedule';
import { useModal } from '/@/components/Modal';
import ShipScheduleModal from './components/ShipScheduleModal.vue';
import {formConfig, searchFormSchema, columns } from './components/config';
import Icon from '/@/components/Icon/index';
import useEventBus from '/@/hooks/event/useEventBus';
import { cloneDeep } from 'lodash-es';
const { bus, CREATE_FLOW, FLOW_PROCESSED, FORM_LIST_MODIFIED } = useEventBus();
const { notification } = useMessage();
const { t } = useI18n();
defineEmits(['register']);
const { filterColumnAuth, filterButtonAuth } = usePermission();
const { mergeColumns,mergeSearchFormSchema,mergeButtons } = useFormConfig();
const filterColumns = cloneDeep(filterColumnAuth(columns));
const customConfigColums =ref(filterColumns);
const customSearchFormSchema =ref(searchFormSchema);
const tableRef = ref();
//所有按钮
const buttons = ref([{"isUse":true,"name":"新增","code":"add","icon":"ant-design:plus-outlined","isDefault":true,"type":"primary"},{"isUse":true,"name":"船期发送","code":"send","icon":"ant-design:send-outlined","isDefault":true,"type":"primary"},{"isUse":true,"name":"编辑","code":"edit","icon":"ant-design:form-outlined","isDefault":true},{"isUse":true,"name":"刷新","code":"refresh","icon":"ant-design:reload-outlined","isDefault":true},{"isUse":true,"name":"查看","code":"view","icon":"ant-design:eye-outlined","isDefault":true},{"isUse":true,"name":"数据日志","code":"datalog","icon":"ant-design:profile-outlined","isDefault":true},{"isUse":true,"name":"采购执行","code":"opspur","icon":"ant-design:folder-view-outlined","isDefault":false},{"isUse":true,"name":"销售执行","code":"opssales","icon":"ant-design:fund-view-outlined","isDefault":false},{"isUse":true,"name":"删除","code":"delete","icon":"ant-design:delete-outlined","isDefault":true}]);
//展示在列表内的按钮
const actionButtons = ref<string[]>(['view', 'edit','datalog', 'copyData', 'delete', 'startwork','flowRecord', 'opspur', 'opssales']);
const buttonConfigs = computed(()=>{
return filterButtonAuth(buttons.value);
})
const tableButtonConfig = computed(() => {
return buttonConfigs.value?.filter((x) => !actionButtons.value.includes(x.code));
});
const actionButtonConfig = computed(() => {
return buttonConfigs.value?.filter((x) => actionButtons.value.includes(x.code));
});
const btnEvent = {add : handleAdd,edit : handleEdit,refresh : handleRefresh,view : handleView,datalog : handleDatalog,delete : handleDelete,}
const { currentRoute } = useRouter();
const router = useRouter();
const formIdComputedRef = ref();
formIdComputedRef.value = currentRoute.value.meta.formId
const schemaIdComputedRef = ref();
schemaIdComputedRef.value = currentRoute.value.meta.schemaId
const [registerModal, { openModal }] = useModal();
const formName='船期计划排布';
const [registerTable, { reload, }] = useTable({
title: '' || (formName + '列表'),
api: getLngShipSchedulePage,
rowKey: 'id',
columns: customConfigColums,
formConfig: {
rowProps: {
gutter: 16,
},
schemas: customSearchFormSchema,
fieldMapToTime: [],
showResetButton: false,
},
beforeFetch: (params) => {
return { ...params, FormId: formIdComputedRef.value, PK: 'id' };
},
afterFetch: (res) => {
tableRef.value.setToolBarWidth();
},
useSearchForm: true,
showTableSetting: true,
striped: false,
actionColumn: {
width: 160,
title: '操作',
dataIndex: 'action',
slots: { customRender: 'action' },
},
tableSetting: {
size: false,
setting: false,
},
});
function dbClickRow(record) {
if (!actionButtonConfig?.value.some(element => element.code == 'view')) {
return;
}
const { processId, taskIds, schemaId } = record.workflowData || {};
if (taskIds && taskIds.length) {
router.push({
path: '/flow/' + schemaId + '/' + (processId || '') + '/approveFlow',
query: {
taskId: taskIds[0],
formName: formName,
formId:currentRoute.value.meta.formId
}
});
} else if (schemaId && !taskIds && processId) {
router.push({
path: '/flow/' + schemaId + '/' + processId + '/approveFlow',
query: {
readonly: 1,
taskId: '',
formName: formName,
formId:currentRoute.value.meta.formId
}
});
} else {
router.push({
path: '/form/ShipSchedule/' + record.id + '/viewForm',
query: {
formPath: 'ship/ShipSchedule',
formName: formName,
formId:currentRoute.value.meta.formId
}
});
}
}
function buttonClick(code) {
btnEvent[code]();
}
function handleDatalog (record: Recordable) {
modalVisible.value = true
logId.value = record.id
}
function handleAdd() {
if (schemaIdComputedRef.value) {
router.push({
path: '/flow/' + schemaIdComputedRef.value + '/0/createFlow'
});
} else {
router.push({
path: '/form/ShipSchedule/0/createForm',
query: {
formPath: 'ship/ShipSchedule',
formName: formName,
formId:currentRoute.value.meta.formId
}
});
}
}
function handleEdit(record: Recordable) {
router.push({
path: '/form/ShipSchedule/' + record.id + '/updateForm',
query: {
formPath: 'ship/ShipSchedule',
formName: formName,
formId:currentRoute.value.meta.formId
}
});
}
function handleDelete(record: Recordable) {
deleteList([record.id]);
}
function deleteList(ids) {
Modal.confirm({
title: '提示信息',
icon: createVNode(ExclamationCircleOutlined),
content: '是否确认删除?',
okText: '确认',
cancelText: '取消',
onOk() {
deleteLngShipSchedule(ids).then((_) => {
handleSuccess();
notification.success({
message: 'Tip',
description: t('删除成功!'),
});
});
},
onCancel() {},
});
}
function handleRefresh() {
reload();
}
function handleSuccess() {
reload();
}
function handleView(record: Recordable) {
dbClickRow(record);
}
onMounted(() => {
if (schemaIdComputedRef.value) {
bus.on(FLOW_PROCESSED, handleRefresh);
bus.on(CREATE_FLOW, handleRefresh);
} else {
bus.on(FORM_LIST_MODIFIED, handleRefresh);
}
// 合并渲染覆盖配置中的列表配置,包括展示字段配置、搜索字段配置、按钮配置
mergeCustomListRenderConfig();
});
onUnmounted(() => {
if (schemaIdComputedRef.value) {
bus.off(FLOW_PROCESSED, handleRefresh);
bus.off(CREATE_FLOW, handleRefresh);
} else {
bus.off(FORM_LIST_MODIFIED, handleRefresh);
}
});
function getActions(record: Recordable):ActionItem[] {
const actionsList: ActionItem[] = actionButtonConfig.value?.map((button) => {
if (!record.workflowData?.processId) {
return {
icon: button?.icon,
tooltip: button?.name,
color: button.code === 'delete' ? 'error' : undefined,
onClick: btnEvent[button.code].bind(null, record),
};
} else {
if (button.code === 'view') {
return {
icon: button?.icon,
tooltip: button?.name,
onClick: btnEvent[button.code].bind(null, record),
};
} else {
return {};
}
}
});
return actionsList;
}
async function mergeCustomListRenderConfig(){
if (formConfig.useCustomConfig) {
let formId=currentRoute.value.meta.formId;
//1.合并展示字段配置
let cols= await mergeColumns(customConfigColums.value,formId);
customConfigColums.value=cols;
//2.合并搜索字段配置
let sFormSchema= await mergeSearchFormSchema(customSearchFormSchema.value,formId);
customSearchFormSchema.value=sFormSchema;
//3.合并按钮配置
let btns= await mergeButtons(buttons.value,formId);
buttons.value=btns;
}
};
</script>
<style lang="less" scoped>
:deep(.ant-table-selection-col) {
width: 50px;
}
.show{
display: flex;
}
.hide{
display: none !important;
}
</style>