zhgdyun/src/views/projectFront/materialManage/materialEntryManage.vue
2024-05-17 20:13:58 +08:00

339 lines
9.9 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.

<template>
<!-- 进度预警 -->
<div class="fullHeight">
<div class="searchBox whiteBlock">
<el-form
:inline="true"
size="medium"
:model="queryInfo"
class="demo-form-inline"
>
<el-form-item :label="$t('message.laborMange.companies')">
<el-select
ref="selectRef"
v-model="selectVal"
placeholder="请选择"
clearable
@change="selectChange"
>
<el-option style="height:auto" :value="[]">
<el-tree
:data="treeList"
node-key="enterpriseId"
ref="groupTree"
:default-expanded-keys="defaultExpandArr"
:props="defaultProps"
:default-expand-all="false"
@node-click="treeClick"
>
</el-tree>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="批次" prop="materialName">
<el-input
v-model="queryInfo.materialName"
placeholder="请输入"
clearable
></el-input>
</el-form-item>
<el-form-item label="材料入场有效时间" prop="materialName">
<el-date-picker
size="medium"
v-model="queryInfo.timeRange"
type="daterange"
range-separator="至"
value-format="yyyy-MM-dd"
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker>
</el-form-item>
<el-form-item>
<el-button type="primary" plain @click="getWarningListData"
>查询</el-button
>
<el-button type="warning" plain @click="refresh">刷新</el-button>
</el-form-item>
</el-form>
</div>
<div class="table_wrap whiteBlock">
<vue-scroll>
<el-table class="tables" :data="tableList">
<el-table-column
type="index"
:label="$t('message.projectManage.serialNumber')"
align="center"
width="50"
>
</el-table-column>
<el-table-column
prop="enterpriseName"
align="center"
label="企业"
></el-table-column>
<el-table-column
prop="name"
align="center"
label="批次"
></el-table-column>
<el-table-column
prop="entryTime"
align="center"
label="入场有效时间"
>
<template slot-scope="scope">
开始{{scope.row.entryTime}} <br/>
结束{{scope.row.entryTime}}
</template>
</el-table-column>
<el-table-column align="center" label="操作" width="280">
<template slot-scope="scope">
<div
@click="showDetail(scope.row)"
class="operationText"
v-if="![2, 3].includes(scope.row.auditType)"
>
<img
src="@/assets/images/tableIcon/showReply.png"
width="15px"
height="15px"
/>
<span style="white-space: nowrap;color: #5678E8;"
>查看明细</span
>
</div>
</template>
</el-table-column>
</el-table>
</vue-scroll>
</div>
<el-pagination
class="pagerBox"
style="position: absolute; top: 85%; left: 40%"
@size-change="SizeChange"
@current-change="CurrentChange"
:current-page="pagInfo.pageNo"
:page-sizes="$store.state.PAGESIZRS"
:page-size="pagInfo.pageSize"
layout="total, sizes, prev, pager, next"
:total="Number(pagInfo.total)"
background
></el-pagination>
<!-- 更新总进度 -->
<el-dialog
:modal-append-to-body="false"
title="查看明细"
:visible.sync="dialogVisible"
width="1000px"
>
<div class="dialog_content">
<div class="update-record">
<el-table
:data="dialogTableData"
height="500"
style="width: 100%;">
<el-table-column
type="index"
width="50"
prop="updateDate"
align="center"
label="序号">
</el-table-column>
<el-table-column
prop="name"
align="center"
label="材料名称">
</el-table-column>
<el-table-column
prop="model"
align="center"
label="型号">
</el-table-column>
<el-table-column
prop="specifications"
align="center"
label="规格">
</el-table-column>
<el-table-column
prop="unit"
align="center"
label="单位">
</el-table-column>
<el-table-column
prop="num"
align="center"
label="数量">
</el-table-column>
<el-table-column
prop="remark"
align="center"
label="备注">
</el-table-column>
<el-table-column
width="300"
prop="imageUrl"
align="center"
label="图片">
<template slot-scope="scope">
<span class="value" v-if="scope.row.imageUrl && JSON.parse(scope.row.imageUrl).length > 0"
style="display: flex;justify-content:center;word-wrap: break-word;white-space: normal; flex-wrap: wrap">
<div v-for="(item,index) in JSON.parse(scope.row.imageUrl)" :key="index" style="">
<img :preview="item ? $store.state.FILEURL + item.url : ''"
:src="item ? $store.state.FILEURL + item.url : ''" alt="" width="50px" height="50px" style="margin-right: 10px;"/>
</div>
</span>
</template>
</el-table-column>
</el-table>
</div>
</div>
</el-dialog>
</div>
</template>
<script>
import {
materialEntryRecordPageApi,
materialRecordDetailListApi
} from "@/assets/js/api/materialManage";
import { selectHierarchyEnterpriseListApi } from "@/assets/js/api/laborPerson";
export default {
mounted() {},
data() {
return {
selectTreeData: {},
defaultExpandArr: [],
// 对应的字段
defaultProps: {
children: "children",
label: "enterpriseName",
},
treeList: [],
selectVal: "",
dialogVisible: false,
dialogTableData: [],
projectSn: "",
tableList: [],
queryInfo: {
enterpriseId: "",
materialName: "",
timeRange: [],
id:''
},
pagInfo: {
pageNo: 1, //页数
pageSize: 10, //条数
total: 0, //总条数
},
rowObj: {}
};
},
created() {
this.projectSn = this.$store.state.projectSn;
this.getWarningListData();
this.getTreeList();
},
methods: {
selectChange(val) {
console.log(val, 123);
if (!val) {
this.selectVal = "";
this.selectTreeData = {};
this.queryInfo.id = "";
}
},
// 树形控件点击
treeClick(data) {
console.log(data);
if (data.status == 1) {
this.$message.warning("无法选中已禁用组织");
} else {
this.selectVal = data.enterpriseName;
this.queryInfo.id = data.id
this.selectTreeData = data;
this.queryInfo.id = data.enterpriseId;
this.$refs.selectRef.blur();
}
},
getTreeList() {
selectHierarchyEnterpriseListApi({
projectSn: this.$store.state.projectSn,
}).then((result) => {
if (result.success) {
this.treeList = result.result;
}
});
},
//获取明细列表数据
getDetailListData() {
let data = {
materialId: this.rowObj.id
};
materialRecordDetailListApi(data).then((res) => {
console.log("返回的值", res);
if (res.code == 200) {
this.dialogTableData = res.result;
this.dialogTableData.map(item => {
// item.imageUrl = JSON.parse(item.imageUrl)
})
}
});
},
showDetail(row) {
this.rowObj = row;
this.dialogVisible = true;
this.$nextTick(() => {
this.getDetailListData();
})
console.log(row, 666);
},
//获取列表数据
getWarningListData() {
let data = {
projectSn: this.projectSn,
pageNo: this.pagInfo.pageNo,
pageSize: this.pagInfo.pageSize,
name: this.queryInfo.materialName,
enterpriseId: this.queryInfo.id,
type: 1
};
if(this.queryInfo.timeRange && this.queryInfo.timeRange.length > 0){
data.entryTime_begin = this.queryInfo.timeRange[0];
data.entryTime_end = this.queryInfo.timeRange[1];
}
materialEntryRecordPageApi(data).then((res) => {
console.log("返回的值", res);
if (res.code == 200) {
this.tableList = res.result.records;
console.log(this.tableList, 777888);
this.pagInfo.total = res.result.total;
}
});
},
//刷新按钮
refresh() {
this.queryInfo = {};
this.selectVal = "";
this.pagInfo.pageNo = 1; //页数
this.pagInfo.pageSize = 10; //条数
this.getWarningListData();
},
SizeChange(val) {
this.pagInfo.pageSize = val;
this.getWarningListData();
},
CurrentChange(val) {
this.pagInfo.pageNo = val;
this.getWarningListData();
},
},
};
</script>
<style lang="less" scoped>
// 下拉框样式修改
/deep/.el-select-dropdown__item.hover,.el-select-dropdown__item.hover, .el-select-dropdown__item:hover{
background-color: transparent;
}
</style>