产值管理审批流

This commit is contained in:
Teo
2025-08-07 19:22:17 +08:00
parent 0223d9d86e
commit f37ca487f6
28 changed files with 5272 additions and 39 deletions

View File

@ -5,7 +5,7 @@ VITE_APP_TITLE = 新能源项目管理平台
VITE_APP_ENV = 'development' VITE_APP_ENV = 'development'
# 开发环境 # 开发环境
VITE_APP_BASE_API = 'http://192.168.110.159:8898' VITE_APP_BASE_API = 'http://192.168.110.119:8898'
# 无人机接口地址 # 无人机接口地址

View File

@ -0,0 +1,99 @@
import request from '@/utils/request';
import { AxiosPromise } from 'axios';
import { CailiaoshebeiVO, CailiaoshebeiForm, CailiaoshebeiQuery } from '@/api/materials/cailiaoshebei/types';
/**
* 查询物资-材料设备列表
* @param query
* @returns {*}
*/
export const listCailiaoshebei = (query?: any): AxiosPromise<CailiaoshebeiVO[]> => {
return request({
url: '/cailiaoshebei/materialbatchdemandplan/list',
method: 'get',
params: query
});
};
/**
* 查询物资-材料设备详细
* @param id
*/
export const getCailiaoshebei = (id: string | number): AxiosPromise<CailiaoshebeiVO> => {
return request({
url: '/cailiaoshebei/cailiaoshebei/' + id,
method: 'get'
});
};
/**
* 新增物资-材料设备
* @param data
*/
export const addCailiaoshebei = (data: CailiaoshebeiForm) => {
return request({
url: '/cailiaoshebei/materialbatchdemandplan',
method: 'post',
data: data
});
};
/**
* 修改物资-材料设备
* @param data
*/
export const updateCailiaoshebei = (data: CailiaoshebeiForm) => {
return request({
url: '/cailiaoshebei/cailiaoshebei',
method: 'put',
data: data
});
};
/**
* 删除物资-材料设备
* @param id
*/
export const delCailiaoshebei = (id: string | number | Array<string | number>) => {
return request({
url: '/cailiaoshebei/cailiaoshebei/remove/' + id,
method: 'delete'
});
};
/**
* 查询物资-材料设备批次列表
* @param query
* @returns {*}
*/
export const listBatch = (query?: any): AxiosPromise => {
return request({
url: '/cailiaoshebei/materialbatchdemandplan/pcList',
method: 'get',
params: query
});
};
/**
* 新增物资-材料设备批次
* @param data
*/
export const getBatch = (data: any) => {
return request({
url: '/cailiaoshebei/materialbatchdemandplan/pcAdd',
method: 'post',
data: data
});
};
/**
* 删除物资-材料设备批次
* @param ids
*/
export const delBatch = (ids: string | number | Array<string | number>) => {
return request({
url: '/cailiaoshebei/materialbatchdemandplan/' + ids,
method: 'delete'
});
};

View File

@ -0,0 +1,229 @@
export interface CailiaoshebeiVO {
/**
* 主键ID
*/
id: string | number;
/**
* 批次ID
*/
batchId: string | number;
/**
* 供货商ID
*/
supplierId: string | number;
/**
* 供货商
*/
supplier: string;
/**
* 设备材料名称
*/
name: string;
/**
* 供货来源(字典)
*/
supply: string;
/**
* 规格型号
*/
specification: string;
/**
* 特征描述
*/
signalment: string;
/**
* 物料编码
*/
materialCode: string;
/**
* 计划到场时间
*/
arrivalTime: string;
/**
* 计划完成时间
*/
finishTime: string;
/**
* 计量单位
*/
unit: string;
/**
* 计划数量
*/
plan: number;
/**
* 实际数量
*/
realQuantity: number;
/**
* 备注
*/
remark: string;
}
export interface CailiaoshebeiForm extends BaseEntity {
/**
* 主键ID
*/
id?: string | number;
projectId?: string | number;
batchNumber?: string | number;
addDataList?: any[];
approvalProject?: string;
/**
* 批次ID
*/
batchId?: string | number;
/**
* 供货商ID
*/
supplierId?: string | number;
/**
* 供货商
*/
supplier?: string;
/**
* 设备材料名称
*/
name?: string;
/**
* 供货来源(字典)
*/
supply?: string;
/**
* 规格型号
*/
specification?: string;
/**
* 特征描述
*/
signalment?: string;
/**
* 物料编码
*/
materialCode?: string;
/**
* 计划到场时间
*/
arrivalTime?: string;
/**
* 计划完成时间
*/
finishTime?: string;
/**
* 计量单位
*/
unit?: string;
/**
* 计划数量
*/
plan?: number;
/**
* 实际数量
*/
realQuantity?: number;
/**
* 备注
*/
remark?: string;
}
export interface CailiaoshebeiQuery extends PageQuery {
/**
* 批次ID
*/
batchId?: string | number;
projectId?: string | number;
batchNumber?: string;
/**
* 供货商ID
*/
supplierId?: string | number;
/**
* 供货商
*/
supplier?: string;
/**
* 设备材料名称
*/
name?: string;
/**
* 供货来源(字典)
*/
supply?: string;
/**
* 规格型号
*/
specification?: string;
/**
* 特征描述
*/
signalment?: string;
/**
* 物料编码
*/
materialCode?: string;
/**
* 计划到场时间
*/
arrivalTime?: string;
/**
* 计划完成时间
*/
finishTime?: string;
/**
* 计量单位
*/
unit?: string;
/**
* 计划数量
*/
plan?: number;
/**
* 实际数量
*/
realQuantity?: number;
/**
* 日期范围参数
*/
params?: any;
}

View File

@ -86,3 +86,14 @@ export const getBatch = (data: any) => {
data: data data: data
}); });
}; };
/**
* 删除物资-材料设备批次
* @param ids
*/
export const delBatch = (ids: string | number | Array<string | number>) => {
return request({
url: '/cailiaoshebei/cailiaoshebei/pcDelete/' + ids,
method: 'delete'
});
};

View File

@ -82,7 +82,7 @@ export interface CailiaoshebeiForm extends BaseEntity {
id?: string | number; id?: string | number;
projectId?: string | number; projectId?: string | number;
batchNumber?: string | number; batchNumber?: string | number;
approvalDesign?: string;
/** /**
* 批次ID * 批次ID
*/ */

View File

@ -0,0 +1,99 @@
import request from '@/utils/request';
import { AxiosPromise } from 'axios';
import { CailiaoshebeiVO, CailiaoshebeiForm, CailiaoshebeiQuery } from '@/api/materials/cailiaoshebei/types';
/**
* 查询物资-材料设备列表
* @param query
* @returns {*}
*/
export const listCailiaoshebei = (query?: any): AxiosPromise<CailiaoshebeiVO[]> => {
return request({
url: '/cailiaoshebei/materialsorder/list',
method: 'get',
params: query
});
};
/**
* 查询物资-材料设备详细
* @param id
*/
export const getCailiaoshebei = (id: string | number): AxiosPromise<CailiaoshebeiVO> => {
return request({
url: '/cailiaoshebei/cailiaoshebei/' + id,
method: 'get'
});
};
/**
* 新增物资-材料设备
* @param data
*/
export const addCailiaoshebei = (data: CailiaoshebeiForm) => {
return request({
url: '/cailiaoshebei/materialsorder/modifyTheOrderForm',
method: 'put',
data: data
});
};
/**
* 修改物资-材料设备
* @param data
*/
export const updateCailiaoshebei = (data: CailiaoshebeiForm) => {
return request({
url: '/cailiaoshebei/cailiaoshebei',
method: 'put',
data: data
});
};
/**
* 删除物资-材料设备
* @param id
*/
export const delCailiaoshebei = (id: string | number | Array<string | number>) => {
return request({
url: '/cailiaoshebei/cailiaoshebei/remove/' + id,
method: 'delete'
});
};
/**
* 查询物资-材料设备批次列表
* @param query
* @returns {*}
*/
export const listBatch = (query?: any): AxiosPromise => {
return request({
url: '/cailiaoshebei/materialsorder/pcPlanList',
method: 'get',
params: query
});
};
/**
* 新增物资-材料设备批次
* @param data
*/
export const getBatch = (data: any) => {
return request({
url: '/cailiaoshebei/materialbatchdemandplan/pcAdd',
method: 'post',
data: data
});
};
/**
* 删除物资-材料设备批次
* @param ids
*/
export const delBatch = (ids: string | number | Array<string | number>) => {
return request({
url: '/cailiaoshebei/materialbatchdemandplan/' + ids,
method: 'delete'
});
};

View File

@ -0,0 +1,229 @@
export interface CailiaoshebeiVO {
/**
* 主键ID
*/
id: string | number;
/**
* 批次ID
*/
batchId: string | number;
/**
* 供货商ID
*/
supplierId: string | number;
/**
* 供货商
*/
supplier: string;
/**
* 设备材料名称
*/
name: string;
/**
* 供货来源(字典)
*/
supply: string;
/**
* 规格型号
*/
specification: string;
/**
* 特征描述
*/
signalment: string;
/**
* 物料编码
*/
materialCode: string;
/**
* 计划到场时间
*/
arrivalTime: string;
/**
* 计划完成时间
*/
finishTime: string;
/**
* 计量单位
*/
unit: string;
/**
* 计划数量
*/
plan: number;
/**
* 实际数量
*/
realQuantity: number;
/**
* 备注
*/
remark: string;
}
export interface CailiaoshebeiForm extends BaseEntity {
/**
* 主键ID
*/
id?: string | number;
projectId?: string | number;
batchNumber?: string | number;
addDataList?: any[];
/**
* 批次ID
*/
batchId?: string | number;
/**
* 供货商ID
*/
supplierId?: string | number;
/**
* 供货商
*/
supplier?: string;
/**
* 设备材料名称
*/
name?: string;
/**
* 供货来源(字典)
*/
supply?: string;
/**
* 规格型号
*/
specification?: string;
/**
* 特征描述
*/
signalment?: string;
/**
* 物料编码
*/
materialCode?: string;
/**
* 计划到场时间
*/
arrivalTime?: string;
/**
* 计划完成时间
*/
finishTime?: string;
/**
* 计量单位
*/
unit?: string;
/**
* 计划数量
*/
plan?: number;
/**
* 实际数量
*/
realQuantity?: number;
/**
* 备注
*/
remark?: string;
}
export interface CailiaoshebeiQuery extends PageQuery {
/**
* 批次ID
*/
batchId?: string | number;
projectId?: string | number;
batchNumber?: string;
/**
* 供货商ID
*/
supplierId?: string | number;
/**
* 供货商
*/
supplier?: string;
/**
* 设备材料名称
*/
name?: string;
/**
* 供货来源(字典)
*/
supply?: string;
/**
* 规格型号
*/
specification?: string;
/**
* 特征描述
*/
signalment?: string;
/**
* 物料编码
*/
materialCode?: string;
/**
* 计划到场时间
*/
arrivalTime?: string;
/**
* 计划完成时间
*/
finishTime?: string;
/**
* 计量单位
*/
unit?: string;
/**
* 计划数量
*/
plan?: number;
/**
* 实际数量
*/
realQuantity?: number;
/**
* 日期范围参数
*/
params?: any;
}

View File

@ -0,0 +1,99 @@
import request from '@/utils/request';
import { AxiosPromise } from 'axios';
import { CailiaoshebeiVO, CailiaoshebeiForm, CailiaoshebeiQuery } from '@/api/materials/cailiaoshebei/types';
/**
* 查询物资-材料设备列表
* @param query
* @returns {*}
*/
export const listCailiaoshebei = (query?: CailiaoshebeiQuery): AxiosPromise<CailiaoshebeiVO[]> => {
return request({
url: '/cailiaoshebei/materialsorder/planExecutionTrackingList',
method: 'get',
params: query
});
};
/**
* 查询物资-材料设备详细
* @param id
*/
export const getCailiaoshebei = (id: string | number): AxiosPromise<CailiaoshebeiVO> => {
return request({
url: '/cailiaoshebei/cailiaoshebei/' + id,
method: 'get'
});
};
/**
* 新增物资-材料设备
* @param data
*/
export const addCailiaoshebei = (data: CailiaoshebeiForm) => {
return request({
url: '/cailiaoshebei/cailiaoshebei',
method: 'post',
data: data
});
};
/**
* 修改物资-材料设备
* @param data
*/
export const updateCailiaoshebei = (data: CailiaoshebeiForm) => {
return request({
url: '/cailiaoshebei/cailiaoshebei',
method: 'put',
data: data
});
};
/**
* 删除物资-材料设备
* @param id
*/
export const delCailiaoshebei = (id: string | number | Array<string | number>) => {
return request({
url: '/cailiaoshebei/cailiaoshebei/remove/' + id,
method: 'delete'
});
};
/**
* 查询物资-材料设备批次列表
* @param query
* @returns {*}
*/
export const listBatch = (query?: any): AxiosPromise => {
return request({
url: '/cailiaoshebei/materialsorder/trackPcPlanList',
method: 'get',
params: query
});
};
/**
* 新增物资-材料设备批次
* @param data
*/
export const getBatch = (data: any) => {
return request({
url: '/cailiaoshebei/cailiaoshebei/pcAdd',
method: 'post',
data: data
});
};
/**
* 删除物资-材料设备批次
* @param ids
*/
export const delBatch = (ids: string | number | Array<string | number>) => {
return request({
url: '/cailiaoshebei/cailiaoshebei/pcDelete/' + ids,
method: 'delete'
});
};

View File

@ -0,0 +1,99 @@
import request from '@/utils/request';
import { AxiosPromise } from 'axios';
import { CailiaoshebeiVO, CailiaoshebeiForm, CailiaoshebeiQuery } from '@/api/materials/cailiaoshebei/types';
/**
* 查询物资-材料设备列表
* @param query
* @returns {*}
*/
export const listCailiaoshebei = (query?: CailiaoshebeiQuery): AxiosPromise<CailiaoshebeiVO[]> => {
return request({
url: '/cailiaoshebei/cailiaoshebei/listPlan',
method: 'get',
params: query
});
};
/**
* 查询物资-材料设备详细
* @param id
*/
export const getCailiaoshebei = (id: string | number): AxiosPromise<CailiaoshebeiVO> => {
return request({
url: '/cailiaoshebei/cailiaoshebei/getInfoPlanSon/' + id,
method: 'get'
});
};
/**
* 新增物资-材料设备
* @param data
*/
export const addCailiaoshebei = (data: CailiaoshebeiForm) => {
return request({
url: '/cailiaoshebei/cailiaoshebei',
method: 'post',
data: data
});
};
/**
* 修改物资-材料设备
* @param data
*/
export const updateCailiaoshebei = (data: CailiaoshebeiForm) => {
return request({
url: '/cailiaoshebei/cailiaoshebei/editPlanSon',
method: 'put',
data: data
});
};
/**
* 删除物资-材料设备
* @param id
*/
export const delCailiaoshebei = (id: string | number | Array<string | number>) => {
return request({
url: '/cailiaoshebei/cailiaoshebei/remove/' + id,
method: 'delete'
});
};
/**
* 查询物资-材料设备批次列表
* @param query
* @returns {*}
*/
export const listBatch = (query?: any): AxiosPromise => {
return request({
url: '/cailiaoshebei/cailiaoshebei/pcPlanList',
method: 'get',
params: query
});
};
/**
* 新增物资-材料设备批次
* @param data
*/
export const getBatch = (data: any) => {
return request({
url: '/cailiaoshebei/cailiaoshebei/pcAdd',
method: 'post',
data: data
});
};
/**
* 删除物资-材料设备批次
* @param ids
*/
export const delBatch = (ids: string | number | Array<string | number>) => {
return request({
url: '/cailiaoshebei/cailiaoshebei/pcDelete/' + ids,
method: 'delete'
});
};

View File

@ -0,0 +1,228 @@
export interface CailiaoshebeiVO {
/**
* 主键ID
*/
id: string | number;
/**
* 批次ID
*/
batchId: string | number;
/**
* 供货商ID
*/
supplierId: string | number;
/**
* 供货商
*/
supplier: string;
/**
* 设备材料名称
*/
name: string;
/**
* 供货来源(字典)
*/
supply: string;
/**
* 规格型号
*/
specification: string;
/**
* 特征描述
*/
signalment: string;
/**
* 物料编码
*/
materialCode: string;
/**
* 计划到场时间
*/
arrivalTime: string;
/**
* 计划完成时间
*/
finishTime: string;
/**
* 计量单位
*/
unit: string;
/**
* 计划数量
*/
plan: number;
/**
* 实际数量
*/
realQuantity: number;
/**
* 备注
*/
remark: string;
}
export interface CailiaoshebeiForm extends BaseEntity {
/**
* 主键ID
*/
id?: string | number;
projectId?: string | number;
batchNumber?: string | number;
/**
* 批次ID
*/
batchId?: string | number;
/**
* 供货商ID
*/
supplierId?: string | number;
/**
* 供货商
*/
supplier?: string;
/**
* 设备材料名称
*/
name?: string;
/**
* 供货来源(字典)
*/
supply?: string;
/**
* 规格型号
*/
specification?: string;
/**
* 特征描述
*/
signalment?: string;
/**
* 物料编码
*/
materialCode?: string;
/**
* 计划到场时间
*/
arrivalTime?: string;
/**
* 计划完成时间
*/
finishTime?: string;
/**
* 计量单位
*/
unit?: string;
/**
* 计划数量
*/
plan?: number;
/**
* 实际数量
*/
realQuantity?: number;
/**
* 备注
*/
remark?: string;
}
export interface CailiaoshebeiQuery extends PageQuery {
/**
* 批次ID
*/
batchId?: string | number;
projectId?: string | number;
batchNumber?: string;
/**
* 供货商ID
*/
supplierId?: string | number;
/**
* 供货商
*/
supplier?: string;
/**
* 设备材料名称
*/
name?: string;
/**
* 供货来源(字典)
*/
supply?: string;
/**
* 规格型号
*/
specification?: string;
/**
* 特征描述
*/
signalment?: string;
/**
* 物料编码
*/
materialCode?: string;
/**
* 计划到场时间
*/
arrivalTime?: string;
/**
* 计划完成时间
*/
finishTime?: string;
/**
* 计量单位
*/
unit?: string;
/**
* 计划数量
*/
plan?: number;
/**
* 实际数量
*/
realQuantity?: number;
/**
* 日期范围参数
*/
params?: any;
}

View File

@ -74,3 +74,27 @@ export const getMonth = (query: any): AxiosPromise => {
params: query params: query
}); });
}; };
/**
* 检查月度产值计划是否提交
* @param id
* @returns {*}
*/
export const isSubmit = (id): AxiosPromise => {
return request({
url: '/out/monthPlan/isSubmit/' + id,
method: 'get'
});
};
/**
* 查询月度产值计划详细(审批)
* @param id
*/
export const getMonthInfo = (query): AxiosPromise<MonthPlanVO> => {
return request({
url: '/out/monthPlan/monthInfo',
method: 'get',
params: query
});
};

View File

