2025-05-21 13:36:04 +08:00

385 lines
13 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!--
功能功能描述 物料信息
作者Libra
邮箱mingxichen@163.com
时间2024年04月08日 15:46:01
版本v1.0
修改记录
修改内容
修改人员
修改时间
-->
<template>
<div class="vue-element-page-wrap" ref="tableContainer">
<el-row class="page-search" justify="space-between" align="middle">
<el-form ref="queryFormRef" :model="state.queryParams.params" :inline="true" @submit.native.prevent>
<el-row :gutter="20">
<el-col :span="6">
<el-form-item label="物料编号" prop="MATERIALSPECNAME">
<el-Input v-model="state.queryParams.params.MATERIALSPECNAME" placeholder="物料编号"
v-on:keyup.enter="queryInfo" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="品名" prop="DESC_CN">
<el-Input v-model="state.queryParams.params.DESC_CN" placeholder="品名" v-on:keyup.enter="queryInfo" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="物料类型" prop="MATERIALTYPE">
<el-Input v-model="state.queryParams.params.MATERIALTYPE" placeholder="物料类型"
v-on:keyup.enter="queryInfo" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="恒温恒湿管控" prop="MATERIALSPECNAME">
<el-select v-model="state.queryParams.params.IS_CON_TEMP" placeholder="恒温恒湿管控" style="width: 240px"
default-first-option>
<el-option v-for="item in state.TEMPList" :key="item.value" :label="item.label"
:value="item.value" />
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div class="page-search-btns">
<el-button type="primary" @click="queryInfo" :disabled="state.disableds" v-loading="state.loadings">搜索</el-button>
</div>
</el-row>
<div class="vue-element-page-table">
<div class="page-table-operate">
<div class="page-table-title">
<div class="page-table-title-left">
<span>物料信息列表</span>
</div>
</div>
<div class="page-table-operateBtns">
<el-popover :persistent="false" placement="right" popper-class="config-table-wrap" trigger="click">
<template #reference>
<el-button class="operateBtns-setting">
<svg-icon icon-class="table_title" width="25px" height="16px" />
</el-button>
</template>
<ConfigTable :list="materialTableConfig.column" @updateList="updateList" />
</el-popover>
</div>
</div>
<el-table
border
v-loading="materialTableConfig.loading"
:data="state.MaterialList"
highlight-current-row
:height="200"
row-key="id"
@row-click="selectRow">
<template v-for="(col, index) in materialTableConfig.column" :key="index">
<el-table-column
v-if="!col.hide"
:label="col.header"
:prop="col.field"
align="center"
show-overflow-tooltip>
<template #default="scope">
<span>{{ scope.row[col.field] }}</span>
<!-- 或者直接使用 {{ scope.row[col.prop] }} 如果 col.prop 存在且您想用它 -->
</template>
</el-table-column>
</template>
</el-table>
<pagination v-if="state.total > 0" :total="state.total" v-model:pageNumTo="state.queryParams.pageNum"
v-model:pageSizeTo="state.queryParams.pageSize" @pagination="handleQuery" />
</div>
<div class="vue-element-page-table">
<div class="page-table-operate">
<div class="page-table-title">
<div class="page-table-title-left">
<span>工厂信息列表</span>
</div>
</div>
</div>
<el-table
border
v-loading="state.materialFactoryLoading"
:data="state.materialFactoryList"
highlight-current-row
:height="200"
row-key="id">
<template v-for="(col, index) in state.materialFactoryColumn" :key="index">
<el-table-column
v-if="!col.hide"
:label="col.header"
:prop="col.field"
align="center"
show-overflow-tooltip>
<template #default="scope">
<span>{{ scope.row[col.field] }}</span>
<!-- 或者直接使用 {{ scope.row[col.prop] }} 如果 col.prop 存在且您想用它 -->
</template>
</el-table-column>
</template>
</el-table>
<pagination v-if="state.materialFactoryTotal > 0" :total="state.materialFactoryTotal" v-model:pageNumTo="state.materialFactoryQueryParams.pageNum"
v-model:pageSizeTo="state.materialFactoryQueryParams.pageSize" @pagination="handleQueryMaterialFactory" />
</div>
</div>
</template>
<script lang="ts">
export default {
name: "materialInfo",
};
</script>
<script lang="ts" setup>
import { reactive, ref, onMounted, onUnmounted, toRefs, getCurrentInstance, nextTick } from "vue";
import { ElForm, ElMessageBox, ElTable } from "element-plus";
import { getQueryList, getQueryPageList, BpelEvent } from '@/api/common';
import { bTableHeight } from "../../../../composables/calcTableHeight";
const { tableContainer, tableHeight, updateTableHeight, handleResize } = bTableHeight(180);
const queryFormRef = ref(ElForm);
const formDataRef = ref(ElForm);
const formDataRefData = ref({
SITENAME: '',//工厂
TEMPList: [{ label: '是', value: 'Y' }, { label: '否', value: 'N' }] as any,
SITENAMElIST: [{ label: 'A', value: 'a' }],//工厂列表
MATERIALSPECNAME: '',//物料编号
MATERIALSPECDESCRIPTION: '',//物料描述
CHECKSTATE: '',//check state
CHECKSTATELIST: [{ label: 'A', value: 'a' }],//check state列表
ERPLOCATION: '',//ERP库位
MATERIALTYPE: '',//物料类型
MATERIALLIFEMARK: '',//寿命管理标记
MATERIALGROUP: '',//物料组
DESC_CN: '',//中文描述
DESC_EN: '',//英文描述
EXPIRINGDATE: '',//过期时间
STOCKDATE: '',//入库有效期
MATERIALGROUPDESCRIPTION: '',//物料组描述
MATERIALUNIT: '',//单位
MATERIALWEIGHT: '',//物料重量
ERPFACTORY: '',//ERP工厂
MATERIALSPECTYPE: '',//物料类别
})
/***---------------------------------------------------------------------------
* -------------------------------------页面SQL语句配置------------------------------------------ */
const state = reactive({
materialFactoryList: [],
materialFactoryLoading: false,
materialFactoryColumn: [] as any,
materialFactoryTotal: 0,
materialFactoryQueryParams: {
queryId: 'GetMaterialFactoryList',
version: '10001',
params: {
MATERIALSPECNAME: ''
},
pageNum: 1,
pageSize: 10
},
loadings : false,
disableds : false,
rsa: '',
DBProcessType: 'save',
queryParams: {
queryId: 'GetMaterialSpecList',
version: '10004',
params: {
MATERIALSPECNAME: '',
SITENAME: 'SDK',
DESC_CN: '',
IS_CON_TEMP: '',
MATERIALTYPE: '',
},
pageNum: 1,
pageSize: 20
},
ChangeParams: {
header: {
MESSAGENAME: '',
LANGUAGE: 'Chinese',
},
body: {
INRATIO: '',
OUTRATIO: '',
IS_CON_TEMP: '',
DESCRIPTION: '',
MATERIALSPECNAME: '',
SITENAME: 'SDK',
MATERIALSPECDESCRIPTION: '',
CHECKSTATE: '',
MATERIALSPECTYPE: '',
MAKEDATE: '',
MAKEUSER: '',
DESC_CN: '',
DESC_EN: '',
MATERIALTYPE: '',
MATERIALGROUP: '',
MATERIALGROUPDESCRIPTION: '',
MATERIALUNIT: '',
MATERIALWEIGHT: '',
ERPFACTORY: '',
ERPLOCATION: '',
MATERIALLIFEMARK: '',
EXPIRINGDATE: '',
STOCKDATE: '',
}
},
total: 0,
loading: false,
MaterialList: [] as any,
dialog: {
title: '新增用户',
visible: false
},
TEMPList: [{ label: '全部', value: '' },{ label: '是', value: '01' }, { label: '否', value: '02' }] as any,
formData: {
total: 0,
SUPPLIERNO: '',
SUPPLIERNAME: '',
NATIONALNO: '',
DESCRIPTION: '',
ADDRESS: '',
POSTCODE: '',
CITY: '',
TEL: '',
FAX: '',
INCHARGE: '',
EMAIL: '',
LASTEVENTTIME: '',
} as any,
column: [] as any,
selectItem: undefined as any,
currentTime: '',
allRole: [] as any
})
const materialTableConfig = ref({
loading: false,
column: [] as any,
data: [],
})
/***---------------------------------------------------------------------------
* -------------------------------------钩子函数区域------------------------------------------ */
onMounted(() => {
materialTableConfig.value.column = [
{ header: "物料编号", field: "MATERIALSPECNAME", hide: false },
{ header: "品名", field: "DESC_CN", hide: false },
{ header: "规格型号", field: "DESCRIPTION", hide: false },
{ header: "阶段", field: "PHASE", hide: false },
{ header: "主单位", field: "MATERIALUNIT", hide: false },
{ header: "主单位描述", field: "MATERIALUNITDESC", hide: false },
{ header: "物料类型", field: "MATERIALTYPE", hide: false },
{ header: "物料组", field: "MATERIALGROUP", hide: false },
{ header: "物料组描述", field: "MATERIALGROUPDESCRIPTION", hide: false },
{ header: "贮存条件", field: "IS_CON_TEMP", hide: false },
{ header: "熟化条件", field: "MATURATIONFLAG", hide: false },
{ header: "熟化天数", field: "MATURATIONTIME", hide: false },
{ header: "保质期", field: "EXPIRATIONDAY", hide: false },
{ header: "辅单位", field: "FUNIT", hide: false },
{ header: "换算率", field: "UNIT_RATES", hide: false },
{ header: "有效期规则", field: "REPLACED_VALUE", hide: false },
{ header: "是否启用批次", field: "IS_BATCH", hide: false },
{ header: "NC料号", field: "OLDMATERIALSPECNAME", hide: false },
{ header: "采购分类", field: "PURCHASETYPE", hide: false },
{ header: "销售分类", field: "FINANCIALTYPE", hide: false },
{ header: "最小装载量", field: "MINORDERQTY", hide: false },
{ header: "质检", field: "IQCFLAG", hide: false },
{ header: "检验周期", field: "INSPECTION_CYCLE", hide: false }
]
state.materialFactoryColumn = [
{ header: "组织", field: "ERPFACTORY", hide: false },
{ header: "组织名称", field: "ERPFACTORYDEC", hide: false },
{ header: "采购组", field: "PURCHASEGROUPCODE", hide: false },
{ header: "采购收货地", field: "MATERIALSPECNAME", hide: false },
{ header: "是否质检", field: "IQCFLAG", hide: false },
{ header: "保质期", field: "MHDHB", hide: false },
{ header: "检验周期", field: "MATERIALSPECNAME", hide: false },
{ header: "安全库存", field: "SAFESTOCKQTY", hide: false },
]
// 初始化时调用 handleQuery
handleQuery();
updateTableHeight();
window.addEventListener('resize', handleResize);
});
const queryInfo = () => {
state.queryParams.pageNum = 1
handleQuery()
}
const handleQuery = () => {
state.MaterialList = []
state.loadings = true;
state.disableds = true;
console.log(state.queryParams)
getQueryPageList(state.queryParams)
.then((res: any) => {
console.log(res.data);
if(res.data.list.length != 0){
state.MaterialList = res.data.list;
console.log(state.MaterialList)
state.total = res.data.total;
state.loadings = false;
state.disableds = false;
state.materialFactoryQueryParams.params.MATERIALSPECNAME = res.data.list[0].MATERIALSPECNAME
handleQueryMaterialFactory()
} else {
ElMessageBox.alert('查无此数据', '提醒框', {
confirmButtonText: 'OK',
})
state.loadings = false;
state.disableds = false;
}
})
.catch(() => { });
}
function handleQueryMaterialFactory(){
state.materialFactoryLoading = true
state.materialFactoryList = []
getQueryPageList(state.materialFactoryQueryParams).then((res: any) => {
state.materialFactoryLoading = false
state.materialFactoryList = res.data.list;
state.materialFactoryTotal = res.data.total;
});
}
const updateList = (col: any) => {
materialTableConfig.value.column = col
}
const buildInfo = () => { state.DBProcessType = 'Insert' }
const editInfo = () => { state.DBProcessType = 'Update' }
/* 功能:保存创建修改信息
参数ChangeParams
时间::2024-4-24
作者:李文虎
*/
const saveInfo = () => {
if (state.DBProcessType == 'Insert') {
state.ChangeParams.header.MESSAGENAME = 'CreateMaterialSpec'
} else if (state.DBProcessType == 'Update') {
state.ChangeParams.header.MESSAGENAME = 'ModifyMaterialSpec'
}
BpelEvent(state.ChangeParams).then((res: any) => {
})
.catch(() => { });
}
const exiteInfo = () => {
formDataRef.value.resetFields()
}
function selectRow(row: any) {
state.materialFactoryQueryParams.params.MATERIALSPECNAME = row.MATERIALSPECNAME
handleQueryMaterialFactory()
}
</script>
<style scoped>
el-table /deep/ el-table-comlun {
align: center !important; /* 这将影响所有单元格 */
}
</style>