taoge_xiaodi/td_official
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

优化

Browse Source
This commit is contained in:
taoge1020
2025-09-06 12:45:15 +08:00
parent db20b45f78 03ec2223aa
commit f0af5e47fa
6 changed files with 398 additions and 93 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
src/api/materials/materialOutbound/index.ts Normal file
View File

@ -0,0 +1,27 @@
import request from '@/utils/request';
//获取出库材料得列表
export const outboundMaterials = (query?: any) => {
return request({
url: '/materials/materials/listRelevancy',
method: 'get',
params: query
});
};
//新增出库
export const addOutbound = (data?: any) => {
return request({
url: '/materials/materialsInventory',
method: 'post',
data
});
};
//获取材料列表
export const getMaterialsList = (query?: any) => {
return request({
url: '/materials/materials/list',
method: 'get',
params: query
});
};

15
src/api/materials/materialsUseRecord/types.ts
View File

@ -33,7 +33,6 @@ export interface MaterialsUseRecordVO {
* 备注
*/
remark: string;
}
export interface MaterialsUseRecordForm extends BaseEntity {
@ -71,11 +70,9 @@ export interface MaterialsUseRecordForm extends BaseEntity {
* 备注
*/
remark?: string;
}
export interface MaterialsUseRecordQuery extends PageQuery {
/**
* 项目ID
*/
@ -101,11 +98,9 @@ export interface MaterialsUseRecordQuery extends PageQuery {
*/
residueNumber?: string | number;
/**
* 日期范围参数
*/
params?: any;
/**
* 日期范围参数
*/
params?: any;
materialsId?: string | number;
}

90
src/views/materials/materialOutbound/component/outbound.vue Normal file
View File

@ -0,0 +1,90 @@
<template>
<div class="p-2">
<el-table size="small" v-if="props.row.length !== 0" :data="props.row">
<el-table-column label="材料名称" align="center" prop="materialsName" />
<!-- <el-table-column label="材料数量" align="center" prop="quantityCount" /> -->
<el-table-column label="剩余量" align="center" prop="residue">
<template #default="scope">
<span>{{ scope.row.residue }}</span>
</template>
</el-table-column>
<el-table-column label="出库数量" align="center" prop="number">
<template #default="scope">
<el-input-number v-if="scope.row.type" v-model="scope.row.number" :controls="false" :min="0" :max="scope.row.residue" :precision="0" />
<span v-else>{{ scope.row.number }}</span>
</template>
</el-table-column>
<el-table-column label="交接单位" align="center" prop="recipient">
<template #default="scope">
<el-input v-if="scope.row.type" style="width: 150px" v-model="scope.row.recipient" />
<span v-else>{{ scope.row.recipient }}</span>
</template>
</el-table-column>
<el-table-column label="领用人" align="center" prop=" shipper">
<template #default="scope">
<el-input v-if="scope.row.type" style="width: 150px" v-model="scope.row.shipper" />
<span v-else>{{ scope.row.shipper }}</span>
</template>
</el-table-column>
<el-table-column label="操作人" align="center" prop="operator">
<template #default="scope">
<el-input v-if="scope.row.type" style="width: 150px" v-model="scope.row.operator" />
<span v-else>{{ scope.row.operator }}</span>
</template>
</el-table-column>
<el-table-column label="出库时间" align="center" prop="outPutTime" width="180" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template #default="scope">
<el-button link type="primary" @click="handleConfirm(scope.row)" v-if="scope.row.type"> 确认 </el-button>
</template>
</el-table-column>
</el-table>
</div>
</template>
<script setup lang="ts">
import { useUserStoreHook } from '@/store/modules/user';
import { addOutbound } from '@/api/materials/materialOutbound';
// 获取用户 store
const userStore = useUserStoreHook();
// 从 store 中获取项目列表和当前选中的项目
const currentProject = computed(() => userStore.selectedProject);
const emit = defineEmits(['success']);
const props = defineProps({
row: {
type: Array,
default: () => []
}
});
const handleConfirm = async (row: any) => {
if (row.number == 0 || !row.number) {
ElMessage.error('请输入出库数量');
return;
}
if (!row.shipper) {
ElMessage.error('请输入领用人');
return;
}
if (!row.operator) {
ElMessage.error('请输入操作人');
return;
}
console.log(row);
const params = {
...row,
materialsId: row.id,
projectId: currentProject.value?.id,
outPut: '1'
};
console.log(params);
const data = await addOutbound(params);
if (data.code === 200) {
ElMessage.success('出库成功');
emit('success');
}
};
</script>

148
src/views/materials/materialOutbound/index.vue Normal file
View File

@ -0,0 +1,148 @@
<template>
<div class="p-2">
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
<div class="mb-[10px]">
<el-card shadow="hover">
<el-form ref="queryFormRef" :model="queryParams" :inline="true">
<el-form-item label="材料名称" prop="materialName">
<el-input v-model="queryParams.materialName" placeholder="请输入材料名称" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item>
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
</el-card>
</div>
</transition>
<el-card shadow="never">
<el-table
v-loading="loading"
:data="tableList"
:row-key="
(row) => {
return row.id;
}
"
@row-click="
(row, column, event) => {
// 阻止点击行时自动展开
if (column.property) event.stopPropagation();
}
"
:preserve-expanded-content="true"
>
<el-table-column type="expand">
<template #default="{ row }">
<outbound :row="row.children ?? []" @success="getTableList" />
</template>
</el-table-column>
<el-table-column label="序号" type="index" width="60" align="center" />
<el-table-column label="材料名称" align="center" prop="materialsName" />
<el-table-column label="规格" align="center" prop="typeSpecificationName" />
<el-table-column label="计量单位" align="center" prop="weightId" />
<el-table-column label="材料数量" align="center" prop="quantityCount" />
<el-table-column label="剩余量" align="center" prop="residue" />
<el-table-column label="操作人" align="center" prop="operator"> </el-table-column>
<el-table-column label="创建时间" align="center" prop="createTime" width="180" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template #default="scope">
<el-button link type="primary" icon="Plus" @click="handleoutbound(scope.row)"> 新增出库 </el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total > 0"
:total="total"
v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize"
@pagination="getTableList"
/>
</el-card>
</div>
</template>
<script setup lang="ts">
import { outboundMaterials } from '@/api/materials/materialOutbound';
import { useUserStoreHook } from '@/store/modules/user';
import outbound from './component/outbound.vue';
import { number } from 'vue-types';
const { proxy } = getCurrentInstance() as any;
const queryFormRef = ref();
const queryParams = ref({
materialName: '',
pageNum: 1,
pageSize: 10
});
const total = ref(0);
const loading = ref(false);
const tableList = ref([]);
// 获取用户 store
const userStore = useUserStoreHook();
// 从 store 中获取项目列表和当前选中的项目
const currentProject = computed(() => userStore.selectedProject);
//获取列表数据
const getTableList = async () => {
try {
loading.value = true;
const res = await outboundMaterials({ ...queryParams.value, projectId: currentProject.value?.id });
if (res.code === 200) {
loading.value = false;
tableList.value = res.rows;
total.value = res.data.total;
}
} catch (error) {
loading.value = false;
}
};
getTableList();
// 出入库
const handleoutbound = (row: any) => {
console.log(row);
if (row.children == null) {
row.children = [];
}
if (row.children.some((child) => child.type === 'add')) {
ElMessage.warning('已经存在出库记录，不能重复添加');
return;
}
row.children.push({
type: 'add',
id: row.id,
number: 0,
operator: '',
shipper: '',
recipient: '',
residue: row.residue,
materialsName: row.materialsName
});
// 手动触发展开行
const table = document.querySelector('.el-table__body-wrapper');
const rows = table?.querySelectorAll('.el-table__row');
const rowEl = rows?.[Array.from(tableList.value).indexOf(row)];
const expandBtn: any = rowEl?.querySelector('.el-table__expand-icon');
// 如果行未展开，则点击展开按钮
if (expandBtn && !expandBtn.classList.contains('el-table__expand-icon--expanded')) {
expandBtn.click();
}
};
//搜索
const handleQuery = () => {
queryParams.value.pageNum = 1;
getTableList();
};
//重置
const resetQuery = () => {
console.log(111111111);
queryFormRef.value?.resetFields();
handleQuery();
};
</script>
<style scoped></style>

207
src/views/materials/materialsUseRecord/index.vue
View File

@ -1,84 +1,101 @@
<template>
<div class="p-2">
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave"> </transition>
<el-card shadow="never">
<template #header>
<el-row :gutter="10" class="mb8">
<el-form ref="queryFormRef" :model="queryParams" :inline="true">
<el-form-item label="物资名称" prop="materialsName">
<el-input v-model="queryParams.materialsName" placeholder="请输入物资名称" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item>
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
</template>
<!-- 外层表格：使用expandedRowKeys控制展开状态 -->
<el-table
ref="outerTableRef"
v-loading="loading"
:data="materialsUseInventoryList"
@expand-change="handleExpandChange"
border
:expanded-row-keys="expandedRowKeys"
>
<el-table-column type="expand">
<template #default="props">
<div style="margin-left: 60px">
<!-- 子表格：使用当前行的独立数据 -->
<el-table :data="getChildData(props.row.id)" border v-loading="getChildLoading(props.row.id)">
<el-table-column label="序号" align="center" type="index" width="60" />
<el-table-column label="使用数量" align="center" prop="useNumber" />
<el-table-column label="剩余量" align="center" prop="residueNumber" />
<el-table-column label="使用部位" align="center" prop="usePart" />
<el-table-column label="备注" align="center" prop="remark" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template #default="scope">
<el-button
link
type="primary"
icon="delete"
v-if="scope.row.ishow"
@click="handleDelete(scope.row, props.row.id)"
v-hasPermi="['materials:materialsUseRecord:remove']"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
<!-- 子分页：使用当前行的独立分页参数 -->
<pagination
v-show="getChildTotal(props.row.id) > 0"
:total="getChildTotal(props.row.id)"
v-model:page="getChildQueryParams(props.row.id).pageNum"
v-model:limit="getChildQueryParams(props.row.id).pageSize"
@pagination="(page, limit) => handleChildPagination(props.row.id, page, limit)"
/>
</div>
<el-row :gutter="10" class="mb8">
<el-col :span="4">
<el-card shadow="never">
<el-tree style="max-width: 600px" :data="TreeData" :props="defaultProps" @node-click="handleNodeClick" />
</el-card>
</el-col>
<el-col :span="20">
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave"> </transition>
<el-card shadow="never">
<template #header>
<el-row :gutter="10" class="mb8">
<el-form ref="queryFormRef" :model="queryParams" :inline="true">
<el-form-item label="物资名称" prop="materialsName">
<el-input v-model="queryParams.materialsName" placeholder="请输入物资名称" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item>
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
</template>
</el-table-column>
<el-table-column label="序号" align="center" type="index" width="60" />
<el-table-column label="物资名称" align="center" prop="materialsName" />
<el-table-column label="交接单位" align="center" prop="recipient" />
<el-table-column label="计划数量" align="center" prop="quantityCount" />
<el-table-column label="数量" align="center" prop="number" />
<el-table-column label="出库人" align="center" prop="operator" />
<el-table-column label="领用人" align="center" prop="shipper" />
<el-table-column label="剩余量" align="center" prop="residue" />
<el-table-column label="备注" align="center" prop="remark" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template #default="scope">
<el-button link type="primary" icon="Plus" @click="handleAdd(scope.row)" v-hasPermi="['materials:materialsUseRecord:add']"
>添加登记</el-button
>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
</el-card>
<!-- 外层表格：使用expandedRowKeys控制展开状态 -->
<el-table
ref="outerTableRef"
v-loading="loading"
:data="materialsUseInventoryList"
@expand-change="handleExpandChange"
border
:expanded-row-keys="expandedRowKeys"
>
<el-table-column type="expand">
<template #default="props">
<div style="margin-left: 60px">
<!-- 子表格：使用当前行的独立数据 -->
<el-table :data="getChildData(props.row.id)" border v-loading="getChildLoading(props.row.id)">
<el-table-column label="序号" align="center" type="index" width="60" />
<el-table-column label="使用数量" align="center" prop="useNumber" />
<el-table-column label="剩余量" align="center" prop="residueNumber" />
<el-table-column label="使用部位" align="center" prop="usePart" />
<el-table-column label="备注" align="center" prop="remark" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template #default="scope">
<el-button
link
type="primary"
icon="delete"
v-if="scope.row.ishow"
@click="handleDelete(scope.row, props.row.id)"
v-hasPermi="['materials:materialsUseRecord:remove']"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
<!-- 子分页：使用当前行的独立分页参数 -->
<pagination
v-show="getChildTotal(props.row.id) > 0"
:total="getChildTotal(props.row.id)"
v-model:page="getChildQueryParams(props.row.id).pageNum"
v-model:limit="getChildQueryParams(props.row.id).pageSize"
@pagination="(page, limit) => handleChildPagination(props.row.id, page, limit)"
/>
</div>
</template>
</el-table-column>
<el-table-column label="序号" align="center" type="index" width="60" />
<el-table-column label="物资名称" align="center" prop="materialsName" />
<el-table-column label="交接单位" align="center" prop="recipient" />
<el-table-column label="计划数量" align="center" prop="quantityCount" />
<el-table-column label="数量" align="center" prop="number" />
<el-table-column label="出库人" align="center" prop="operator" />
<el-table-column label="领用人" align="center" prop="shipper" />
<el-table-column label="剩余量" align="center" prop="residue" />
<el-table-column label="备注" align="center" prop="remark" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template #default="scope">
<el-button link type="primary" icon="Plus" @click="handleAdd(scope.row)" v-hasPermi="['materials:materialsUseRecord:add']"
>添加登记</el-button
>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total > 0"
:total="total"
v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize"
@pagination="getList"
/>
</el-card>
</el-col>
</el-row>
<!-- 添加或修改材料使用登记对话框 -->
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
<el-form ref="materialsUseRecordFormRef" :model="form" :rules="rules" label-width="80px">
@ -115,7 +132,7 @@ import { MaterialsUseRecordVO, MaterialsUseRecordQuery, MaterialsUseRecordForm }
import { getCurrentInstance, ComponentInternalInstance, onMounted, ref, reactive, toRefs, computed, watch, WatchStopHandle } from 'vue';
import { ElFormInstance, ElTable } from 'element-plus';
import useUserStore from '@/store/modules/user';
import { get } from 'lodash';
import { getMaterialsList } from '@/api/materials/materialOutbound';
// 类型定义补充
interface DialogOption {
@ -183,7 +200,8 @@ const data = reactive({
projectId: currentProject.value?.id,
outPut: 1,
materialsName: undefined,
usePart: undefined
usePart: undefined,
materialsId: ''
} as MaterialsUseRecordQuery & {
outPut?: number;
materialsName?: string;
@ -199,6 +217,32 @@ const data = reactive({
const { form, rules } = toRefs(data);
const queryParams = ref<typeof data.queryParams>({ ...data.queryParams });
const TreeData: any = ref([]);
//获取材料列表
const getMaterialsListData = async () => {
const res = await getMaterialsList({ projectId: currentProject.value?.id, pageNum: 1, pageSize: 999 });
if (res.code === 200) {
// 将数据转换为树形结构
TreeData.value = res.rows.map((item) => ({
...item,
label: item.materialsName + '_' + item.createTime,
children: []
}));
queryParams.value.materialsId = TreeData.value[0].id;
getList();
}
};
const handleNodeClick = (data: any) => {
console.log(data);
queryParams.value.materialsId = data.id;
getList();
};
const defaultProps = {
children: 'children',
label: 'label'
};
// ------------------------------ 子列表状态工具函数 ------------------------------
/** 获取或初始化指定父行的子列表状态 */
@ -420,6 +464,7 @@ onUnmounted(() => {
// 页面挂载时加载数据
onMounted(() => {
getList();
// getList();
getMaterialsListData();
});
</script>