@ -9,7 +9,9 @@ export default {
path: routerJumpVo.formPath ? '/' + routerJumpVo.formPath : routerJumpVo.formPath, path: routerJumpVo.formPath ? '/' + routerJumpVo.formPath : routerJumpVo.formPath,
query: { query: {
id: routerJumpVo.businessId, id: routerJumpVo.businessId,
businessId: routerJumpVo.businessId,
type: routerJumpVo.type, type: routerJumpVo.type,
planMonth: routerJumpVo.planMonth,
taskId: routerJumpVo.taskId taskId: routerJumpVo.taskId
} }
}); });

View File

@ -83,6 +83,8 @@ const init = async (businessId: string | number) => {
loading.value = true; loading.value = true;
tabActiveName.value = 'image'; tabActiveName.value = 'image';
historyList.value = []; historyList.value = [];
console.log('🚀 ~ init ~ businessId:', businessId);
flowHisTaskList(businessId).then((resp) => { flowHisTaskList(businessId).then((resp) => {
if (resp.data) { if (resp.data) {
historyList.value = resp.data.list; historyList.value = resp.data.list;

View File

@ -0,0 +1,396 @@
<template>
<div class="p-2">
<el-row :gutter="20">
<!-- 流程分类树 -->
<el-col style="" :span="5">
<el-card shadow="hover">
<template #header>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5" :offset="0"
><el-button type="primary" size="default" @click="addBatch" icon="FolderAdd" plain>新增</el-button></el-col
>
<el-col :span="1.5" :offset="0"
><el-button type="danger" size="default" @click="handleDeleteBatch" icon="FolderDelete" plain>删除</el-button></el-col
>
</el-row>
</template>
<el-input v-model="queryParams.batchNumber" placeholder="请输入批次号" @input="getBatchList" prefix-icon="Search" clearable />
<el-tree
ref="batchTreeRef"
class="mt-2"
node-key="batchNumber"
:data="batchOptions"
:props="{ label: 'batchNumber', children: 'children' }"
:expand-on-click-node="false"
highlight-current
default-expand-all
@node-click="handleNodeClick"
></el-tree>
<pagination
v-show="total > 0"
:total="total"
v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize"
@pagination="getBatchList"
layout="prev, pager, next,jumper"
/>
</el-card>
</el-col>
<el-col :span="19">
<el-card shadow="never">
<template #header>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="SemiSelect" @click="handleAdd" v-hasPermi="['cailiaoshebei:cailiaoshebei:add']">选择</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="success" plain icon="Check" @click="submitForm" v-hasPermi="['cailiaoshebei:cailiaoshebei:delete']">保存</el-button>
</el-col>
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
</template>
<el-table v-loading="loading" :data="cailiaoshebeiList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<!-- <el-table-column label="供货商ID" align="center" prop="supplierId" /> -->
<el-table-column label="供货商" align="center" prop="supplierCompany" />
<el-table-column label="设备材料名称" align="center" prop="name" />
<el-table-column label="规格型号" align="center" prop="specification" />
<el-table-column label="物料编码" align="center" prop="materialCode" width="200" />
<el-table-column label="计量单位" align="center" prop="unit" width="80" />
<el-table-column label="供应周期(天)" align="center" prop="estimatedCycle" />
<el-table-column label="需求数量" align="center" prop="demandQuantity">
<template #default="scope">
<el-input v-model="scope.row.demandQuantity" type="number" />
</template>
</el-table-column>
<el-table-column label="计划到场时间" align="center" prop="arrivalTime" width="250">
<template #default="scope">
<div class="flex justify-center w100%">
<el-date-picker v-model="scope.row.arrivalTime" type="date" value-format="YYYY-MM-DD" />
</div>
</template>
</el-table-column>
<el-table-column label="流程状态" align="center" prop="planAuditStatus">
<template #default="scope">
<dict-tag :options="wf_business_status" :value="scope.row.planAuditStatus" />
</template>
</el-table-column>
<el-table-column label="操作" align="center" width="150">
<template #default="scope">
<el-button link type="primary" icon="Finished" @click="handleAudit(scope.row)" v-hasPermi="['out:monthPlan:remove']">审核</el-button>
</template>
</el-table-column>
</el-table>
</el-card>
</el-col>
</el-row>
<!-- 添加或修改物资-材料设备对话框 -->
<el-dialog :title="dialog.title" v-model="dialog.visible" width="650px" append-to-body>
<el-transfer
v-model="cailiaoshebeiSelectedList"
filterable
:data="cailiaoshebeiAllList"
:props="{
label: 'name',
key: 'id'
}"
/>
<template #footer>
<div class="dialog-footer">
<el-button :loading="buttonLoading" type="primary" @click="submitTransferForm"> </el-button>
<el-button @click="cancel"> </el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup name="Cailiaoshebei" lang="ts">
import {
listCailiaoshebei,
getCailiaoshebei,
delCailiaoshebei,
addCailiaoshebei,
updateCailiaoshebei,
listBatch,
getBatch,
delBatch
} from '@/api/materials/batchPlan';
import { CailiaoshebeiVO, CailiaoshebeiQuery, CailiaoshebeiForm } from '@/api/materials/batchPlan/types';
import { listContractor } from '@/api/project/contractor';
import { useUserStoreHook } from '@/store/modules/user';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { supply } = toRefs<any>(proxy?.useDict('supply'));
// 获取用户 store
const userStore = useUserStoreHook();
// 从 store 中获取项目列表和当前选中的项目
const currentProject = computed(() => userStore.selectedProject);
const batchTreeRef = ref<any>(null);
const cailiaoshebeiList = ref<CailiaoshebeiVO[]>([]);
const cailiaoshebeiAllList = ref<CailiaoshebeiVO[]>([]);
const cailiaoshebeiSelectedList = ref([]);
const buttonLoading = ref(false);
const loading = ref(false);
const showSearch = ref(true);
const ids = ref<Array<string | number>>([]);
const single = ref(true);
const multiple = ref(true);
const total = ref(0);
const batchOptions = ref<any[]>([]);
const { wf_business_status } = toRefs<any>(proxy?.useDict('wf_business_status'));
const queryFormRef = ref<ElFormInstance>();
const cailiaoshebeiFormRef = ref<ElFormInstance>();
const dialog = reactive<DialogOption>({
visible: false,
title: ''
});
const initFormData: CailiaoshebeiForm = {
id: undefined,
batchNumber: undefined,
supplierId: undefined,
addDataList: [],
supplier: undefined,
name: undefined,
supply: undefined,
specification: undefined,
signalment: undefined,
materialCode: undefined,
arrivalTime: undefined,
approvalProject: undefined,
finishTime: undefined,
unit: undefined,
plan: undefined,
realQuantity: undefined,
projectId: currentProject.value.id,
remark: undefined
};
const data = reactive<PageData<CailiaoshebeiForm, CailiaoshebeiQuery>>({
form: { ...initFormData },
queryParams: {
pageNum: 1,
pageSize: 10,
batchNumber: undefined,
supplierId: undefined,
supplier: undefined,
name: undefined,
projectId: currentProject.value.id,
supply: undefined,
specification: undefined,
signalment: undefined,
materialCode: undefined,
arrivalTime: undefined,
finishTime: undefined,
unit: undefined,
plan: undefined,
realQuantity: undefined,
params: {}
},
rules: {
id: [{ required: true, message: '主键ID不能为空', trigger: 'blur' }]
}
});
const { queryParams, form, rules } = toRefs(data);
/** 查询物资-材料设备列表 */
const getList = async () => {
loading.value = true;
const res = await listCailiaoshebei(queryParams.value);
cailiaoshebeiList.value = res.rows;
loading.value = false;
};
//查询批次列表
const getBatchList = async () => {
const res = await listBatch(queryParams.value);
console.log('🚀 ~ getBatchList ~ res:', res);
batchOptions.value = res.rows;
total.value = res.total;
try {
batchTreeRef.value.setCurrentKey(res.rows[0].batchNumber);
form.value.batchNumber = res.rows[0].batchNumber;
form.value.approvalProject = res.rows[0].approvalProject;
} catch (error) {
form.value.batchNumber = '';
}
getList();
};
/** 节点单击事件 */
const handleNodeClick = (data: any) => {
queryParams.value.batchNumber = data.batchNumber;
form.value.batchNumber = data.batchNumber;
form.value.approvalProject = data.approvalProject;
console.log('🚀 ~ handleNodeClick ~ form.value:', form.value);
if (data.batchNumber === '0') {
queryParams.value.batchNumber = '';
}
getList();
};
/** 取消按钮 */
const cancel = () => {
reset();
dialog.visible = false;
};
/** 表单重置 */
const reset = () => {
const preservedBatchId = form.value.batchNumber; // 先保存当前的 batchNumber
form.value = { ...initFormData, batchNumber: preservedBatchId }; // 重置但保留
cailiaoshebeiFormRef.value?.resetFields();
};
/** 搜索按钮操作 */
const handleQuery = () => {
queryParams.value.pageNum = 1;
getList();
};
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value?.resetFields();
handleQuery();
};
/** 多选框选中数据 */
const handleSelectionChange = (selection: CailiaoshebeiVO[]) => {
ids.value = selection.map((item) => item.id);
single.value = selection.length != 1;
multiple.value = !selection.length;
};
/** 新增按钮操作 */
const handleAdd = () => {
reset();
listCailiaoshebei({
projectId: currentProject.value.id
}).then((res) => {
cailiaoshebeiAllList.value = res.rows;
});
dialog.visible = true;
dialog.title = '选择物资-材料设备';
};
/** 修改按钮操作 */
// const handleUpdate = async (row?: CailiaoshebeiVO) => {
// reset();
// const _id = row?.id || ids.value[0];
// const res = await getCailiaoshebei(_id);
// Object.assign(form.value, res.data);
// selectValue.value = (form.value.supplierId as string).split(',');
// dialog.visible = true;
// dialog.title = '修改物资-材料设备';
// };
/** 提交按钮 */
const submitForm = async () => {
buttonLoading.value = true;
cailiaoshebeiList.value.forEach((item) => {
if (item.id) {
delete item.id;
}
});
await addCailiaoshebei({ addDataList: cailiaoshebeiList.value } as any).finally(() => (buttonLoading.value = false));
proxy?.$modal.msgSuccess('操作成功');
dialog.visible = false;
};
/** 提交穿梭框数据 */
const submitTransferForm = async () => {
cailiaoshebeiList.value = cailiaoshebeiSelectedList.value.map((id) => {
const item = cailiaoshebeiAllList.value.find((option) => option.id === id);
return item;
});
dialog.visible = false;
};
/** 新增批次 */
const addBatch = async () => {
await proxy?.$modal.confirm('是否确认新增批次?').finally(() => (loading.value = false));
const res = await getBatch({ projectId: currentProject.value.id });
console.log('🚀 ~ addBatch ~ res:', res);
await getBatchList();
proxy?.$modal.msgSuccess('新增成功');
};
/** 删除批次 */
const handleDeleteBatch = async () => {
const _ids = batchTreeRef.value.getCurrentNode()?.id;
await proxy?.$modal.confirm('是否确认删除批次编号为"' + _ids + '"的数据项?').finally(() => (loading.value = false));
await delBatch(_ids);
proxy?.$modal.msgSuccess('删除成功');
queryParams.value.batchNumber = '';
await getBatchList();
};
/** 删除按钮操作 */
const handleDelete = async (row?: CailiaoshebeiVO) => {
const _ids = row?.id || ids.value;
await proxy?.$modal.confirm('是否确认删除物资-材料设备编号为"' + _ids + '"的数据项?').finally(() => (loading.value = false));
await delCailiaoshebei(_ids);
proxy?.$modal.msgSuccess('删除成功');
await getList();
};
/** 审核按钮操作 */
const handleAudit = async (row?: CailiaoshebeiVO) => {
const data = {
...row,
approvalProject: form.value.approvalProject
};
proxy?.$tab.openPage('/materials-management/batchPlan/indexEdit', '审核物资设备批次需求计划', {
id: row?.id,
data: JSON.stringify(data),
type: 'update'
});
};
/** 查询供货商列表 */
const supplierOptions = ref([]);
const getSupplierList = async () => {
const res = await listContractor({
projectId: currentProject.value.id,
pageNum: 1,
pageSize: 10000
});
supplierOptions.value = res.rows;
};
onMounted(() => {
getBatchList();
getSupplierList();
});
//监听项目id刷新数据
const listeningProject = watch(
() => currentProject.value.id,
(nid, oid) => {
queryParams.value.projectId = nid;
form.value.projectId = nid;
getBatchList();
getSupplierList();
}
);
onUnmounted(() => {
listeningProject();
});
</script>

View File

@ -0,0 +1,401 @@
<template>
<div class="p-4 bg-gray-50">
<div class="max-w-4xl mx-auto">
<!-- 顶部按钮区域 -->
<el-card class="mb-4 rounded-lg shadow-sm bg-white border border-gray-100 transition-all hover:shadow-md">
<approvalButton
@submitForm="submitForm"
@approvalVerifyOpen="approvalVerifyOpen"
@handleApprovalRecord="handleApprovalRecord"
:buttonLoading="buttonLoading"
:id="form.id"
:status="form.approvalProject"
:pageType="routeParams.type"
/>
</el-card>
<!-- 表单区域 -->
<el-card class="rounded-lg shadow-sm bg-white border border-gray-100 transition-all hover:shadow-md overflow-hidden">
<div class="p-4 bg-gradient-to-r from-blue-50 to-indigo-50 border-b border-gray-100">
<h3 class="text-lg font-semibold text-gray-800">施工产值</h3>
</div>
<div class="p-6">
<el-form
ref="leaveFormRef"
v-loading="loading"
:disabled="routeParams.type === 'view'"
:model="form"
:rules="rules"
label-width="120px"
class="space-y-4"
>
<el-row :gutter="20" justify="center">
<el-col :span="12" :offset="0">
<el-form-item label="计划到场时间" prop="arrivalTime">
<el-date-picker
clearable
v-model="form.arrivalTime"
disabled
type="date"
value-format="YYYY-MM-DD"
placeholder="请选择计划到场时间"
>
</el-date-picker>
</el-form-item>
<el-form-item label="计划完成时间" prop="finishTime">
<el-date-picker clearable v-model="form.finishTime" disabled type="date" value-format="YYYY-MM-DD" placeholder="请选择计划完成时间">
</el-date-picker>
</el-form-item>
<div v-for="(item, index) in selectValue" :key="index">
<el-divider content-position="center"
><el-text tag="b">{{ item }}</el-text></el-divider
>
<el-form-item label="单价" prop="unitPrice">
<el-input v-model="form.listOfMaterialInventory[index].unitPrice" type="number" disabled placeholder="请输入单价" />
</el-form-item>
<el-form-item label="数量" prop="num">
<el-input v-model="form.listOfMaterialInventory[index].num" type="number" disabled placeholder="请输入数量" />
</el-form-item>
<el-form-item label="合同号" prop="contractNum">
<el-input v-model="form.listOfMaterialInventory[index].contractNum" disabled placeholder="请输入合同号" />
</el-form-item>
<el-form-item label="预估供应周期" prop="estimatedCycle">
<el-input v-model="form.listOfMaterialInventory[index].estimatedCycle" disabled type="number" placeholder="请输入预估供应周期" />
</el-form-item>
<el-form-item label="供货公司" prop="supplierCompany">
<el-input v-model="form.listOfMaterialInventory[index].supplierCompany" disabled placeholder="请输入供货公司" />
</el-form-item>
</div>
</el-col>
</el-row>
</el-form>
</div>
</el-card>
<!-- 提交组件 -->
<submitVerify ref="submitVerifyRef" :task-variables="taskVariables" @submit-callback="submitCallback" />
<approvalRecord ref="approvalRecordRef"></approvalRecord>
<!-- 流程选择对话框 -->
<el-dialog
draggable
v-model="dialogVisible.visible"
:title="dialogVisible.title"
:before-close="handleClose"
width="500"
class="rounded-lg shadow-lg"
>
<div class="p-4">
<p class="text-gray-600 mb-4">请选择要启动的流程</p>
<el-select v-model="flowCode" placeholder="请选择流程" style="width: 100%">
<el-option v-for="item in flowCodeOptions" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</div>
<template #footer>
<div class="dialog-footer p-4 border-t border-gray-100 flex justify-end space-x-3">
<el-button @click="handleClose" class="px-4 py-2 border border-gray-300 rounded-md text-gray-700 hover:bg-gray-50 transition-colors"
>取消</el-button
>
<el-button type="primary" @click="submitFlow()" class="px-4 py-2 bg-primary text-white rounded-md hover:bg-primary/90 transition-colors"
>确认</el-button
>
</div>
</template>
</el-dialog>
</div>
</div>
</template>
<script setup name="Leave" lang="ts">
import { LeaveForm, LeaveQuery, LeaveVO } from '@/api/workflow/leave/types';
import { startWorkFlow } from '@/api/workflow/task';
import SubmitVerify from '@/components/Process/submitVerify.vue';
import ApprovalRecord from '@/components/Process/approvalRecord.vue';
import ApprovalButton from '@/components/Process/approvalButton.vue';
import { StartProcessBo } from '@/api/workflow/workflowCommon/types';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
import { useUserStoreHook } from '@/store/modules/user';
const { design_change_reason_type } = toRefs<any>(proxy?.useDict('design_change_reason_type'));
import { getKnowledgeDocument } from '@/api/design/technicalStandard';
import { getConstructionValue } from '@/api/out/constructionValue';
import { workScheduleListDetail } from '@/api/progress/plan';
import { getCailiaoshebei } from '@/api/materials/suppliesprice';
// 获取用户 store
const userStore = useUserStoreHook();
// 从 store 中获取项目列表和当前选中的项目
const currentProject = computed(() => userStore.selectedProject);
const buttonLoading = ref(false);
const loading = ref(true);
//路由参数
const routeParams = ref<Record<string, any>>({});
const flowCode = ref<string>('');
const status = ref<string>('');
const dialogVisible = reactive<DialogOption>({
visible: false,
title: '流程定义'
});
//提交组件
const submitVerifyRef = ref<InstanceType<typeof SubmitVerify>>();
//审批记录组件
const approvalRecordRef = ref<InstanceType<typeof ApprovalRecord>>();
//按钮组件
const flowCodeOptions = [
{
value: currentProject.value?.id + '_batchRequirements',
label: '物资供应总计划审批'
}
];
const leaveFormRef = ref<ElFormInstance>();
const dialog = reactive({
visible: false,
title: '',
isEdit: false
});
const submitFormData = ref<StartProcessBo>({
businessId: '',
flowCode: '',
variables: {}
});
const taskVariables = ref<Record<string, any>>({});
const selectValue = ref<string[]>([]);
const initFormData = {
id: undefined,
batchNumber: undefined,
supplierId: undefined,
supplier: undefined,
name: undefined,
supply: undefined,
specification: undefined,
signalment: undefined,
materialCode: undefined,
arrivalTime: undefined,
finishTime: undefined,
unit: undefined,
plan: undefined,
realQuantity: undefined,
projectId: currentProject.value.id,
listOfMaterialInventory: [],
remark: undefined
};
const data = reactive({
form: { ...initFormData },
rules: {}
});
const handleClose = () => {
dialogVisible.visible = false;
flowCode.value = '';
buttonLoading.value = false;
};
const { form, rules } = toRefs(data);
/** 表单重置 */
const reset = () => {
form.value = { ...initFormData };
leaveFormRef.value?.resetFields();
};
/** 获取详情 */
const getInfo = () => {
loading.value = true;
buttonLoading.value = false;
nextTick(async () => {
const res = JSON.parse(routeParams.value.data);
Object.assign(form.value, res.data);
selectValue.value = (form.value.supplier as string).split(',');
if (!form.value.listOfMaterialInventory.length) {
form.value.listOfMaterialInventory = selectValue.value.map((item) => {
return {
supplierCompany: item,
estimatedCycle: '',
contractNum: '',
num: '',
unitPrice: ''
};
});
}
loading.value = false;
buttonLoading.value = false;
});
};
/** 提交按钮 */
const submitForm = (status1: string) => {
status.value = status1;
submit(status.value, form.value);
};
const submitFlow = async () => {
handleStartWorkFlow(form.value);
dialogVisible.visible = false;
};
//提交申请
const handleStartWorkFlow = async (data: LeaveForm) => {
try {
submitFormData.value.flowCode = flowCode.value;
submitFormData.value.businessId = data.id;
//流程变量
taskVariables.value = {
// leave4/5 使用的流程变量
userList: ['1', '3', '4']
};
submitFormData.value.variables = taskVariables.value;
const resp = await startWorkFlow(submitFormData.value);
if (submitVerifyRef.value) {
buttonLoading.value = false;
submitVerifyRef.value.openDialog(resp.data.taskId);
}
} finally {
buttonLoading.value = false;
}
};
//审批记录
const handleApprovalRecord = () => {
approvalRecordRef.value.init(form.value.id);
};
//提交回调
const submitCallback = async () => {
await proxy.$tab.closePage(proxy.$route);
proxy.$router.go(-1);
};
//审批
const approvalVerifyOpen = async () => {
submitVerifyRef.value.openDialog(routeParams.value.taskId);
};
// 图纸上传成功之后 开始提交
const submit = async (status, data) => {
form.value = data;
if (status === 'draft') {
buttonLoading.value = false;
proxy?.$modal.msgSuccess('暂存成功');
proxy.$tab.closePage(proxy.$route);
proxy.$router.go(-1);
} else {
if ((form.value.approvalProject === 'draft' && (flowCode.value === '' || flowCode.value === null)) || routeParams.value.type === 'add') {
flowCode.value = flowCodeOptions[0].value;
dialogVisible.visible = true;
return;
}
//说明启动过先随意穿个参数
if (flowCode.value === '' || flowCode.value === null) {
flowCode.value = 'xx';
}
await handleStartWorkFlow(data);
}
};
onMounted(() => {
nextTick(async () => {
routeParams.value = proxy.$route.query;
console.log('🚀 ~ proxy.$route.query:', proxy.$route.query);
reset();
loading.value = false;
if (routeParams.value.type === 'update' || routeParams.value.type === 'view' || routeParams.value.type === 'approval') {
getInfo();
}
});
});
</script>
<style scoped lang="scss">
/* 全局样式 */
:root {
--primary: #409eff;
--primary-light: #66b1ff;
--primary-dark: #3a8ee6;
--success: #67c23a;
--warning: #e6a23c;
--danger: #f56c6c;
--info: #909399;
}
/* 表单样式优化 */
.el-form-item {
.el-form-item__label {
color: #606266;
font-weight: 500;
}
.el-input__inner,
.el-select .el-input__inner {
border-radius: 4px;
transition:
border-color 0.2s,
box-shadow 0.2s;
&:focus {
border-color: var(--primary-light);
box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.1);
}
}
.el-textarea__inner {
border-radius: 4px;
transition:
border-color 0.2s,
box-shadow 0.2s;
&:focus {
border-color: var(--primary-light);
box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.1);
}
}
}
/* 按钮样式优化 */
.el-button {
border-radius: 4px;
transition: all 0.2s;
&.is-primary {
background-color: var(--primary);
border-color: var(--primary);
&:hover {
background-color: var(--primary-light);
border-color: var(--primary-light);
}
&:active {
background-color: var(--primary-dark);
border-color: var(--primary-dark);
}
}
&.is-text {
color: var(--primary);
&:hover {
color: var(--primary-light);
background-color: rgba(64, 158, 255, 0.05);
}
}
}
/* 卡片样式优化 */
.el-card {
transition: all 0.3s ease;
&:hover {
/* transform: translateY(-2px); */
}
}
/* 对话框样式优化 */
.el-dialog {
.el-dialog__header {
background-color: #f5f7fa;
border-bottom: 1px solid #ebeef5;
padding: 15px 20px;
}
.el-dialog__title {
font-size: 16px;
font-weight: 600;
color: #303133;
}
.el-dialog__footer {
padding: 15px 20px;
border-top: 1px solid #ebeef5;
}
}
</style>

View File

@ -53,14 +53,16 @@
</transition>--> </transition>-->
<el-row :gutter="20"> <el-row :gutter="20">
<!-- 流程分类树 --> <!-- 流程分类树 -->
<el-col :lg="4" :xs="24" style=""> <el-col style="" :span="5">
<el-card shadow="hover"> <el-card shadow="hover">
<template #header> <template #header>
<el-row :gutter="10" class="mb8"> <el-row :gutter="10" class="mb8">
<el-col :span="1.5" :offset="0" <el-col :span="1.5" :offset="0"
><el-button type="primary" size="default" @click="addBatch" icon="FolderAdd" plain>新增</el-button></el-col ><el-button type="primary" size="default" @click="addBatch" icon="FolderAdd" plain>新增</el-button></el-col
> >
<el-col :span="1.5" :offset="0"><el-button type="danger" size="default" @click="" icon="FolderDelete" plain>删除</el-button></el-col> <el-col :span="1.5" :offset="0"
><el-button type="danger" size="default" @click="handleDeleteBatch" icon="FolderDelete" plain>删除</el-button></el-col
>
</el-row> </el-row>
</template> </template>
@ -82,10 +84,11 @@
v-model:page="queryParams.pageNum" v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize" v-model:limit="queryParams.pageSize"
@pagination="getBatchList" @pagination="getBatchList"
layout="prev, pager, next,jumper"
/> />
</el-card> </el-card>
</el-col> </el-col>
<el-col :lg="20" :xs="24"> <el-col :span="19">
<el-card shadow="never"> <el-card shadow="never">
<template #header> <template #header>
<el-row :gutter="10" class="mb8"> <el-row :gutter="10" class="mb8">
@ -114,10 +117,13 @@
>删除</el-button >删除</el-button
> >
</el-col> </el-col>
<el-col :span="1.5"> <!-- <el-col :span="1.5">
<el-button type="warning" plain icon="Download" @click="handleExport" v-hasPermi="['cailiaoshebei:cailiaoshebei:export']" <el-button type="warning" plain icon="Download" @click="handleExport" v-hasPermi="['cailiaoshebei:cailiaoshebei:export']"
>导出</el-button >导出</el-button
> >
</el-col> -->
<el-col :span="1.5">
<el-button plain type="warning" icon="Finished" @click="handleAudit()" v-hasPermi="['out:monthPlan:remove']">审核</el-button>
</el-col> </el-col>
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar> <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row> </el-row>
@ -186,7 +192,7 @@
<el-input v-model="form.supplierId" placeholder="请输入供货商ID" /> <el-input v-model="form.supplierId" placeholder="请输入供货商ID" />
</el-form-item> --> </el-form-item> -->
<el-form-item label="供货商" prop="supplier"> <el-form-item label="供货商" prop="supplier">
<el-select v-model="form.supplierId" value-key="id" placeholder="请选择供货商" clearable filterable @change="handleChange"> <el-select v-model="selectValue" value-key="id" multiple placeholder="请选择供货商" clearable filterable>
<el-option v-for="item in supplierOptions" :key="item.id" :label="item.name" :value="item.id"> </el-option> <el-option v-for="item in supplierOptions" :key="item.id" :label="item.name" :value="item.id"> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
@ -246,7 +252,8 @@ import {
addCailiaoshebei, addCailiaoshebei,
updateCailiaoshebei, updateCailiaoshebei,
listBatch, listBatch,
getBatch getBatch,
delBatch
} from '@/api/materials/cailiaoshebei'; } from '@/api/materials/cailiaoshebei';
import { CailiaoshebeiVO, CailiaoshebeiQuery, CailiaoshebeiForm } from '@/api/materials/cailiaoshebei/types'; import { CailiaoshebeiVO, CailiaoshebeiQuery, CailiaoshebeiForm } from '@/api/materials/cailiaoshebei/types';
import { listContractor } from '@/api/project/contractor'; import { listContractor } from '@/api/project/contractor';
@ -292,6 +299,7 @@ const initFormData: CailiaoshebeiForm = {
unit: undefined, unit: undefined,
plan: undefined, plan: undefined,
realQuantity: undefined, realQuantity: undefined,
approvalDesign: undefined,
projectId: currentProject.value.id, projectId: currentProject.value.id,
remark: undefined remark: undefined
}; };
@ -335,11 +343,14 @@ const getList = async () => {
//查询批次列表 //查询批次列表
const getBatchList = async () => { const getBatchList = async () => {
const res = await listBatch(queryParams.value); const res = await listBatch(queryParams.value);
console.log('🚀 ~ getBatchList ~ res:', res);
batchOptions.value = res.rows; batchOptions.value = res.rows;
total.value = res.total; total.value = res.total;
try { try {
batchTreeRef.value.setCurrentKey(res.rows[0].batchNumber); batchTreeRef.value.setCurrentKey(res.rows[0].batchNumber);
queryParams.value.batchNumber = res.rows[0].batchNumber;
form.value.batchNumber = res.rows[0].batchNumber; form.value.batchNumber = res.rows[0].batchNumber;
form.value.batchId = res.rows[0].id;
} catch (error) { } catch (error) {
form.value.batchNumber = ''; form.value.batchNumber = '';
} }
@ -351,7 +362,7 @@ const getBatchList = async () => {
const handleNodeClick = (data: any) => { const handleNodeClick = (data: any) => {
queryParams.value.batchNumber = data.batchNumber; queryParams.value.batchNumber = data.batchNumber;
form.value.batchNumber = data.batchNumber; form.value.batchNumber = data.batchNumber;
console.log('🚀 ~ handleNodeClick ~ form.value:', form.value); form.value.batchId = data.id;
if (data.batchNumber === '0') { if (data.batchNumber === '0') {
queryParams.value.batchNumber = ''; queryParams.value.batchNumber = '';
} }
@ -403,10 +414,20 @@ const handleUpdate = async (row?: CailiaoshebeiVO) => {
const _id = row?.id || ids.value[0]; const _id = row?.id || ids.value[0];
const res = await getCailiaoshebei(_id); const res = await getCailiaoshebei(_id);
Object.assign(form.value, res.data); Object.assign(form.value, res.data);
selectValue.value = (form.value.supplierId as string).split(',');
dialog.visible = true; dialog.visible = true;
dialog.title = '修改物资-材料设备'; dialog.title = '修改物资-材料设备';
}; };
/** 审核按钮操作 */
const handleAudit = async () => {
proxy?.$tab.openPage('/materials-management/cailiaoshebei/indexEdit', '审核材料设备设计', {
id: form.value.batchId,
number: form.value.batchNumber,
type: 'update'
});
};
/** 提交按钮 */ /** 提交按钮 */
const submitForm = () => { const submitForm = () => {
console.log('🚀 ~ submitForm ~ form.value:', form.value); console.log('🚀 ~ submitForm ~ form.value:', form.value);
@ -428,12 +449,22 @@ const submitForm = () => {
/** 新增批次 */ /** 新增批次 */
const addBatch = async () => { const addBatch = async () => {
await proxy?.$modal.confirm('是否确认新增批次?').finally(() => (loading.value = false)); await proxy?.$modal.confirm('是否确认新增批次?').finally(() => (loading.value = false));
const res = await getBatch({ const res = await getBatch({ projectId: currentProject.value.id });
projectId: currentProject.value.id
});
console.log('🚀 ~ addBatch ~ res:', res); console.log('🚀 ~ addBatch ~ res:', res);
await getBatchList();
proxy?.$modal.msgSuccess('新增成功'); proxy?.$modal.msgSuccess('新增成功');
await getList(); };
/** 删除批次 */
const handleDeleteBatch = async () => {
const _ids = batchTreeRef.value.getCurrentNode()?.id;
await proxy?.$modal.confirm('是否确认删除批次编号为"' + _ids + '"的数据项?').finally(() => (loading.value = false));
await delBatch(_ids);
proxy?.$modal.msgSuccess('删除成功');
queryParams.value.batchNumber = '';
await getBatchList();
}; };
/** 删除按钮操作 */ /** 删除按钮操作 */
@ -467,14 +498,37 @@ const getSupplierList = async () => {
supplierOptions.value = res.rows; supplierOptions.value = res.rows;
}; };
/** 供货商选择器改变事件 */ // 中间数组变量供 el-select 使用
const handleChange = (value: string) => { const selectValue = ref<string[]>([]);
const selectedOption = supplierOptions.value.find((item) => item.id === value);
form.value.supplier = selectedOption?.name || ''; // 监听 selectValue每次变化时同步更新 form.supplierId 和 form.supplier
}; watch(
selectValue,
(newVal) => {
form.value.supplierId = newVal.join(',');
const selectedNames = supplierOptions.value.filter((opt) => newVal.includes(opt.id)).map((opt) => opt.name);
form.value.supplier = selectedNames.join(',');
},
{ immediate: true }
);
onMounted(() => { onMounted(() => {
getBatchList(); getBatchList();
getSupplierList(); getSupplierList();
}); });
//监听项目id刷新数据
const listeningProject = watch(
() => currentProject.value.id,
(nid, oid) => {
queryParams.value.projectId = nid;
form.value.projectId = nid;
getBatchList();
getSupplierList();
}
);
onUnmounted(() => {
listeningProject();
});
</script> </script>

View File

@ -0,0 +1,369 @@
<template>
<div class="p-4 bg-gray-50">
<div class="max-w-4xl mx-auto">
<!-- 顶部按钮区域 -->
<el-card class="mb-4 rounded-lg shadow-sm bg-white border border-gray-100 transition-all hover:shadow-md">
<approvalButton
@submitForm="submitForm"
@approvalVerifyOpen="approvalVerifyOpen"
@handleApprovalRecord="handleApprovalRecord"
:buttonLoading="buttonLoading"
:id="form.id"
:status="form.approvalDesign"
:pageType="routeParams.type"
/>
</el-card>
<!-- 表单区域 -->
<el-card class="rounded-lg shadow-sm bg-white border border-gray-100 transition-all hover:shadow-md overflow-hidden">
<div class="p-4 bg-gradient-to-r from-blue-50 to-indigo-50 border-b border-gray-100">
<h3 class="text-lg font-semibold text-gray-800">设计材料设备</h3>
</div>
<div class="p-6">
<el-form
ref="leaveFormRef"
v-loading="loading"
:disabled="routeParams.type === 'view'"
:model="form"
:rules="rules"
label-width="120px"
class="space-y-4"
>
<el-row :gutter="20" justify="center">
<el-col :span="12" :offset="0">
<el-form-item label="批次号" prop="batchNumber">
<el-input v-model="form.batchNumber" placeholder="请输入批次ID" disabled />
</el-form-item>
<!-- <el-form-item label="供货商ID" prop="supplierId">
<el-input v-model="form.supplierId" placeholder="请输入供货商ID" />
</el-form-item> -->
<el-form-item label="供货商" prop="supplier">
<el-input v-model="form.supplier" disabled></el-input>
</el-form-item>
<el-form-item label="设备材料名称" prop="name">
<el-input v-model="form.name" placeholder="请输入设备材料名称" disabled />
</el-form-item>
<el-form-item label="供货来源" prop="supply">
<el-select v-model="form.supply" value-key="value" placeholder="请选择供货来源" clearable filterable @change="" disabled>
<el-option v-for="item in supply" :key="item.value" :label="item.label" :value="item.value"> </el-option>
</el-select>
</el-form-item>
<el-form-item label="规格型号" prop="specification">
<el-input v-model="form.specification" placeholder="请输入规格型号" disabled />
</el-form-item>
<el-form-item label="特征描述" prop="signalment">
<el-input v-model="form.signalment" placeholder="请输入特征描述" disabled />
</el-form-item>
<el-form-item label="物料编码" prop="materialCode">
<el-input v-model="form.materialCode" placeholder="请输入物料编码" disabled />
</el-form-item>
<el-form-item label="计量单位" prop="unit">
<el-input v-model="form.unit" placeholder="请输入计量单位" disabled />
</el-form-item>
<el-form-item label="计划数量" prop="plan">
<el-input v-model="form.plan" placeholder="请输入计划数量" type="number" disabled />
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" placeholder="请输入内容" disabled />
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
</el-card>
<!-- 提交组件 -->
<submitVerify ref="submitVerifyRef" :task-variables="taskVariables" @submit-callback="submitCallback" />
<approvalRecord ref="approvalRecordRef"></approvalRecord>
<!-- 流程选择对话框 -->
<el-dialog
draggable
v-model="dialogVisible.visible"
:title="dialogVisible.title"
:before-close="handleClose"
width="500"
class="rounded-lg shadow-lg"
>
<div class="p-4">
<p class="text-gray-600 mb-4">请选择要启动的流程</p>
<el-select v-model="flowCode" placeholder="请选择流程" style="width: 100%">
<el-option v-for="item in flowCodeOptions" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</div>
<template #footer>
<div class="dialog-footer p-4 border-t border-gray-100 flex justify-end space-x-3">
<el-button @click="handleClose" class="px-4 py-2 border border-gray-300 rounded-md text-gray-700 hover:bg-gray-50 transition-colors"
>取消</el-button
>
<el-button type="primary" @click="submitFlow()" class="px-4 py-2 bg-primary text-white rounded-md hover:bg-primary/90 transition-colors"
>确认</el-button
>
</div>
</template>
</el-dialog>
</div>
</div>
</template>
<script setup name="Leave" lang="ts">
import { LeaveForm, LeaveQuery, LeaveVO } from '@/api/workflow/leave/types';
import { startWorkFlow } from '@/api/workflow/task';
import SubmitVerify from '@/components/Process/submitVerify.vue';
import ApprovalRecord from '@/components/Process/approvalRecord.vue';
import ApprovalButton from '@/components/Process/approvalButton.vue';
import { StartProcessBo } from '@/api/workflow/workflowCommon/types';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
import { useUserStoreHook } from '@/store/modules/user';
import { getCailiaoshebei, listCailiaoshebei } from '@/api/materials/cailiaoshebei';
// 获取用户 store
const userStore = useUserStoreHook();
// 从 store 中获取项目列表和当前选中的项目
const currentProject = computed(() => userStore.selectedProject);
const buttonLoading = ref(false);
const loading = ref(true);
//路由参数
const routeParams = ref<Record<string, any>>({});
const flowCode = ref<string>('');
const status = ref<string>('');
const dialogVisible = reactive<DialogOption>({
visible: false,
title: '流程定义'
});
//提交组件
const submitVerifyRef = ref<InstanceType<typeof SubmitVerify>>();
//审批记录组件
const approvalRecordRef = ref<InstanceType<typeof ApprovalRecord>>();
//按钮组件
const flowCodeOptions = [
{
value: currentProject.value?.id + '_materialDesign',
label: '材料设备设计审批'
}
];
const leaveFormRef = ref<ElFormInstance>();
const dialog = reactive({
visible: false,
title: '',
isEdit: false
});
const { supply } = toRefs<any>(proxy?.useDict('supply'));
const submitFormData = ref<StartProcessBo>({
businessId: '',
flowCode: '',
variables: {}
});
const taskVariables = ref<Record<string, any>>({});
const selectValue = ref<string[]>([]);
const initFormData = [];
const data = reactive({
form: { ...initFormData },
rules: {}
});
const handleClose = () => {
dialogVisible.visible = false;
flowCode.value = '';
buttonLoading.value = false;
};
const { form, rules } = toRefs(data);
/** 表单重置 */
const reset = () => {
form.value = { ...initFormData };
leaveFormRef.value?.resetFields();
};
/** 获取详情 */
const getInfo = () => {
loading.value = true;
buttonLoading.value = false;
nextTick(async () => {
const res = await listCailiaoshebei({ pageNum: 1, pageSize: 10, batchNumber: routeParams.value.batchNumber });
form.value = res.rows;
loading.value = false;
buttonLoading.value = false;
});
};
/** 提交按钮 */
const submitForm = (status1: string) => {
status.value = status1;
submit(status.value, form.value);
};
const submitFlow = async () => {
handleStartWorkFlow(form.value);
dialogVisible.visible = false;
};
//提交申请
const handleStartWorkFlow = async (data: LeaveForm) => {
try {
submitFormData.value.flowCode = flowCode.value;
submitFormData.value.businessId = data.id;
//流程变量
taskVariables.value = {
// leave4/5 使用的流程变量
userList: ['1', '3', '4']
};
submitFormData.value.variables = taskVariables.value;
const resp = await startWorkFlow(submitFormData.value);
if (submitVerifyRef.value) {
buttonLoading.value = false;
submitVerifyRef.value.openDialog(resp.data.taskId);
}
} finally {
buttonLoading.value = false;
}
};
//审批记录
const handleApprovalRecord = () => {
approvalRecordRef.value.init(form.value.id);
};
//提交回调
const submitCallback = async () => {
await proxy.$tab.closePage(proxy.$route);
proxy.$router.go(-1);
};
//审批
const approvalVerifyOpen = async () => {
submitVerifyRef.value.openDialog(routeParams.value.taskId);
};
// 图纸上传成功之后 开始提交
const submit = async (status, data) => {
form.value = data;
if (status === 'draft') {
buttonLoading.value = false;
proxy?.$modal.msgSuccess('暂存成功');
proxy.$tab.closePage(proxy.$route);
proxy.$router.go(-1);
} else {
if ((form.value.approvalDesign === 'draft' && (flowCode.value === '' || flowCode.value === null)) || routeParams.value.type === 'add') {
flowCode.value = flowCodeOptions[0].value;
dialogVisible.visible = true;
return;
}
//说明启动过先随意穿个参数
if (flowCode.value === '' || flowCode.value === null) {
flowCode.value = 'xx';
}
await handleStartWorkFlow(data);
}
};
onMounted(() => {
nextTick(async () => {
routeParams.value = proxy.$route.query;
console.log('🚀 ~ proxy.$route.query:', proxy.$route.query);
reset();
loading.value = false;
if (routeParams.value.type === 'update' || routeParams.value.type === 'view' || routeParams.value.type === 'approval') {
getInfo();
}
});
});
</script>
<style scoped lang="scss">
/* 全局样式 */
:root {
--primary: #409eff;
--primary-light: #66b1ff;
--primary-dark: #3a8ee6;
--success: #67c23a;
--warning: #e6a23c;
--danger: #f56c6c;
--info: #909399;
}
/* 表单样式优化 */
.el-form-item {
.el-form-item__label {
color: #606266;
font-weight: 500;
}
.el-input__inner,
.el-select .el-input__inner {
border-radius: 4px;
transition:
border-color 0.2s,
box-shadow 0.2s;
&:focus {
border-color: var(--primary-light);
box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.1);
}
}
.el-textarea__inner {
border-radius: 4px;
transition:
border-color 0.2s,
box-shadow 0.2s;
&:focus {
border-color: var(--primary-light);
box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.1);
}
}
}
/* 按钮样式优化 */
.el-button {
border-radius: 4px;
transition: all 0.2s;
&.is-primary {
background-color: var(--primary);
border-color: var(--primary);
&:hover {
background-color: var(--primary-light);
border-color: var(--primary-light);
}
&:active {
background-color: var(--primary-dark);
border-color: var(--primary-dark);
}
}
&.is-text {
color: var(--primary);
&:hover {
color: var(--primary-light);
background-color: rgba(64, 158, 255, 0.05);
}
}
}
/* 卡片样式优化 */
.el-card {
transition: all 0.3s ease;
&:hover {
/* transform: translateY(-2px); */
}
}
/* 对话框样式优化 */
.el-dialog {
.el-dialog__header {
background-color: #f5f7fa;
border-bottom: 1px solid #ebeef5;
padding: 15px 20px;
}
.el-dialog__title {
font-size: 16px;
font-weight: 600;
color: #303133;
}
.el-dialog__footer {
padding: 15px 20px;
border-top: 1px solid #ebeef5;
}
}
</style>

View File

@ -0,0 +1,420 @@
<template>
<div class="p-2">
<el-row :gutter="20">
<!-- 流程分类树 -->
<el-col style="" :span="5">
<el-card shadow="hover">
<el-input v-model="queryParams.batchNumber" placeholder="请输入批次号" @input="getBatchList" prefix-icon="Search" clearable />
<el-tree
ref="batchTreeRef"
class="mt-2"
node-key="batchNumber"
:data="batchOptions"
:props="{ label: 'batchNumber', children: 'children' }"
:expand-on-click-node="false"
highlight-current
default-expand-all
@node-click="handleNodeClick"
></el-tree>
<pagination
v-show="total > 0"
:total="total"
v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize"
@pagination="getBatchList"
layout="prev, pager, next,jumper"
/>
</el-card>
</el-col>
<el-col :span="19">
<el-card shadow="never">
<template #header>
<el-row :gutter="10" class="mb8">
<!-- <el-col :span="1.5">
<el-button type="primary" plain icon="SemiSelect" @click="handleAdd" v-hasPermi="['cailiaoshebei:cailiaoshebei:add']">选择</el-button>
</el-col> -->
<el-col :span="1.5">
<el-button type="success" plain icon="Check" @click="submitForm" v-hasPermi="['cailiaoshebei:cailiaoshebei:delete']">保存</el-button>
</el-col>
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
</template>
<el-row :gutter="20">
<el-col :span="8" :offset="0">
<el-form-item label="单据号">
<el-input v-model="form.batchNumbers" placeholder="请输入单据号" @input="getList" prefix-icon="Search" clearable />
</el-form-item>
</el-col>
<el-col :span="8" :offset="0">
<el-form-item label="采购人">
<el-input v-model="form.purchasingAgent" placeholder="请输入采购人" @input="getList" prefix-icon="Search" clearable />
</el-form-item>
</el-col>
<el-col :span="8" :offset="0">
<el-form-item label="采购时间">
<el-date-picker v-model="form.purchasingPeriod" type="date" value-format="YYYY-MM-DD" placeholder="选择采购时间" />
</el-form-item>
</el-col>
<el-col :span="8" :offset="0">
<el-form-item label="供应商">
<el-input v-model="form.supplier" placeholder="请输入供应商" @input="getList" prefix-icon="Search" clearable />
</el-form-item>
</el-col>
<el-col :span="8" :offset="0">
<el-form-item label="合同号">
<el-input v-model="form.contractNumber" placeholder="请输入合同号" @input="getList" prefix-icon="Search" clearable />
</el-form-item>
</el-col>
<el-col :span="8" :offset="0">
<el-form-item label="备注">
<el-input v-model="form.dhRemark" placeholder="请输入备注" @input="getList" prefix-icon="Search" clearable />
</el-form-item>
</el-col>
</el-row>
<el-table v-loading="loading" :data="cailiaoshebeiList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<!-- <el-table-column label="供货商ID" align="center" prop="supplierId" /> -->
<!-- <el-table-column label="供货商" align="center" prop="supplierCompany" /> -->
<el-table-column label="设备材料名称" align="center" prop="name" />
<el-table-column label="规格型号" align="center" prop="specification" />
<el-table-column label="物料编码" align="center" prop="materialCode" width="200" />
<el-table-column label="需求数量" align="center" prop="demandQuantity" width="80" />
<el-table-column label="验收数量" align="center" prop="acceptanceQuantity" />
<el-table-column label="订货量" align="center" prop="orderQuantity">
<template #default="scope">
<el-input v-model="scope.row.orderQuantity" type="number" />
</template>
</el-table-column>
<el-table-column label="预计到货时间" align="center" prop="expectedArrival" width="250">
<template #default="scope">
<div class="flex justify-center w100%">
<el-date-picker v-model="scope.row.expectedArrival" type="date" value-format="YYYY-MM-DD" />
</div>
</template>
</el-table-column>
<el-table-column label="预计生产完成时间" align="center" prop="productionTime" width="250">
<template #default="scope">
<div class="flex justify-center w100%">
<el-date-picker v-model="scope.row.productionTime" type="date" value-format="YYYY-MM-DD" />
</div>
</template>
</el-table-column>
<!-- <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template #default="scope">
<el-tooltip content="修改" placement="top">
<el-button
link
type="primary"
icon="Edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['cailiaoshebei:cailiaoshebei:edit']"
></el-button>
</el-tooltip>
<el-tooltip content="删除" placement="top">
<el-button
link
type="primary"
icon="Delete"
@click="handleDelete(scope.row)"
v-hasPermi="['cailiaoshebei:cailiaoshebei:remove']"
></el-button>
</el-tooltip>
</template>
</el-table-column> -->
</el-table>
</el-card>
</el-col>
</el-row>
<!-- 添加或修改物资-材料设备对话框 -->
<el-dialog :title="dialog.title" v-model="dialog.visible" width="650px" append-to-body>
<el-transfer
v-model="cailiaoshebeiSelectedList"
filterable
:data="cailiaoshebeiAllList"
:props="{
label: 'name',
key: 'id'
}"
/>
<template #footer>
<div class="dialog-footer">
<el-button :loading="buttonLoading" type="primary" @click="submitTransferForm"> </el-button>
<el-button @click="cancel"> </el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup name="Cailiaoshebei" lang="ts">
import {
listCailiaoshebei,
getCailiaoshebei,
delCailiaoshebei,
addCailiaoshebei,
updateCailiaoshebei,
listBatch,
getBatch,
delBatch
} from '@/api/materials/orderEquipment';
import { CailiaoshebeiVO, CailiaoshebeiQuery, CailiaoshebeiForm } from '@/api/materials/orderEquipment/types';
import { listContractor } from '@/api/project/contractor';
import { useUserStoreHook } from '@/store/modules/user';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { supply } = toRefs<any>(proxy?.useDict('supply'));
// 获取用户 store
const userStore = useUserStoreHook();
// 从 store 中获取项目列表和当前选中的项目
const currentProject = computed(() => userStore.selectedProject);
const batchTreeRef = ref<any>(null);
const cailiaoshebeiList = ref<CailiaoshebeiVO[]>([]);
const cailiaoshebeiAllList = ref<CailiaoshebeiVO[]>([]);
const cailiaoshebeiSelectedList = ref([]);
const buttonLoading = ref(false);
const loading = ref(false);
const showSearch = ref(true);
const ids = ref<Array<string | number>>([]);
const single = ref(true);
const multiple = ref(true);
const total = ref(0);
const batchOptions = ref<any[]>([]);
const queryFormRef = ref<ElFormInstance>();
const cailiaoshebeiFormRef = ref<ElFormInstance>();
const dialog = reactive<DialogOption>({
visible: false,
title: ''
});
const initFormData: CailiaoshebeiForm = {
id: undefined,
batchNumber: undefined,
supplierId: undefined,
addDataList: [],
supplier: undefined,
name: undefined,
supply: undefined,
specification: undefined,
signalment: undefined,
materialCode: undefined,
arrivalTime: undefined,
finishTime: undefined,
unit: undefined,
plan: undefined,
realQuantity: undefined,
projectId: currentProject.value.id,
remark: undefined
};
const data = reactive<PageData<any, any>>({
form: { ...initFormData },
queryParams: {
pageNum: 1,
pageSize: 10,
batchNumber: undefined,
supplierId: undefined,
supplier: undefined,
name: undefined,
projectId: currentProject.value.id,
supply: undefined,
specification: undefined,
signalment: undefined,
materialCode: undefined,
arrivalTime: undefined,
finishTime: undefined,
unit: undefined,
plan: undefined,
realQuantity: undefined,
params: {}
},
rules: {
id: [{ required: true, message: '主键ID不能为空', trigger: 'blur' }]
}
});
const { queryParams, form, rules } = toRefs(data);
/** 查询物资-材料设备列表 */
const getList = async () => {
loading.value = true;
const res = await listCailiaoshebei(queryParams.value);
cailiaoshebeiList.value = res.rows;
loading.value = false;
};
//查询批次列表
const getBatchList = async () => {
const res = await listBatch(queryParams.value);
console.log('🚀 ~ getBatchList ~ res:', res);
batchOptions.value = res.rows;
total.value = res.total;
try {
batchTreeRef.value.setCurrentKey(res.rows[0].batchNumber);
form.value.batchNumber = res.rows[0].batchNumber;
} catch (error) {
form.value.batchNumber = '';
}
getList();
};
/** 节点单击事件 */
const handleNodeClick = (data: any) => {
queryParams.value.batchNumber = data.batchNumber;
form.value.batchNumber = data.batchNumber;
console.log('🚀 ~ handleNodeClick ~ form.value:', form.value);
if (data.batchNumber === '0') {
queryParams.value.batchNumber = '';
}
getList();
};
/** 取消按钮 */
const cancel = () => {
reset();
dialog.visible = false;
};
/** 表单重置 */
const reset = () => {
const preservedBatchId = form.value.batchNumber; // 先保存当前的 batchNumber
form.value = { ...initFormData, batchNumber: preservedBatchId }; // 重置但保留
cailiaoshebeiFormRef.value?.resetFields();
};
/** 搜索按钮操作 */
const handleQuery = () => {
queryParams.value.pageNum = 1;
getList();
};
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value?.resetFields();
handleQuery();
};
/** 多选框选中数据 */
const handleSelectionChange = (selection: CailiaoshebeiVO[]) => {
ids.value = selection.map((item) => item.id);
single.value = selection.length != 1;
multiple.value = !selection.length;
};
/** 新增按钮操作 */
const handleAdd = () => {
reset();
listCailiaoshebei({
projectId: currentProject.value.id
}).then((res) => {
cailiaoshebeiAllList.value = res.rows;
});
dialog.visible = true;
dialog.title = '选择物资-材料设备';
};
/** 修改按钮操作 */
// const handleUpdate = async (row?: CailiaoshebeiVO) => {
// reset();
// const _id = row?.id || ids.value[0];
// const res = await getCailiaoshebei(_id);
// Object.assign(form.value, res.data);
// selectValue.value = (form.value.supplierId as string).split(',');
// dialog.visible = true;
// dialog.title = '修改物资-材料设备';
// };
/** 提交按钮 */
const submitForm = async () => {
buttonLoading.value = true;
cailiaoshebeiList.value.forEach((item) => {
if (item.id) {
delete item.id;
}
});
await addCailiaoshebei({ ...form.value, list: cailiaoshebeiList.value, batchNumber: form.value.batchNumber } as any).finally(
() => (buttonLoading.value = false)
);
proxy?.$modal.msgSuccess('操作成功');
dialog.visible = false;
};
/** 提交穿梭框数据 */
const submitTransferForm = async () => {
cailiaoshebeiList.value = cailiaoshebeiSelectedList.value.map((id) => {
const item = cailiaoshebeiAllList.value.find((option) => option.id === id);
return item;
});
dialog.visible = false;
};
/** 新增批次 */
const addBatch = async () => {
await proxy?.$modal.confirm('是否确认新增批次?').finally(() => (loading.value = false));
const res = await getBatch({ projectId: currentProject.value.id });
console.log('🚀 ~ addBatch ~ res:', res);
await getBatchList();
proxy?.$modal.msgSuccess('新增成功');
};
/** 删除批次 */
const handleDeleteBatch = async () => {
const _ids = batchTreeRef.value.getCurrentNode()?.id;
await proxy?.$modal.confirm('是否确认删除批次编号为"' + _ids + '"的数据项?').finally(() => (loading.value = false));
await delBatch(_ids);
proxy?.$modal.msgSuccess('删除成功');
queryParams.value.batchNumber = '';
await getBatchList();
};
/** 删除按钮操作 */
const handleDelete = async (row?: CailiaoshebeiVO) => {
const _ids = row?.id || ids.value;
await proxy?.$modal.confirm('是否确认删除物资-材料设备编号为"' + _ids + '"的数据项?').finally(() => (loading.value = false));
await delCailiaoshebei(_ids);
proxy?.$modal.msgSuccess('删除成功');
await getList();
};
/** 查询供货商列表 */
const supplierOptions = ref([]);
const getSupplierList = async () => {
const res = await listContractor({
projectId: currentProject.value.id,
pageNum: 1,
pageSize: 10000
});
supplierOptions.value = res.rows;
};
onMounted(() => {
getBatchList();
getSupplierList();
});
//监听项目id刷新数据
const listeningProject = watch(
() => currentProject.value.id,
(nid, oid) => {
queryParams.value.projectId = nid;
form.value.projectId = nid;
getBatchList();
getSupplierList();
}
);
onUnmounted(() => {
listeningProject();
});
</script>

View File

@ -0,0 +1,411 @@
<template>
<div class="p-2">
<el-row :gutter="20">
<!-- 流程分类树 -->
<el-col style="" :span="5">
<el-card shadow="hover">
<el-input v-model="queryParams.batchNumber" placeholder="请输入批次号" @input="getBatchList" prefix-icon="Search" clearable />
<el-tree
ref="batchTreeRef"
class="mt-2"
node-key="batchNumber"
:data="batchOptions"
:props="{ label: 'batchNumber', children: 'children' }"
:expand-on-click-node="false"
highlight-current
default-expand-all
@node-click="handleNodeClick"
></el-tree>
<pagination
v-show="total > 0"
:total="total"
v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize"
@pagination="getBatchList"
layout="prev, pager, next,jumper"
/>
</el-card>
</el-col>
<el-col :span="19">
<el-card shadow="never">
<el-table v-loading="loading" :data="cailiaoshebeiList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<!-- <el-table-column label="供货商ID" align="center" prop="supplierId" /> -->
<el-table-column label="供货商" align="center" prop="supplier" />
<el-table-column label="设备材料名称" align="center" prop="name" />
<el-table-column label="供货来源" align="center" prop="supply">
<template #default="scope">
<dict-tag :options="supply" :value="scope.row.supply" />
</template>
</el-table-column>
<el-table-column label="规格型号" align="center" prop="specification" />
<el-table-column label="特征描述" align="center" prop="signalment" />
<el-table-column label="物料编码" align="center" prop="materialCode" width="200" />
<el-table-column label="计量单位" align="center" prop="unit" />
<el-table-column label="计划数量" align="center" prop="plan" />
<el-table-column label="备注" align="center" prop="remark" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template #default="scope">
<el-tooltip content="修改" placement="top">
<el-button
link
type="primary"
icon="Edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['cailiaoshebei:cailiaoshebei:edit']"
></el-button>
</el-tooltip>
<el-tooltip content="删除" placement="top">
<el-button
link
type="primary"
icon="Delete"
@click="handleDelete(scope.row)"
v-hasPermi="['cailiaoshebei:cailiaoshebei:remove']"
></el-button>
</el-tooltip>
</template>
</el-table-column>
</el-table>
</el-card>
</el-col>
</el-row>
<!-- 添加或修改物资-材料设备对话框 -->
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
<el-form ref="cailiaoshebeiFormRef" :model="form" :rules="rules" label-width="110px">
<el-form-item label="批次号" prop="batchNumber">
<el-input v-model="form.batchNumber" placeholder="请输入批次ID" disabled />
</el-form-item>
<!-- <el-form-item label="供货商ID" prop="supplierId">
<el-input v-model="form.supplierId" placeholder="请输入供货商ID" />
</el-form-item> -->
<el-form-item label="供货商" prop="supplier">
<el-select v-model="selectValue" value-key="id" multiple placeholder="请选择供货商" clearable filterable>
<el-option v-for="item in supplierOptions" :key="item.id" :label="item.name" :value="item.id"> </el-option>
</el-select>
</el-form-item>
<el-form-item label="设备材料名称" prop="name">
<el-input v-model="form.name" placeholder="请输入设备材料名称" />
</el-form-item>
<el-form-item label="供货来源" prop="supply">
<el-select v-model="form.supply" value-key="value" placeholder="请选择供货来源" clearable filterable @change="">
<el-option v-for="item in supply" :key="item.value" :label="item.label" :value="item.value"> </el-option>
</el-select>
</el-form-item>
<el-form-item label="规格型号" prop="specification">
<el-input v-model="form.specification" placeholder="请输入规格型号" />
</el-form-item>
<el-form-item label="特征描述" prop="signalment">
<el-input v-model="form.signalment" placeholder="请输入特征描述" />
</el-form-item>
<el-form-item label="物料编码" prop="materialCode">
<el-input v-model="form.materialCode" placeholder="请输入物料编码" />
</el-form-item>
<!-- <el-form-item label="计划到场时间" prop="arrivalTime">
<el-date-picker clearable v-model="form.arrivalTime" type="datetime" value-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择计划到场时间">
</el-date-picker>
</el-form-item>
<el-form-item label="计划完成时间" prop="finishTime">
<el-date-picker clearable v-model="form.finishTime" type="datetime" value-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择计划完成时间">
</el-date-picker>
</el-form-item> -->
<el-form-item label="计量单位" prop="unit">
<el-input v-model="form.unit" placeholder="请输入计量单位" />
</el-form-item>
<el-form-item label="计划数量" prop="plan">
<el-input v-model="form.plan" placeholder="请输入计划数量" type="number" />
</el-form-item>
<!-- <el-form-item label="实际数量" prop="realQuantity">
<el-input v-model="form.realQuantity" placeholder="请输入实际数量" />
</el-form-item> -->
<el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button :loading="buttonLoading" type="primary" @click="submitForm"> </el-button>
<el-button @click="cancel"> </el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup name="Cailiaoshebei" lang="ts">
import {
listCailiaoshebei,
getCailiaoshebei,
delCailiaoshebei,
addCailiaoshebei,
updateCailiaoshebei,
listBatch,
getBatch,
delBatch
} from '@/api/materials/orderMaterials';
import { CailiaoshebeiVO, CailiaoshebeiQuery, CailiaoshebeiForm } from '@/api/materials/cailiaoshebei/types';
import { listContractor } from '@/api/project/contractor';
import { useUserStoreHook } from '@/store/modules/user';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { supply } = toRefs<any>(proxy?.useDict('supply'));
// 获取用户 store
const userStore = useUserStoreHook();
// 从 store 中获取项目列表和当前选中的项目
const currentProject = computed(() => userStore.selectedProject);
const batchTreeRef = ref<any>(null);
const cailiaoshebeiList = ref<CailiaoshebeiVO[]>([]);
const buttonLoading = ref(false);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref<Array<string | number>>([]);
const single = ref(true);
const multiple = ref(true);
const total = ref(0);
const batchOptions = ref<any[]>([]);
const queryFormRef = ref<ElFormInstance>();
const cailiaoshebeiFormRef = ref<ElFormInstance>();
const dialog = reactive<DialogOption>({
visible: false,
title: ''
});
const initFormData: CailiaoshebeiForm = {
id: undefined,
batchNumber: undefined,
supplierId: undefined,
supplier: undefined,
name: undefined,
supply: undefined,
specification: undefined,
signalment: undefined,
materialCode: undefined,
arrivalTime: undefined,
finishTime: undefined,
unit: undefined,
plan: undefined,
realQuantity: undefined,
projectId: currentProject.value.id,
remark: undefined
};
const data = reactive<PageData<CailiaoshebeiForm, CailiaoshebeiQuery>>({
form: { ...initFormData },
queryParams: {
pageNum: 1,
pageSize: 10,
batchNumber: undefined,
supplierId: undefined,
supplier: undefined,
name: undefined,
projectId: currentProject.value.id,
supply: undefined,
specification: undefined,
signalment: undefined,
materialCode: undefined,
arrivalTime: undefined,
finishTime: undefined,
unit: undefined,
plan: undefined,
realQuantity: undefined,
params: {}
},
rules: {
id: [{ required: true, message: '主键ID不能为空', trigger: 'blur' }]
}
});
const { queryParams, form, rules } = toRefs(data);
/** 查询物资-材料设备列表 */
const getList = async () => {
loading.value = true;
const res = await listCailiaoshebei(queryParams.value);
cailiaoshebeiList.value = res.rows;
loading.value = false;
};
//查询批次列表
const getBatchList = async () => {
const res = await listBatch(queryParams.value);
console.log('🚀 ~ getBatchList ~ res:', res);
batchOptions.value = res.rows;
total.value = res.total;
try {
batchTreeRef.value.setCurrentKey(res.rows[0].batchNumber);
form.value.batchNumber = res.rows[0].batchNumber;
} catch (error) {
form.value.batchNumber = '';
}
getList();
};
/** 节点单击事件 */
const handleNodeClick = (data: any) => {
queryParams.value.batchNumber = data.batchNumber;
form.value.batchNumber = data.batchNumber;
console.log('🚀 ~ handleNodeClick ~ form.value:', form.value);
if (data.batchNumber === '0') {
queryParams.value.batchNumber = '';
}
getList();
};
/** 取消按钮 */
const cancel = () => {
reset();
dialog.visible = false;
};
/** 表单重置 */
const reset = () => {
const preservedBatchId = form.value.batchNumber; // 先保存当前的 batchNumber
form.value = { ...initFormData, batchNumber: preservedBatchId }; // 重置但保留
cailiaoshebeiFormRef.value?.resetFields();
};
/** 搜索按钮操作 */
const handleQuery = () => {
queryParams.value.pageNum = 1;
getList();
};
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value?.resetFields();
handleQuery();
};
/** 多选框选中数据 */
const handleSelectionChange = (selection: CailiaoshebeiVO[]) => {
ids.value = selection.map((item) => item.id);
single.value = selection.length != 1;
multiple.value = !selection.length;
};
/** 新增按钮操作 */
const handleAdd = () => {
reset();
dialog.visible = true;
dialog.title = '添加物资-材料设备';
};
/** 修改按钮操作 */
const handleUpdate = async (row?: CailiaoshebeiVO) => {
reset();
const _id = row?.id || ids.value[0];
const res = await getCailiaoshebei(_id);
Object.assign(form.value, res.data);
selectValue.value = (form.value.supplierId as string).split(',');
dialog.visible = true;
dialog.title = '修改物资-材料设备';
};
/** 提交按钮 */
const submitForm = () => {
console.log('🚀 ~ submitForm ~ form.value:', form.value);
cailiaoshebeiFormRef.value?.validate(async (valid: boolean) => {
if (valid) {
buttonLoading.value = true;
if (form.value.id) {
await updateCailiaoshebei(form.value).finally(() => (buttonLoading.value = false));
} else {
await addCailiaoshebei(form.value).finally(() => (buttonLoading.value = false));
}
proxy?.$modal.msgSuccess('操作成功');
dialog.visible = false;
await getList();
}
});
};
/** 新增批次 */
const addBatch = async () => {
await proxy?.$modal.confirm('是否确认新增批次?').finally(() => (loading.value = false));
const res = await getBatch({ projectId: currentProject.value.id });
console.log('🚀 ~ addBatch ~ res:', res);
await getBatchList();
proxy?.$modal.msgSuccess('新增成功');
};
/** 删除批次 */
const handleDeleteBatch = async () => {
const _ids = batchTreeRef.value.getCurrentNode()?.id;
await proxy?.$modal.confirm('是否确认删除批次编号为"' + _ids + '"的数据项?').finally(() => (loading.value = false));
await delBatch(_ids);
proxy?.$modal.msgSuccess('删除成功');
queryParams.value.batchNumber = '';
await getBatchList();
};
/** 删除按钮操作 */
const handleDelete = async (row?: CailiaoshebeiVO) => {
const _ids = row?.id || ids.value;
await proxy?.$modal.confirm('是否确认删除物资-材料设备编号为"' + _ids + '"的数据项?').finally(() => (loading.value = false));
await delCailiaoshebei(_ids);
proxy?.$modal.msgSuccess('删除成功');
await getList();
};
/** 导出按钮操作 */
const handleExport = () => {
proxy?.download(
'cailiaoshebei/cailiaoshebei/export',
{
...queryParams.value
},
`cailiaoshebei_${new Date().getTime()}.xlsx`
);
};
/** 查询供货商列表 */
const supplierOptions = ref([]);
const getSupplierList = async () => {
const res = await listContractor({
projectId: currentProject.value.id,
pageNum: 1,
pageSize: 10000
});
supplierOptions.value = res.rows;
};
// 中间数组变量供 el-select 使用
const selectValue = ref<string[]>([]);
// 监听 selectValue每次变化时同步更新 form.supplierId 和 form.supplier
watch(
selectValue,
(newVal) => {
form.value.supplierId = newVal.join(',');
const selectedNames = supplierOptions.value.filter((opt) => newVal.includes(opt.id)).map((opt) => opt.name);
form.value.supplier = selectedNames.join(',');
},
{ immediate: true }
);
onMounted(() => {
getBatchList();
getSupplierList();
});
//监听项目id刷新数据
const listeningProject = watch(
() => currentProject.value.id,
(nid, oid) => {
queryParams.value.projectId = nid;
form.value.projectId = nid;
getBatchList();
getSupplierList();
}
);
onUnmounted(() => {
listeningProject();
});
</script>

View File

@ -0,0 +1,513 @@
<template>
<div class="p-2">
<el-row :gutter="20">
<!-- 流程分类树 -->
<el-col style="" :span="5">
<el-card shadow="hover">
<!-- <template #header>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5" :offset="0"
><el-button type="primary" size="default" @click="addBatch" icon="FolderAdd" plain>新增</el-button></el-col
>
<el-col :span="1.5" :offset="0"
><el-button type="danger" size="default" @click="handleDeleteBatch" icon="FolderDelete" plain>删除</el-button></el-col
>
</el-row>
</template> -->
<el-input v-model="queryParams.batchNumber" placeholder="请输入批次号" @input="getBatchList" prefix-icon="Search" clearable />
<el-tree
ref="batchTreeRef"
class="mt-2"
node-key="batchNumber"
:data="batchOptions"
:props="{ label: 'batchNumber', children: 'children' }"
:expand-on-click-node="false"
highlight-current
default-expand-all
@node-click="handleNodeClick"
></el-tree>
<pagination
v-show="total > 0"
:total="total"
v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize"
@pagination="getBatchList"
layout="prev, pager, next,jumper"
/>
</el-card>
</el-col>
<el-col :span="19">
<el-card shadow="never">
<el-table v-loading="loading" :data="cailiaoshebeiList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="供货商" align="center" prop="supplier" />
<el-table-column label="设备材料名称" align="center" prop="name" />
<el-table-column label="供货来源" align="center" prop="supply">
<template #default="scope">
<dict-tag :options="supply" :value="scope.row.supply" />
</template>
</el-table-column>
<el-table-column label="规格型号" align="center" prop="specification" />
<el-table-column label="特征描述" align="center" prop="signalment" />
<el-table-column label="物料编码" align="center" prop="materialCode" width="200" />
<el-table-column label="计划到场时间" align="center" prop="arrivalTime" width="180">
<template #default="scope">
<span>{{ parseTime(scope.row.arrivalTime, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column>
<el-table-column label="计划完成时间" align="center" prop="finishTime" width="180">
<template #default="scope">
<span>{{ parseTime(scope.row.finishTime, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column>
<el-table-column label="计量单位" align="center" prop="unit" />
<el-table-column label="计划数量" align="center" prop="plan" />
<el-table-column label="流程状态" align="center" prop="planAuditStatus">
<template #default="scope">
<dict-tag :options="wf_business_status" :value="scope.row.planAuditStatus" />
</template>
</el-table-column>
<el-table-column label="操作" align="center" width="150">
<template #default="scope"
><el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['cailiaoshebei:cailiaoshebei:edit']"
>修改</el-button
><el-button link type="primary" icon="View" @click="handleDelete(scope.row)" v-hasPermi="['cailiaoshebei:cailiaoshebei:remove']"
>详情</el-button
>
<el-button link type="primary" icon="Finished" @click="handleAudit(scope.row)" v-hasPermi="['out:monthPlan:remove']">审核</el-button>
</template>
</el-table-column>
</el-table>
</el-card>
</el-col>
</el-row>
<!-- 添加或修改物资-材料设备对话框 -->
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
<el-form ref="cailiaoshebeiFormRef" :model="form" :rules="rules" label-width="110px">
<el-form-item label="计划到场时间" prop="arrivalTime">
<el-date-picker clearable v-model="form.arrivalTime" type="date" value-format="YYYY-MM-DD" placeholder="请选择计划到场时间">
</el-date-picker>
</el-form-item>
<el-form-item label="计划完成时间" prop="finishTime">
<el-date-picker clearable v-model="form.finishTime" type="date" value-format="YYYY-MM-DD" placeholder="请选择计划完成时间">
</el-date-picker>
</el-form-item>
<div v-for="(item, index) in selectValue" :key="index">
<el-divider content-position="center"
><el-text tag="b">{{ item }}</el-text></el-divider
>
<el-form-item label="单价" prop="unitPrice">
<el-input v-model="form.listOfMaterialInventory[index].unitPrice" type="number" placeholder="请输入单价" />
</el-form-item>
<el-form-item label="数量" prop="num">
<el-input v-model="form.listOfMaterialInventory[index].num" type="number" placeholder="请输入数量" />
</el-form-item>
<el-form-item label="合同号" prop="contractNum">
<el-input v-model="form.listOfMaterialInventory[index].contractNum" placeholder="请输入合同号" />
</el-form-item>
<el-form-item label="预估供应周期" prop="estimatedCycle">
<el-input v-model="form.listOfMaterialInventory[index].estimatedCycle" type="number" placeholder="请输入预估供应周期" />
</el-form-item>
<el-form-item label="供货公司" prop="supplierCompany">
<el-input v-model="form.listOfMaterialInventory[index].supplierCompany" placeholder="请输入供货公司" disabled />
</el-form-item>
</div>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button :loading="buttonLoading" type="primary" @click="submitForm"> </el-button>
<el-button @click="cancel"> </el-button>
</div>
</template>
</el-dialog>
<!-- 详情弹框 -->
<el-dialog :title="dialog.title" v-model="dialog.details" width="800px" append-to-body>
<div class="block_box">
<span>主要信息</span>
<el-form label-width="130px">
<el-row :gutter="20" justify="space-around">
<el-col :span="12">
<el-form-item label="批次号">
{{ form?.batchNumber }}
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="供货商">
{{ form?.supplier }}
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="设备材料名称">
{{ form?.name }}
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="规格型号">
{{ form?.specification }}
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="供货方式">
<dict-tag :options="supply" :value="form.supply" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="特征描述">
{{ form?.signalment }}
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="物料编码">
{{ form?.materialCode }}
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="计划到场时间">
{{ form?.arrivalTime }}
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="计划完成时间">
{{ form?.finishTime }}
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="计量单位">
{{ form?.unit }}
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="计划数量">
{{ form?.plan }}
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
<div class="block_box" v-for="(item, index) in selectValue" v-if="form?.listOfMaterialInventory.length">
<span>{{ item }}-物资清单列表</span>
<el-form label-width="130px">
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="单价">
{{ form?.listOfMaterialInventory[index].unitPrice }}
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="数量">
{{ form?.listOfMaterialInventory[index].num }}
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="合同号">
{{ form?.listOfMaterialInventory[index].contractNum }}
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="预估供应周期">
{{ form?.listOfMaterialInventory[index].estimatedCycle }}
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="供货公司">
{{ item }}
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
</el-dialog>
</div>
</template>
<script setup name="Cailiaoshebei" lang="ts">
import {
listCailiaoshebei,
getCailiaoshebei,
delCailiaoshebei,
addCailiaoshebei,
updateCailiaoshebei,
listBatch,
getBatch,
delBatch
} from '@/api/materials/suppliesprice';
import { CailiaoshebeiVO, CailiaoshebeiQuery, CailiaoshebeiForm } from '@/api/materials/suppliesprice/types';
import { listContractor } from '@/api/project/contractor';
import { useUserStoreHook } from '@/store/modules/user';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { supply } = toRefs<any>(proxy?.useDict('supply'));
// 获取用户 store
const userStore = useUserStoreHook();
// 从 store 中获取项目列表和当前选中的项目
const currentProject = computed(() => userStore.selectedProject);
const batchTreeRef = ref<any>(null);
const cailiaoshebeiList = ref<CailiaoshebeiVO[]>([]);
const buttonLoading = ref(false);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref<Array<string | number>>([]);
const single = ref(true);
const multiple = ref(true);
const total = ref(0);
const batchOptions = ref<any[]>([]);
const { wf_business_status } = toRefs<any>(proxy?.useDict('wf_business_status'));
const queryFormRef = ref<ElFormInstance>();
const cailiaoshebeiFormRef = ref<ElFormInstance>();
// 中间数组变量供 el-select 使用
const selectValue = ref<string[]>([]);
const dialog = reactive<DialogOption>({
visible: false,
details: false,
title: ''
});
const initFormData: any = {
id: undefined,
batchNumber: undefined,
supplierId: undefined,
supplier: undefined,
name: undefined,
supply: undefined,
specification: undefined,
signalment: undefined,
approvalPlan: undefined,
materialCode: undefined,
arrivalTime: undefined,
finishTime: undefined,
unit: undefined,
plan: undefined,
realQuantity: undefined,
projectId: currentProject.value.id,
approvalProject: undefined,
listOfMaterialInventory: [],
remark: undefined
};
const data = reactive<PageData<any, any>>({
form: { ...initFormData },
queryParams: {
pageNum: 1,
pageSize: 10,
batchNumber: undefined,
supplierId: undefined,
supplier: undefined,
name: undefined,
projectId: currentProject.value.id,
supply: undefined,
specification: undefined,
signalment: undefined,
materialCode: undefined,
arrivalTime: undefined,
finishTime: undefined,
unit: undefined,
plan: undefined,
realQuantity: undefined,
listOfMaterialInventory: [],
params: {}
},
rules: {
id: [{ required: true, message: '主键ID不能为空', trigger: 'blur' }]
}
});
const { queryParams, form, rules } = toRefs(data);
/** 查询物资-材料设备列表 */
const getList = async () => {
loading.value = true;
const res = await listCailiaoshebei(queryParams.value);
cailiaoshebeiList.value = res.rows;
loading.value = false;
};
//查询批次列表
const getBatchList = async () => {
const res = await listBatch(queryParams.value);
console.log('🚀 ~ getBatchList ~ res:', res);
batchOptions.value = res.rows;
total.value = res.total;
try {
batchTreeRef.value.setCurrentKey(res.rows[0].batchNumber);
form.value.batchNumber = res.rows[0].batchNumber;
form.value.approvalPlan = res.rows[0].approvalPlan;
} catch (error) {
form.value.batchNumber = '';
}
getList();
};
/** 节点单击事件 */
const handleNodeClick = (data: any) => {
console.log('🚀 ~ handleNodeClick ~ data:', data);
queryParams.value.batchNumber = data.batchNumber;
form.value.batchNumber = data.batchNumber;
form.value.approvalPlan = data.approvalPlan;
console.log('🚀 ~ handleNodeClick ~ form.value:', form.value);
if (data.batchNumber === '0') {
queryParams.value.batchNumber = '';
}
getList();
};
/** 取消按钮 */
const cancel = () => {
reset();
dialog.visible = false;
};
/** 表单重置 */
const reset = () => {
const preservedBatchId = form.value.batchNumber; // 先保存当前的 batchNumber
form.value = { ...initFormData, batchNumber: preservedBatchId }; // 重置但保留
cailiaoshebeiFormRef.value?.resetFields();
selectValue.value = [];
};
/** 搜索按钮操作 */
const handleQuery = () => {
queryParams.value.pageNum = 1;
getList();
};
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value?.resetFields();
handleQuery();
};
/** 多选框选中数据 */
const handleSelectionChange = (selection: CailiaoshebeiVO[]) => {
ids.value = selection.map((item) => item.id);
single.value = selection.length != 1;
multiple.value = !selection.length;
};
/** 修改按钮操作 */
const handleUpdate = async (row?: CailiaoshebeiVO) => {
reset();
const _id = row?.id || ids.value[0];
const res = await getCailiaoshebei(_id);
Object.assign(form.value, res.data);
selectValue.value = (form.value.supplier as string).split(',');
if (!form.value.listOfMaterialInventory.length) {
form.value.listOfMaterialInventory = selectValue.value.map((item) => {
return {
supplierCompany: item,
estimatedCycle: '',
contractNum: '',
num: '',
unitPrice: ''
};
});
}
dialog.visible = true;
dialog.title = '修改物资供应总计划';
};
/** 提交按钮 */
const submitForm = () => {
console.log('🚀 ~ submitForm ~ form.value:', form.value);
cailiaoshebeiFormRef.value?.validate(async (valid: boolean) => {
if (valid) {
buttonLoading.value = true;
await updateCailiaoshebei(form.value).finally(() => (buttonLoading.value = false));
proxy?.$modal.msgSuccess('操作成功');
dialog.visible = false;
await getList();
}
});
};
/** 详情按钮操作 */
const handleDelete = async (row?: CailiaoshebeiVO) => {
reset();
dialog.details = true;
const _id = row?.id || ids.value[0];
const res = await getCailiaoshebei(_id);
Object.assign(form.value, res.data);
selectValue.value = (form.value.supplier as string).split(',');
if (!form.value.listOfMaterialInventory.length) {
form.value.listOfMaterialInventory = selectValue.value.map((item) => {
return {
supplierCompany: item,
estimatedCycle: '',
contractNum: '',
num: '',
unitPrice: ''
};
});
}
dialog.title = '物资供应总计划详情';
};
/** 审核按钮操作 */
const handleAudit = async (row?: CailiaoshebeiVO) => {
const data = {
...row,
approvalPlan: form.value.approvalPlan
};
proxy?.$tab.openPage('/materials-management/suppliesprice/indexEdit', '审核物资供应总计划', {
id: row?.id,
data: JSON.stringify(data),
type: 'update'
});
};
/** 查询供货商列表 */
const supplierOptions = ref([]);
const getSupplierList = async () => {
const res = await listContractor({
projectId: currentProject.value.id,
pageNum: 1,
pageSize: 10000
});
supplierOptions.value = res.rows;
};
onMounted(() => {
getBatchList();
getSupplierList();
});
//监听项目id刷新数据
const listeningProject = watch(
() => currentProject.value.id,
(nid, oid) => {
queryParams.value.projectId = nid;
form.value.projectId = nid;
getBatchList();
getSupplierList();
}
);
onUnmounted(() => {
listeningProject();
});
</script>
<style scoped lang="scss">
.block_box {
border: 1px solid #9eccfa;
border-radius: 6px;
padding: 10px 20px 20px 10px;
margin: 15px;
> span {
color: #409eff;
font-weight: 700;
font-size: 14px;
margin-bottom: 10px;
display: block;
}
}
</style>

View File

@ -0,0 +1,401 @@
<template>
<div class="p-4 bg-gray-50">
<div class="max-w-4xl mx-auto">
<!-- 顶部按钮区域 -->
<el-card class="mb-4 rounded-lg shadow-sm bg-white border border-gray-100 transition-all hover:shadow-md">
<approvalButton
@submitForm="submitForm"
@approvalVerifyOpen="approvalVerifyOpen"
@handleApprovalRecord="handleApprovalRecord"
:buttonLoading="buttonLoading"
:id="form.id"
:status="form.approvalPlan"
:pageType="routeParams.type"
/>
</el-card>
<!-- 表单区域 -->
<el-card class="rounded-lg shadow-sm bg-white border border-gray-100 transition-all hover:shadow-md overflow-hidden">
<div class="p-4 bg-gradient-to-r from-blue-50 to-indigo-50 border-b border-gray-100">
<h3 class="text-lg font-semibold text-gray-800">施工产值</h3>
</div>
<div class="p-6">
<el-form
ref="leaveFormRef"
v-loading="loading"
:disabled="routeParams.type === 'view'"
:model="form"
:rules="rules"
label-width="120px"
class="space-y-4"
>
<el-row :gutter="20" justify="center">
<el-col :span="12" :offset="0">
<el-form-item label="计划到场时间" prop="arrivalTime">
<el-date-picker
clearable
v-model="form.arrivalTime"
disabled
type="date"
value-format="YYYY-MM-DD"
placeholder="请选择计划到场时间"
>
</el-date-picker>
</el-form-item>
<el-form-item label="计划完成时间" prop="finishTime">
<el-date-picker clearable v-model="form.finishTime" disabled type="date" value-format="YYYY-MM-DD" placeholder="请选择计划完成时间">
</el-date-picker>
</el-form-item>
<div v-for="(item, index) in selectValue" :key="index">
<el-divider content-position="center"
><el-text tag="b">{{ item }}</el-text></el-divider
>
<el-form-item label="单价" prop="unitPrice">
<el-input v-model="form.listOfMaterialInventory[index].unitPrice" type="number" disabled placeholder="请输入单价" />
</el-form-item>
<el-form-item label="数量" prop="num">
<el-input v-model="form.listOfMaterialInventory[index].num" type="number" disabled placeholder="请输入数量" />
</el-form-item>
<el-form-item label="合同号" prop="contractNum">
<el-input v-model="form.listOfMaterialInventory[index].contractNum" disabled placeholder="请输入合同号" />
</el-form-item>
<el-form-item label="预估供应周期" prop="estimatedCycle">
<el-input v-model="form.listOfMaterialInventory[index].estimatedCycle" disabled type="number" placeholder="请输入预估供应周期" />
</el-form-item>
<el-form-item label="供货公司" prop="supplierCompany">
<el-input v-model="form.listOfMaterialInventory[index].supplierCompany" disabled placeholder="请输入供货公司" />
</el-form-item>
</div>
</el-col>
</el-row>
</el-form>
</div>
</el-card>
<!-- 提交组件 -->
<submitVerify ref="submitVerifyRef" :task-variables="taskVariables" @submit-callback="submitCallback" />
<approvalRecord ref="approvalRecordRef"></approvalRecord>
<!-- 流程选择对话框 -->
<el-dialog
draggable
v-model="dialogVisible.visible"
:title="dialogVisible.title"
:before-close="handleClose"
width="500"
class="rounded-lg shadow-lg"
>
<div class="p-4">
<p class="text-gray-600 mb-4">请选择要启动的流程</p>
<el-select v-model="flowCode" placeholder="请选择流程" style="width: 100%">
<el-option v-for="item in flowCodeOptions" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</div>
<template #footer>
<div class="dialog-footer p-4 border-t border-gray-100 flex justify-end space-x-3">
<el-button @click="handleClose" class="px-4 py-2 border border-gray-300 rounded-md text-gray-700 hover:bg-gray-50 transition-colors"
>取消</el-button
>
<el-button type="primary" @click="submitFlow()" class="px-4 py-2 bg-primary text-white rounded-md hover:bg-primary/90 transition-colors"
>确认</el-button
>
</div>
</template>
</el-dialog>
</div>
</div>
</template>
<script setup name="Leave" lang="ts">
import { LeaveForm, LeaveQuery, LeaveVO } from '@/api/workflow/leave/types';
import { startWorkFlow } from '@/api/workflow/task';
import SubmitVerify from '@/components/Process/submitVerify.vue';
import ApprovalRecord from '@/components/Process/approvalRecord.vue';
import ApprovalButton from '@/components/Process/approvalButton.vue';
import { StartProcessBo } from '@/api/workflow/workflowCommon/types';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
import { useUserStoreHook } from '@/store/modules/user';
const { design_change_reason_type } = toRefs<any>(proxy?.useDict('design_change_reason_type'));
import { getKnowledgeDocument } from '@/api/design/technicalStandard';
import { getConstructionValue } from '@/api/out/constructionValue';
import { workScheduleListDetail } from '@/api/progress/plan';
import { getCailiaoshebei } from '@/api/materials/suppliesprice';
// 获取用户 store
const userStore = useUserStoreHook();
// 从 store 中获取项目列表和当前选中的项目
const currentProject = computed(() => userStore.selectedProject);
const buttonLoading = ref(false);
const loading = ref(true);
//路由参数
const routeParams = ref<Record<string, any>>({});
const flowCode = ref<string>('');
const status = ref<string>('');
const dialogVisible = reactive<DialogOption>({
visible: false,
title: '流程定义'
});
//提交组件
const submitVerifyRef = ref<InstanceType<typeof SubmitVerify>>();
//审批记录组件
const approvalRecordRef = ref<InstanceType<typeof ApprovalRecord>>();
//按钮组件
const flowCodeOptions = [
{
value: currentProject.value?.id + '_materialsPlans',
label: '批次需求计划审批'
}
];
const leaveFormRef = ref<ElFormInstance>();
const dialog = reactive({
visible: false,
title: '',
isEdit: false
});
const submitFormData = ref<StartProcessBo>({
businessId: '',
flowCode: '',
variables: {}
});
const taskVariables = ref<Record<string, any>>({});
const selectValue = ref<string[]>([]);
const initFormData = {
id: undefined,
batchNumber: undefined,
supplierId: undefined,
supplier: undefined,
name: undefined,
supply: undefined,
specification: undefined,
signalment: undefined,
materialCode: undefined,
arrivalTime: undefined,
finishTime: undefined,
unit: undefined,
plan: undefined,
realQuantity: undefined,
projectId: currentProject.value.id,
listOfMaterialInventory: [],
remark: undefined
};
const data = reactive({
form: { ...initFormData },
rules: {}
});
const handleClose = () => {
dialogVisible.visible = false;
flowCode.value = '';
buttonLoading.value = false;
};
const { form, rules } = toRefs(data);
/** 表单重置 */
const reset = () => {
form.value = { ...initFormData };
leaveFormRef.value?.resetFields();
};
/** 获取详情 */
const getInfo = () => {
loading.value = true;
buttonLoading.value = false;
nextTick(async () => {
const res = JSON.parse(routeParams.value.data);
Object.assign(form.value, res.data);
selectValue.value = (form.value.supplier as string).split(',');
if (!form.value.listOfMaterialInventory.length) {
form.value.listOfMaterialInventory = selectValue.value.map((item) => {
return {
supplierCompany: item,
estimatedCycle: '',
contractNum: '',
num: '',
unitPrice: ''
};
});
}
loading.value = false;
buttonLoading.value = false;
});
};
/** 提交按钮 */
const submitForm = (status1: string) => {
status.value = status1;
submit(status.value, form.value);
};
const submitFlow = async () => {
handleStartWorkFlow(form.value);
dialogVisible.visible = false;
};
//提交申请
const handleStartWorkFlow = async (data: LeaveForm) => {
try {
submitFormData.value.flowCode = flowCode.value;
submitFormData.value.businessId = data.id;
//流程变量
taskVariables.value = {
// leave4/5 使用的流程变量
userList: ['1', '3', '4']
};
submitFormData.value.variables = taskVariables.value;
const resp = await startWorkFlow(submitFormData.value);
if (submitVerifyRef.value) {
buttonLoading.value = false;
submitVerifyRef.value.openDialog(resp.data.taskId);
}
} finally {
buttonLoading.value = false;
}
};
//审批记录
const handleApprovalRecord = () => {
approvalRecordRef.value.init(form.value.id);
};
//提交回调
const submitCallback = async () => {
await proxy.$tab.closePage(proxy.$route);
proxy.$router.go(-1);
};
//审批
const approvalVerifyOpen = async () => {
submitVerifyRef.value.openDialog(routeParams.value.taskId);
};
// 图纸上传成功之后 开始提交
const submit = async (status, data) => {
form.value = data;
if (status === 'draft') {
buttonLoading.value = false;
proxy?.$modal.msgSuccess('暂存成功');
proxy.$tab.closePage(proxy.$route);
proxy.$router.go(-1);
} else {
if ((form.value.approvalPlan === 'draft' && (flowCode.value === '' || flowCode.value === null)) || routeParams.value.type === 'add') {
flowCode.value = flowCodeOptions[0].value;
dialogVisible.visible = true;
return;
}
//说明启动过先随意穿个参数
if (flowCode.value === '' || flowCode.value === null) {
flowCode.value = 'xx';
}
await handleStartWorkFlow(data);
}
};
onMounted(() => {
nextTick(async () => {
routeParams.value = proxy.$route.query;
console.log('🚀 ~ proxy.$route.query:', proxy.$route.query);
reset();
loading.value = false;
if (routeParams.value.type === 'update' || routeParams.value.type === 'view' || routeParams.value.type === 'approval') {
getInfo();
}
});
});
</script>
<style scoped lang="scss">
/* 全局样式 */
:root {
--primary: #409eff;
--primary-light: #66b1ff;
--primary-dark: #3a8ee6;
--success: #67c23a;
--warning: #e6a23c;
--danger: #f56c6c;
--info: #909399;
}
/* 表单样式优化 */
.el-form-item {
.el-form-item__label {
color: #606266;
font-weight: 500;
}
.el-input__inner,
.el-select .el-input__inner {
border-radius: 4px;
transition:
border-color 0.2s,
box-shadow 0.2s;
&:focus {
border-color: var(--primary-light);
box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.1);
}
}
.el-textarea__inner {
border-radius: 4px;
transition:
border-color 0.2s,
box-shadow 0.2s;
&:focus {
border-color: var(--primary-light);
box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.1);
}
}
}
/* 按钮样式优化 */
.el-button {
border-radius: 4px;
transition: all 0.2s;
&.is-primary {
background-color: var(--primary);
border-color: var(--primary);
&:hover {
background-color: var(--primary-light);
border-color: var(--primary-light);
}
&:active {
background-color: var(--primary-dark);
border-color: var(--primary-dark);
}
}
&.is-text {
color: var(--primary);
&:hover {
color: var(--primary-light);
background-color: rgba(64, 158, 255, 0.05);
}
}
}
/* 卡片样式优化 */
.el-card {
transition: all 0.3s ease;
&:hover {
/* transform: translateY(-2px); */
}
}
/* 对话框样式优化 */
.el-dialog {
.el-dialog__header {
background-color: #f5f7fa;
border-bottom: 1px solid #ebeef5;
padding: 15px 20px;
}
.el-dialog__title {
font-size: 16px;
font-weight: 600;
color: #303133;
}
.el-dialog__footer {
padding: 15px 20px;
border-top: 1px solid #ebeef5;
}
}
</style>

View File

@ -54,14 +54,18 @@
<el-table-column label="无人机识别数量" align="center" prop="uavNum" /> <el-table-column label="无人机识别数量" align="center" prop="uavNum" />
<el-table-column label="确认数量" align="center" prop="confirmNum" /> <el-table-column label="确认数量" align="center" prop="confirmNum" />
<el-table-column label="产值" align="center" prop="outValue" /> <el-table-column label="产值" align="center" prop="outValue" />
<!-- <el-table-column label="审核状态" align="center" prop="auditStatus" /> --> <el-table-column label="流程状态" align="center" prop="status">
<template #default="scope">
<dict-tag :options="wf_business_status" :value="scope.row.auditStatus" />
</template>
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="210"> <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="210">
<template #default="scope"> <template #default="scope">
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['out:constructionValue:edit']">修改</el-button> <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['out:constructionValue:edit']">修改</el-button>
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['out:constructionValue:remove']" <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['out:constructionValue:remove']"
>删除</el-button >删除</el-button
> >
<el-button link type="primary" icon="Finished" @click="handleDelete(scope.row)" v-hasPermi="['out:constructionValue:remove']" <el-button link type="primary" icon="Finished" @click="handleAudit(scope.row)" v-hasPermi="['out:constructionValue:remove']"
>审核</el-button >审核</el-button
> >
</template> </template>
@ -73,7 +77,7 @@
<!-- 添加或修改施工产值对话框 --> <!-- 添加或修改施工产值对话框 -->
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body> <el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
<el-form ref="constructionValueFormRef" :model="form" :rules="rules" label-width="120px"> <el-form ref="constructionValueFormRef" :model="form" :rules="rules" label-width="120px">
<el-form-item label="方阵" prop="matrixId"> <el-form-item label="方阵" prop="matrixId" v-if="!form.id">
<el-cascader <el-cascader
:options="matrixOptions" :options="matrixOptions"
placeholder="请选择" placeholder="请选择"
@ -84,7 +88,7 @@
clearable clearable
/> />
</el-form-item> </el-form-item>
<el-form-item label="分项工程" prop="progressCategoryId"> <el-form-item label="分项工程" prop="progressCategoryId" v-if="!form.id">
<el-cascader <el-cascader
:options="progressCategoryList" :options="progressCategoryList"
v-model="form.progressCategoryId" v-model="form.progressCategoryId"
@ -97,7 +101,7 @@
> >
</el-cascader> </el-cascader>
</el-form-item> </el-form-item>
<el-form-item label="计划日期" prop="reportDateId"> <el-form-item label="计划日期" prop="reportDateId" v-if="!form.id">
<el-cascader <el-cascader
:options="progressTimeList" :options="progressTimeList"
v-model="form.reportDateId" v-model="form.reportDateId"
@ -166,6 +170,7 @@ const progressCategoryList = ref<ProgressCategoryVO[]>([]);
const progressTimeList = ref<any[]>([]); const progressTimeList = ref<any[]>([]);
const queryFormRef = ref<ElFormInstance>(); const queryFormRef = ref<ElFormInstance>();
const constructionValueFormRef = ref<ElFormInstance>(); const constructionValueFormRef = ref<ElFormInstance>();
const { wf_business_status } = toRefs<any>(proxy?.useDict('wf_business_status'));
const dialog = reactive<DialogOption>({ const dialog = reactive<DialogOption>({
visible: false, visible: false,
@ -263,7 +268,9 @@ const handleAdd = async () => {
reset(); reset();
const res = await getProjectSquare(currentProject.value.id); const res = await getProjectSquare(currentProject.value.id);
if (res.data.length === 0) return proxy?.$modal.msgWarning('当前项目下没有方阵,请先创建方阵'); if (res.data.length === 0) return proxy?.$modal.msgWarning('当前项目下没有方阵,请先创建方阵');
const isFangzhen = res.data.every((item) => item.children.length); const isFangzhen = res.data.some((item) => item.children && item.children.length);
console.log('🚀 ~ handleAdd ~ isFangzhen:', isFangzhen);
if (!isFangzhen) return proxy?.$modal.msgWarning('当前项目下没有方阵,请先创建方阵'); if (!isFangzhen) return proxy?.$modal.msgWarning('当前项目下没有方阵,请先创建方阵');
let matrixList = res.data.map((item) => { let matrixList = res.data.map((item) => {
return { return {
@ -349,6 +356,14 @@ const handleDelete = async (row?: ConstructionValueVO) => {
await getList(); await getList();
}; };
/** 审核按钮操作 */
const handleAudit = async (row?: ConstructionValueVO) => {
proxy?.$tab.openPage('/out/constructionValue/indexEdit', '审核施工产值', {
id: row?.id,
type: 'update'
});
};
/** 导出按钮操作 */ /** 导出按钮操作 */
const handleExport = () => { const handleExport = () => {
proxy?.download( proxy?.download(

View File

@ -0,0 +1,384 @@
<template>
<div class="p-4 bg-gray-50">
<div class="max-w-4xl mx-auto">
<!-- 顶部按钮区域 -->
<el-card class="mb-4 rounded-lg shadow-sm bg-white border border-gray-100 transition-all hover:shadow-md">
<approvalButton
@submitForm="submitForm"
@approvalVerifyOpen="approvalVerifyOpen"
@handleApprovalRecord="handleApprovalRecord"
:buttonLoading="buttonLoading"
:id="form.id"
:status="form.auditStatus"
:pageType="routeParams.type"
/>
</el-card>
<!-- 表单区域 -->
<el-card class="rounded-lg shadow-sm bg-white border border-gray-100 transition-all hover:shadow-md overflow-hidden">
<div class="p-4 bg-gradient-to-r from-blue-50 to-indigo-50 border-b border-gray-100">
<h3 class="text-lg font-semibold text-gray-800">施工产值</h3>
</div>
<div class="p-6">
<el-form
ref="leaveFormRef"
v-loading="loading"
:disabled="routeParams.type === 'view'"
:model="form"
:rules="rules"
label-width="120px"
class="space-y-4"
>
<div class="grid grid-cols-1 gap-4">
<el-row :gutter="20" justify="center">
<el-col :span="13" :offset="0">
<el-form-item label="方阵" prop="matrixName">
<el-input v-model="form.matrixName" clearable disabled></el-input>
</el-form-item>
</el-col>
<el-col :span="13" :offset="0">
<el-form-item label="分项工程" prop="progressCategoryName">
<el-input v-model="form.progressCategoryName" disabled></el-input>
</el-form-item>
</el-col>
<el-col :span="13" :offset="0">
<el-form-item label="计划日期" prop="planDate">
<el-input v-model="form.planDate" disabled></el-input>
</el-form-item>
</el-col>
<el-col :span="13" :offset="0">
<el-form-item label="人工填报数量" prop="artificialNum">
<el-input v-model="form.artificialNum" placeholder="请输入人工填报数量" disabled />
</el-form-item>
</el-col>
<el-col :span="13" :offset="0">
<el-form-item label="无人机识别数量" prop="uavNum">
<el-input v-model="form.uavNum" placeholder="请输入无人机识别数量" disabled />
</el-form-item>
</el-col>
<el-col :span="13" :offset="0">
<el-form-item label="上报日期" prop="planDate">
<el-date-picker v-model="form.planDate" type="date" value-format="YYYY-MM-DD" disabled placeholder="请选择上报日期" />
</el-form-item>
</el-col>
<el-col :span="13" :offset="0">
<el-form-item label="确认数量" prop="confirmNum">
<el-input v-model="form.confirmNum" placeholder="请输入确认数量" disabled />
</el-form-item>
</el-col>
</el-row>
</div>
</el-form>
</div>
</el-card>
<!-- 提交组件 -->
<submitVerify ref="submitVerifyRef" :task-variables="taskVariables" @submit-callback="submitCallback" />
<approvalRecord ref="approvalRecordRef"></approvalRecord>
<!-- 流程选择对话框 -->
<el-dialog
draggable
v-model="dialogVisible.visible"
:title="dialogVisible.title"
:before-close="handleClose"
width="500"
class="rounded-lg shadow-lg"
>
<div class="p-4">
<p class="text-gray-600 mb-4">请选择要启动的流程</p>
<el-select v-model="flowCode" placeholder="请选择流程" style="width: 100%">
<el-option v-for="item in flowCodeOptions" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</div>
<template #footer>
<div class="dialog-footer p-4 border-t border-gray-100 flex justify-end space-x-3">
<el-button @click="handleClose" class="px-4 py-2 border border-gray-300 rounded-md text-gray-700 hover:bg-gray-50 transition-colors"
>取消</el-button
>
<el-button type="primary" @click="submitFlow()" class="px-4 py-2 bg-primary text-white rounded-md hover:bg-primary/90 transition-colors"
>确认</el-button
>
</div>
</template>
</el-dialog>
</div>
</div>
</template>
<script setup name="Leave" lang="ts">
import { LeaveForm, LeaveQuery, LeaveVO } from '@/api/workflow/leave/types';
import { startWorkFlow } from '@/api/workflow/task';
import SubmitVerify from '@/components/Process/submitVerify.vue';
import ApprovalRecord from '@/components/Process/approvalRecord.vue';
import ApprovalButton from '@/components/Process/approvalButton.vue';
import { StartProcessBo } from '@/api/workflow/workflowCommon/types';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
import { useUserStoreHook } from '@/store/modules/user';
const { design_change_reason_type } = toRefs<any>(proxy?.useDict('design_change_reason_type'));
import { getKnowledgeDocument } from '@/api/design/technicalStandard';
import { getConstructionValue } from '@/api/out/constructionValue';
import { workScheduleListDetail } from '@/api/progress/plan';
// 获取用户 store
const userStore = useUserStoreHook();
// 从 store 中获取项目列表和当前选中的项目
const currentProject = computed(() => userStore.selectedProject);
const buttonLoading = ref(false);
const loading = ref(true);
//路由参数
const routeParams = ref<Record<string, any>>({});
const flowCode = ref<string>('');
const status = ref<string>('');
const dialogVisible = reactive<DialogOption>({
visible: false,
title: '流程定义'
});
//提交组件
const submitVerifyRef = ref<InstanceType<typeof SubmitVerify>>();
//审批记录组件
const approvalRecordRef = ref<InstanceType<typeof ApprovalRecord>>();
//按钮组件
const flowCodeOptions = [
{
value: currentProject.value?.id + '_constructionValue',
label: '施工产值审批'
}
];
const leaveFormRef = ref<ElFormInstance>();
const dialog = reactive({
visible: false,
title: '',
isEdit: false
});
const submitFormData = ref<StartProcessBo>({
businessId: '',
flowCode: '',
variables: {}
});
const taskVariables = ref<Record<string, any>>({});
const initFormData = {
id: undefined,
projectId: currentProject.value?.id,
matrixName: undefined,
progressCategoryName: undefined,
artificialNum: undefined,
planNum: undefined,
planDate: undefined,
uavNum: undefined,
confirmNum: undefined,
outValue: undefined,
reportDate: undefined,
reportDateId: undefined,
auditStatus: undefined
};
const data = reactive({
form: { ...initFormData },
rules: {}
});
const handleClose = () => {
dialogVisible.visible = false;
flowCode.value = '';
buttonLoading.value = false;
};
const { form, rules } = toRefs(data);
/** 表单重置 */
const reset = () => {
form.value = { ...initFormData };
leaveFormRef.value?.resetFields();
};
/** 获取详情 */
const getInfo = () => {
loading.value = true;
buttonLoading.value = false;
nextTick(async () => {
const res = await getConstructionValue(routeParams.value.id);
Object.assign(form.value, res.data);
loading.value = false;
buttonLoading.value = false;
});
};
/** 提交按钮 */
const submitForm = (status1: string) => {
status.value = status1;
submit(status.value, form.value);
};
const submitFlow = async () => {
handleStartWorkFlow(form.value);
dialogVisible.visible = false;
};
//提交申请
const handleStartWorkFlow = async (data: LeaveForm) => {
try {
submitFormData.value.flowCode = flowCode.value;
submitFormData.value.businessId = data.id;
//流程变量
taskVariables.value = {
// leave4/5 使用的流程变量
userList: ['1', '3', '4']
};
submitFormData.value.variables = taskVariables.value;
const resp = await startWorkFlow(submitFormData.value);
if (submitVerifyRef.value) {
buttonLoading.value = false;
submitVerifyRef.value.openDialog(resp.data.taskId);
}
} finally {
buttonLoading.value = false;
}
};
//审批记录
const handleApprovalRecord = () => {
approvalRecordRef.value.init(form.value.id);
};
//提交回调
const submitCallback = async () => {
await proxy.$tab.closePage(proxy.$route);
proxy.$router.go(-1);
};
//审批
const approvalVerifyOpen = async () => {
submitVerifyRef.value.openDialog(routeParams.value.taskId);
};
// 图纸上传成功之后 开始提交
const submit = async (status, data) => {
form.value = data;
if (status === 'draft') {
buttonLoading.value = false;
proxy?.$modal.msgSuccess('暂存成功');
proxy.$tab.closePage(proxy.$route);
proxy.$router.go(-1);
} else {
if ((form.value.auditStatus === 'draft' && (flowCode.value === '' || flowCode.value === null)) || routeParams.value.type === 'add') {
flowCode.value = flowCodeOptions[0].value;
dialogVisible.visible = true;
return;
}
//说明启动过先随意穿个参数
if (flowCode.value === '' || flowCode.value === null) {
flowCode.value = 'xx';
}
await handleStartWorkFlow(data);
}
};
onMounted(() => {
nextTick(async () => {
routeParams.value = proxy.$route.query;
console.log('🚀 ~ proxy.$route.query:', proxy.$route.query);
reset();
loading.value = false;
if (routeParams.value.type === 'update' || routeParams.value.type === 'view' || routeParams.value.type === 'approval') {
getInfo();
}
});
});
</script>
<style scoped lang="scss">
/* 全局样式 */
:root {
--primary: #409eff;
--primary-light: #66b1ff;
--primary-dark: #3a8ee6;
--success: #67c23a;
--warning: #e6a23c;
--danger: #f56c6c;
--info: #909399;
}
/* 表单样式优化 */
.el-form-item {
.el-form-item__label {
color: #606266;
font-weight: 500;
}
.el-input__inner,
.el-select .el-input__inner {
border-radius: 4px;
transition:
border-color 0.2s,
box-shadow 0.2s;
&:focus {
border-color: var(--primary-light);
box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.1);
}
}
.el-textarea__inner {
border-radius: 4px;
transition:
border-color 0.2s,
box-shadow 0.2s;
&:focus {
border-color: var(--primary-light);
box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.1);
}
}
}
/* 按钮样式优化 */
.el-button {
border-radius: 4px;
transition: all 0.2s;
&.is-primary {
background-color: var(--primary);
border-color: var(--primary);
&:hover {
background-color: var(--primary-light);
border-color: var(--primary-light);
}
&:active {
background-color: var(--primary-dark);
border-color: var(--primary-dark);
}
}
&.is-text {
color: var(--primary);
&:hover {
color: var(--primary-light);
background-color: rgba(64, 158, 255, 0.05);
}
}
}
/* 卡片样式优化 */
.el-card {
transition: all 0.3s ease;
&:hover {
/* transform: translateY(-2px); */
}
}
/* 对话框样式优化 */
.el-dialog {
.el-dialog__header {
background-color: #f5f7fa;
border-bottom: 1px solid #ebeef5;
padding: 15px 20px;
}
.el-dialog__title {
font-size: 16px;
font-weight: 600;
color: #303133;
}
.el-dialog__footer {
padding: 15px 20px;
border-top: 1px solid #ebeef5;
}
}
</style>

View File

@ -50,16 +50,18 @@
<dict-tag :options="out_value_type" :value="scope.row.valueType" /> <dict-tag :options="out_value_type" :value="scope.row.valueType" />
</template> </template>
</el-table-column> </el-table-column>
<!-- <el-table-column label="操作" align="center" class-name="small-padding fixed-width"> <el-table-column label="流程状态" align="center" prop="status">
<template #default="scope"> <template #default="scope">
<el-tooltip content="修改" placement="top"> <dict-tag :options="wf_business_status" :value="scope.row.completeAuditStatus" />
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['out:monthPlan:edit']"></el-button>
</el-tooltip>
<el-tooltip content="删除" placement="top">
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['out:monthPlan:remove']"></el-button>
</el-tooltip>
</template> </template>
</el-table-column> --> </el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="210">
<template #default="scope">
<el-button link type="primary" icon="Finished" @click="handleAudit(scope.row)" v-hasPermi="['out:constructionValue:remove']"
>审核</el-button
>
</template>
</el-table-column>
</el-table> </el-table>
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" /> <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
@ -97,6 +99,7 @@ import { listMonthPlan, getMonthPlan, delMonthPlan, addMonthPlan, updateMonthPla
import { MonthPlanVO, MonthPlanQuery, MonthPlanForm } from '@/api/out/monthPlan/types'; import { MonthPlanVO, MonthPlanQuery, MonthPlanForm } from '@/api/out/monthPlan/types';
const { proxy } = getCurrentInstance() as ComponentInternalInstance; const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { out_value_type } = toRefs<any>(proxy?.useDict('out_value_type')); const { out_value_type } = toRefs<any>(proxy?.useDict('out_value_type'));
const { wf_business_status } = toRefs<any>(proxy?.useDict('wf_business_status'));
import { useUserStoreHook } from '@/store/modules/user'; import { useUserStoreHook } from '@/store/modules/user';
// 获取用户 store // 获取用户 store
@ -265,6 +268,14 @@ onMounted(() => {
getList(); getList();
}); });
/** 审核按钮操作 */
const handleAudit = async (row?: MonthPlanVO) => {
proxy?.$tab.openPage('/out/designCompletion/indexEdit', '审核设计完工产值', {
id: row?.id,
type: 'update'
});
};
//监听项目id刷新数据 //监听项目id刷新数据
// const listeningProject = watch( // const listeningProject = watch(
// () => currentProject.value.id, // () => currentProject.value.id,

View File

@ -0,0 +1,356 @@
<template>
<div class="p-4 bg-gray-50">
<div class="max-w-4xl mx-auto">
<!-- 顶部按钮区域 -->
<el-card class="mb-4 rounded-lg shadow-sm bg-white border border-gray-100 transition-all hover:shadow-md">
<approvalButton
@submitForm="submitForm"
@approvalVerifyOpen="approvalVerifyOpen"
@handleApprovalRecord="handleApprovalRecord"
:buttonLoading="buttonLoading"
:id="form.id"
:status="form.completeAuditStatus"
:pageType="routeParams.type"
/>
</el-card>
<!-- 表单区域 -->
<el-card class="rounded-lg shadow-sm bg-white border border-gray-100 transition-all hover:shadow-md overflow-hidden">
<div class="p-4 bg-gradient-to-r from-blue-50 to-indigo-50 border-b border-gray-100">
<h3 class="text-lg font-semibold text-gray-800">设计完工产值</h3>
</div>
<div class="p-6">
<el-form
ref="leaveFormRef"
v-loading="loading"
:disabled="routeParams.type === 'view'"
:model="form"
:rules="rules"
label-width="120px"
class="space-y-4"
>
<div class="grid grid-cols-1 gap-4">
<el-row :gutter="20" justify="center">
<el-col :span="13" :offset="0">
<el-form-item label="计划月份" prop="planMonth">
<el-input v-model="form.planMonth" clearable disabled></el-input>
</el-form-item>
</el-col>
<el-col :span="13" :offset="0">
<el-form-item label="完成产值" prop="completeValue">
<el-input v-model="form.completeValue" disabled></el-input>
</el-form-item>
</el-col>
</el-row>
</div>
</el-form>
</div>
</el-card>
<!-- 提交组件 -->
<submitVerify ref="submitVerifyRef" :task-variables="taskVariables" @submit-callback="submitCallback" />
<approvalRecord ref="approvalRecordRef"></approvalRecord>
<!-- 流程选择对话框 -->
<el-dialog
draggable
v-model="dialogVisible.visible"
:title="dialogVisible.title"
:before-close="handleClose"
width="500"
class="rounded-lg shadow-lg"
>
<div class="p-4">
<p class="text-gray-600 mb-4">请选择要启动的流程</p>
<el-select v-model="flowCode" placeholder="请选择流程" style="width: 100%">
<el-option v-for="item in flowCodeOptions" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</div>
<template #footer>
<div class="dialog-footer p-4 border-t border-gray-100 flex justify-end space-x-3">
<el-button @click="handleClose" class="px-4 py-2 border border-gray-300 rounded-md text-gray-700 hover:bg-gray-50 transition-colors"
>取消</el-button
>
<el-button type="primary" @click="submitFlow()" class="px-4 py-2 bg-primary text-white rounded-md hover:bg-primary/90 transition-colors"
>确认</el-button
>
</div>
</template>
</el-dialog>
</div>
</div>
</template>
<script setup name="Leave" lang="ts">
import { LeaveForm, LeaveQuery, LeaveVO } from '@/api/workflow/leave/types';
import { startWorkFlow } from '@/api/workflow/task';
import SubmitVerify from '@/components/Process/submitVerify.vue';
import ApprovalRecord from '@/components/Process/approvalRecord.vue';
import ApprovalButton from '@/components/Process/approvalButton.vue';
import { StartProcessBo } from '@/api/workflow/workflowCommon/types';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
import { useUserStoreHook } from '@/store/modules/user';
const { design_change_reason_type } = toRefs<any>(proxy?.useDict('design_change_reason_type'));
import { getKnowledgeDocument } from '@/api/design/technicalStandard';
import { getConstructionValue } from '@/api/out/constructionValue';
import { workScheduleListDetail } from '@/api/progress/plan';
import { getMonthPlan } from '@/api/out/monthPlan';
// 获取用户 store
const userStore = useUserStoreHook();
// 从 store 中获取项目列表和当前选中的项目
const currentProject = computed(() => userStore.selectedProject);
const buttonLoading = ref(false);
const loading = ref(true);
//路由参数
const routeParams = ref<Record<string, any>>({});
const flowCode = ref<string>('');
const status = ref<string>('');
const dialogVisible = reactive<DialogOption>({
visible: false,
title: '流程定义'
});
//提交组件
const submitVerifyRef = ref<InstanceType<typeof SubmitVerify>>();
//审批记录组件
const approvalRecordRef = ref<InstanceType<typeof ApprovalRecord>>();
//按钮组件
const flowCodeOptions = [
{
value: currentProject.value?.id + '_designCompleteValue',
label: '设计完工产值审批'
}
];
const leaveFormRef = ref<ElFormInstance>();
const dialog = reactive({
visible: false,
title: '',
isEdit: false
});
const submitFormData = ref<StartProcessBo>({
businessId: '',
flowCode: '',
variables: {}
});
const taskVariables = ref<Record<string, any>>({});
const initFormData = {
id: undefined,
projectId: currentProject.value?.id,
planValue: undefined,
completeValue: undefined,
differenceValue: undefined,
planMonth: undefined,
valueType: '1',
planAuditStatus: undefined,
completeAuditStatus: undefined
};
const data = reactive({
form: { ...initFormData },
rules: {}
});
const handleClose = () => {
dialogVisible.visible = false;
flowCode.value = '';
buttonLoading.value = false;
};
const { form, rules } = toRefs(data);
/** 表单重置 */
const reset = () => {
form.value = { ...initFormData };
leaveFormRef.value?.resetFields();
};
/** 获取详情 */
const getInfo = () => {
loading.value = true;
buttonLoading.value = false;
nextTick(async () => {
const res = await getMonthPlan(routeParams.value.id);
Object.assign(form.value, res.data);
loading.value = false;
buttonLoading.value = false;
});
};
/** 提交按钮 */
const submitForm = (status1: string) => {
status.value = status1;
submit(status.value, form.value);
};
const submitFlow = async () => {
handleStartWorkFlow(form.value);
dialogVisible.visible = false;
};
//提交申请
const handleStartWorkFlow = async (data: LeaveForm) => {
try {
submitFormData.value.flowCode = flowCode.value;
submitFormData.value.businessId = data.id;
//流程变量
taskVariables.value = {
// leave4/5 使用的流程变量
userList: ['1', '3', '4']
};
submitFormData.value.variables = taskVariables.value;
const resp = await startWorkFlow(submitFormData.value);
if (submitVerifyRef.value) {
buttonLoading.value = false;
submitVerifyRef.value.openDialog(resp.data.taskId);
}
} finally {
buttonLoading.value = false;
}
};
//审批记录
const handleApprovalRecord = () => {
approvalRecordRef.value.init(form.value.id);
};
//提交回调
const submitCallback = async () => {
await proxy.$tab.closePage(proxy.$route);
proxy.$router.go(-1);
};
//审批
const approvalVerifyOpen = async () => {
submitVerifyRef.value.openDialog(routeParams.value.taskId);
};
// 图纸上传成功之后 开始提交
const submit = async (status, data) => {
form.value = data;
if (status === 'draft') {
buttonLoading.value = false;
proxy?.$modal.msgSuccess('暂存成功');
proxy.$tab.closePage(proxy.$route);
proxy.$router.go(-1);
} else {
if ((form.value.completeAuditStatus === 'draft' && (flowCode.value === '' || flowCode.value === null)) || routeParams.value.type === 'add') {
flowCode.value = flowCodeOptions[0].value;
dialogVisible.visible = true;
return;
}
//说明启动过先随意穿个参数
if (flowCode.value === '' || flowCode.value === null) {
flowCode.value = 'xx';
}
await handleStartWorkFlow(data);
}
};
onMounted(() => {
nextTick(async () => {
routeParams.value = proxy.$route.query;
console.log('🚀 ~ proxy.$route.query:', proxy.$route.query);
reset();
loading.value = false;
if (routeParams.value.type === 'update' || routeParams.value.type === 'view' || routeParams.value.type === 'approval') {
getInfo();
}
});
});
</script>
<style scoped lang="scss">
/* 全局样式 */
:root {
--primary: #409eff;
--primary-light: #66b1ff;
--primary-dark: #3a8ee6;
--success: #67c23a;
--warning: #e6a23c;
--danger: #f56c6c;
--info: #909399;
}
/* 表单样式优化 */
.el-form-item {
.el-form-item__label {
color: #606266;
font-weight: 500;
}
.el-input__inner,
.el-select .el-input__inner {
border-radius: 4px;
transition:
border-color 0.2s,
box-shadow 0.2s;
&:focus {
border-color: var(--primary-light);
box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.1);
}
}
.el-textarea__inner {
border-radius: 4px;
transition:
border-color 0.2s,
box-shadow 0.2s;
&:focus {
border-color: var(--primary-light);
box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.1);
}
}
}
/* 按钮样式优化 */
.el-button {
border-radius: 4px;
transition: all 0.2s;
&.is-primary {
background-color: var(--primary);
border-color: var(--primary);
&:hover {
background-color: var(--primary-light);
border-color: var(--primary-light);
}
&:active {
background-color: var(--primary-dark);
border-color: var(--primary-dark);
}
}
&.is-text {
color: var(--primary);
&:hover {
color: var(--primary-light);
background-color: rgba(64, 158, 255, 0.05);
}
}
}
/* 卡片样式优化 */
.el-card {
transition: all 0.3s ease;
&:hover {
/* transform: translateY(-2px); */
}
}
/* 对话框样式优化 */
.el-dialog {
.el-dialog__header {
background-color: #f5f7fa;
border-bottom: 1px solid #ebeef5;
padding: 15px 20px;
}
.el-dialog__title {
font-size: 16px;
font-weight: 600;
color: #303133;
}
.el-dialog__footer {
padding: 15px 20px;
border-top: 1px solid #ebeef5;
}
}
</style>

View File

@ -58,14 +58,16 @@
<dict-tag :options="out_value_type" :value="scope.row.valueType" /> <dict-tag :options="out_value_type" :value="scope.row.valueType" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width"> <el-table-column label="流程状态" align="center" prop="planAuditStatus">
<template #default="scope"> <template #default="scope">
<el-tooltip content="修改" placement="top"> <dict-tag :options="wf_business_status" :value="scope.row.planAuditStatus" />
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['out:monthPlan:edit']"></el-button> </template>
</el-tooltip> </el-table-column>
<el-tooltip content="删除" placement="top"> <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['out:monthPlan:remove']"></el-button> <template #default="scope"
</el-tooltip> ><el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['out:monthPlan:edit']">修改</el-button>
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['out:monthPlan:remove']">删除</el-button>
<el-button link type="primary" icon="Finished" @click="handleAudit(scope.row)" v-hasPermi="['out:monthPlan:remove']">审核</el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
@ -102,6 +104,7 @@ import { listMonthPlan, getMonthPlan, delMonthPlan, addMonthPlan, updateMonthPla
import { MonthPlanVO, MonthPlanQuery, MonthPlanForm } from '@/api/out/monthPlan/types'; import { MonthPlanVO, MonthPlanQuery, MonthPlanForm } from '@/api/out/monthPlan/types';
const { proxy } = getCurrentInstance() as ComponentInternalInstance; const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { out_value_type } = toRefs<any>(proxy?.useDict('out_value_type')); const { out_value_type } = toRefs<any>(proxy?.useDict('out_value_type'));
const { wf_business_status } = toRefs<any>(proxy?.useDict('wf_business_status'));
import { useUserStoreHook } from '@/store/modules/user'; import { useUserStoreHook } from '@/store/modules/user';
// 获取用户 store // 获取用户 store
@ -221,6 +224,7 @@ const handleUpdate = async (row?: MonthPlanVO) => {
/** 提交按钮 */ /** 提交按钮 */
const submitForm = () => { const submitForm = () => {
form.value.projectId = currentProject.value.id;
monthPlanFormRef.value?.validate(async (valid: boolean) => { monthPlanFormRef.value?.validate(async (valid: boolean) => {
if (valid) { if (valid) {
buttonLoading.value = true; buttonLoading.value = true;
@ -245,6 +249,14 @@ const handleDelete = async (row?: MonthPlanVO) => {
await getList(); await getList();
}; };
/** 审核按钮操作 */
const handleAudit = async (row?: MonthPlanVO) => {
proxy?.$tab.openPage('/out/monthPlan/indexEdit', '审核月度产值计划', {
planMonth: row?.planMonth,
type: 'update'
});
};
/** 导出按钮操作 */ /** 导出按钮操作 */
const handleExport = () => { const handleExport = () => {
proxy?.download( proxy?.download(

View File

@ -0,0 +1,368 @@
<template>
<div class="p-4 bg-gray-50">
<div class="max-w-4xl mx-auto">
<!-- 顶部按钮区域 -->
<el-card class="mb-4 rounded-lg shadow-sm bg-white border border-gray-100 transition-all hover:shadow-md">
<approvalButton
@submitForm="submitForm"
@approvalVerifyOpen="approvalVerifyOpen"
@handleApprovalRecord="handleApprovalRecord"
:buttonLoading="buttonLoading"
:id="form[0]?.id"
:status="form[0]?.planAuditStatus"
:pageType="routeParams.type"
/>
</el-card>
<!-- 表单区域 -->
<el-card class="rounded-lg shadow-sm bg-white border border-gray-100 transition-all hover:shadow-md overflow-hidden">
<div class="p-4 bg-gradient-to-r from-blue-50 to-indigo-50 border-b border-gray-100">
<h3 class="text-lg font-semibold text-gray-800">月度产值计划</h3>
</div>
<div class="p-6">
<el-form
ref="leaveFormRef"
v-loading="loading"
:disabled="routeParams.type === 'view'"
:model="form"
:rules="rules"
label-width="120px"
class="space-y-4"
>
<div class="grid grid-cols-1 gap-4">
<el-row :gutter="20" justify="space-between" v-for="item in form">
<el-col :span="8" :offset="0">
<el-form-item label="计划产值" prop="planValue">
<el-input v-model="item.planValue" placeholder="请输入计划产值" disabled />
</el-form-item>
</el-col>
<el-col :span="8" :offset="0">
<el-form-item label="计划月份" prop="planMonth">
<el-date-picker v-model="item.planMonth" type="month" value-format="YYYY-MM" disabled placeholder="请选择计划月份" />
</el-form-item>
</el-col>
<el-col :span="8" :offset="0">
<el-form-item label="产值类型" prop="valueType">
<el-select v-model="item.valueType" placeholder="请选择产值类型" disabled>
<el-option v-for="it in out_value_type" :key="it.value" :label="it.label" :value="it.value" />
</el-select>
</el-form-item>
</el-col>
</el-row>
</div>
</el-form>
</div>
</el-card>
<!-- 提交组件 -->
<submitVerify ref="submitVerifyRef" :task-variables="taskVariables" @submit-callback="submitCallback" />
<approvalRecord ref="approvalRecordRef"></approvalRecord>
<!-- 流程选择对话框 -->
<el-dialog
draggable
v-model="dialogVisible.visible"
:title="dialogVisible.title"
:before-close="handleClose"
width="500"
class="rounded-lg shadow-lg"
>
<div class="p-4">
<p class="text-gray-600 mb-4">请选择要启动的流程</p>
<el-select v-model="flowCode" placeholder="请选择流程" style="width: 100%">
<el-option v-for="item in flowCodeOptions" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</div>
<template #footer>
<div class="dialog-footer p-4 border-t border-gray-100 flex justify-end space-x-3">
<el-button @click="handleClose" class="px-4 py-2 border border-gray-300 rounded-md text-gray-700 hover:bg-gray-50 transition-colors"
>取消</el-button
>
<el-button type="primary" @click="submitFlow()" class="px-4 py-2 bg-primary text-white rounded-md hover:bg-primary/90 transition-colors"
>确认</el-button
>
</div>
</template>
</el-dialog>
</div>
</div>
</template>
<script setup name="Leave" lang="ts">
import { LeaveForm, LeaveQuery, LeaveVO } from '@/api/workflow/leave/types';
import { startWorkFlow } from '@/api/workflow/task';
import SubmitVerify from '@/components/Process/submitVerify.vue';
import ApprovalRecord from '@/components/Process/approvalRecord.vue';
import ApprovalButton from '@/components/Process/approvalButton.vue';
import { StartProcessBo } from '@/api/workflow/workflowCommon/types';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
import { useUserStoreHook } from '@/store/modules/user';
import { getMonthInfo, isSubmit } from '@/api/out/monthPlan';
// 获取用户 store
const userStore = useUserStoreHook();
// 从 store 中获取项目列表和当前选中的项目
const currentProject = computed(() => userStore.selectedProject);
const buttonLoading = ref(false);
const loading = ref(true);
const { out_value_type } = toRefs<any>(proxy?.useDict('out_value_type'));
//路由参数
const routeParams = ref<Record<string, any>>({});
const flowCode = ref<string>('');
const status = ref<string>('');
const dialogVisible = reactive<DialogOption>({
visible: false,
title: '流程定义'
});
//提交组件
const submitVerifyRef = ref<InstanceType<typeof SubmitVerify>>();
//审批记录组件
const approvalRecordRef = ref<InstanceType<typeof ApprovalRecord>>();
//按钮组件
const flowCodeOptions = [
{
value: currentProject.value?.id + '_monthPlan',
label: '月度产值计划审批'
}
];
const leaveFormRef = ref<ElFormInstance>();
const dialog = reactive({
visible: false,
title: '',
isEdit: false
});
const submitFormData = ref<StartProcessBo>({
businessId: '',
flowCode: '',
variables: {}
});
const taskVariables = ref<Record<string, any>>({});
const initFormData = [];
const data = reactive({
form: { ...initFormData },
rules: {}
});
const handleClose = () => {
dialogVisible.visible = false;
flowCode.value = '';
buttonLoading.value = false;
};
const { form, rules } = toRefs(data);
/** 表单重置 */
const reset = () => {
form.value = { ...initFormData };
leaveFormRef.value?.resetFields();
};
/** 获取详情 */
const getInfo = () => {
loading.value = true;
buttonLoading.value = false;
nextTick(async () => {
console.log('🚀 ~ routeParams.value:', routeParams.value.businessId);
const projectId = routeParams.value.businessId ? routeParams.value.businessId.split('_')[0] : currentProject.value?.id;
const res = await getMonthInfo({ projectId: projectId, planMonth: routeParams.value.planMonth });
form.value = res.data as any;
console.log('🚀 ~ getInfo ~ form.value:', form.value[0].projectId);
form.value[0].id = form.value[0].projectId + '_' + form.value[0].planMonth;
loading.value = false;
buttonLoading.value = false;
});
};
/** 提交按钮 */
const submitForm = (status1: string) => {
status.value = status1;
submit(status.value, form.value);
};
const submitFlow = async () => {
handleStartWorkFlow(form.value);
dialogVisible.visible = false;
};
//提交申请
const handleStartWorkFlow = async (data: LeaveForm) => {
try {
submitFormData.value.flowCode = flowCode.value;
submitFormData.value.businessId = currentProject.value.id + '_' + form.value[0]?.planMonth;
//流程变量
taskVariables.value = {
// leave4/5 使用的流程变量
userList: ['1', '3', '4']
};
submitFormData.value.variables = taskVariables.value;
const resp = await startWorkFlow(submitFormData.value);
if (submitVerifyRef.value) {
buttonLoading.value = false;
submitVerifyRef.value.openDialog(resp.data.taskId);
}
} finally {
buttonLoading.value = false;
}
};
//审批记录
const handleApprovalRecord = () => {
console.log(form.value[0]?.id);
approvalRecordRef.value.init(form.value[0]?.id);
};
//提交回调
const submitCallback = async () => {
await proxy.$tab.closePage(proxy.$route);
proxy.$router.go(-1);
};
//审批
const approvalVerifyOpen = async () => {
submitVerifyRef.value.openDialog(routeParams.value.taskId);
};
// 图纸上传成功之后 开始提交
const submit = async (status, data) => {
form.value = data;
if (status === 'draft') {
buttonLoading.value = false;
proxy?.$modal.msgSuccess('暂存成功');
proxy.$tab.closePage(proxy.$route);
proxy.$router.go(-1);
} else {
const res = await isSubmit(data[0]?.id);
if (!res.data) {
proxy?.$modal.msgError('三种计划产值必须填写');
return;
}
if ((form.value[0]?.planAuditStatus === 'draft' && (flowCode.value === '' || flowCode.value === null)) || routeParams.value.type === 'add') {
flowCode.value = flowCodeOptions[0].value;
dialogVisible.visible = true;
return;
}
//说明启动过先随意穿个参数
if (flowCode.value === '' || flowCode.value === null) {
flowCode.value = 'xx';
}
await handleStartWorkFlow(data);
}
};
onMounted(() => {
nextTick(async () => {
routeParams.value = proxy.$route.query;
console.log('🚀 ~ proxy.$route.query:', proxy.$route.query);
reset();
loading.value = false;
if (routeParams.value.type === 'update' || routeParams.value.type === 'view' || routeParams.value.type === 'approval') {
console.log('🚀 ~ routeParams.value:', routeParams.value);
getInfo();
}
});
});
</script>
<style scoped lang="scss">
/* 全局样式 */
:root {
--primary: #409eff;
--primary-light: #66b1ff;
--primary-dark: #3a8ee6;
--success: #67c23a;
--warning: #e6a23c;
--danger: #f56c6c;
--info: #909399;
}
/* 表单样式优化 */
.el-form-item {
.el-form-item__label {
color: #606266;
font-weight: 500;
}
.el-input__inner,
.el-select .el-input__inner {
border-radius: 4px;
transition:
border-color 0.2s,
box-shadow 0.2s;
&:focus {
border-color: var(--primary-light);
box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.1);
}
}
.el-textarea__inner {
border-radius: 4px;
transition:
border-color 0.2s,
box-shadow 0.2s;
&:focus {
border-color: var(--primary-light);
box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.1);
}
}
}
/* 按钮样式优化 */
.el-button {
border-radius: 4px;
transition: all 0.2s;
&.is-primary {
background-color: var(--primary);
border-color: var(--primary);
&:hover {
background-color: var(--primary-light);
border-color: var(--primary-light);
}
&:active {
background-color: var(--primary-dark);
border-color: var(--primary-dark);
}
}
&.is-text {
color: var(--primary);
&:hover {
color: var(--primary-light);
background-color: rgba(64, 158, 255, 0.05);
}
}
}
/* 卡片样式优化 */
.el-card {
transition: all 0.3s ease;
&:hover {
/* transform: translateY(-2px); */
}
}
/* 对话框样式优化 */
.el-dialog {
.el-dialog__header {
background-color: #f5f7fa;
border-bottom: 1px solid #ebeef5;
padding: 15px 20px;
}
.el-dialog__title {
font-size: 16px;
font-weight: 600;
color: #303133;
}
.el-dialog__footer {
padding: 15px 20px;
border-top: 1px solid #ebeef5;
}
}
</style>

View File

@ -160,6 +160,7 @@ const handleOpen = async (row: FlowTaskVO) => {
taskId: row.id, taskId: row.id,
type: 'approval', type: 'approval',
formCustom: row.formCustom, formCustom: row.formCustom,
planMonth: row.businessId.split('_')[1],
formPath: row.formPath formPath: row.formPath
}); });
workflowCommon.routerJump(routerJumpVo, proxy); workflowCommon.routerJump(routerJumpVo, proxy);