Commit 3b5f532b authored by “lixuyan”'s avatar “lixuyan”

胶漆申领页面

parent b53051ef
<template>
<section class="lacclaims-footer">
<div class="lacclaims-footer-title">
<span class="title"> 胶漆材料记实</span>
<div class="right">
<el-popover
v-model="popoverVisible"
placement="left"
width="200"
trigger="manual"
>
<div>
<el-input
ref="scanCode"
v-model="scanId"
placeholder="请使用扫码枪录入"
@change="getQRcodeBar"
/>
</div>
<span
slot="reference"
class="qiang"
title="扫码枪录入"
@click="codeScanBar"
/>
</el-popover>
<scan class="qrcode" title="扫码录入" @getQrCode="getQRcode"> <span class="scan" /></scan>
</div>
</div>
<!-- 表格 -->
<div>
<div>
<el-table
ref="table"
v-loading="loading"
height="20vh"
:data="tableData"
border
size="mini"
>
<el-table-column
type="index"
:width="80"
label="序号"
align="center"
/>
<el-table-column
prop="allocateNo"
align="center"
label="胶漆料调配号"
:min-width="200"
show-overflow-tooltip
/>
<el-table-column
prop="allocateDate"
align="center"
label="调配时间"
:min-width="180"
/>
<el-table-column
prop="loseEfficacyDate"
align="center"
label="失效时间"
:min-width="180"
/>
<el-table-column
prop="useDate"
align="center"
label="记实时间"
:min-width="180"
/>
<el-table-column
prop="dxProcessMaterial.unit.unitCode"
align="center"
label="备注"
:min-width="240"
show-overflow-tooltip
/>
<el-table-column align="center" label="操作" :width="80">
<template slot-scope="scope">
<el-button
size="mini"
type="danger"
@click="handleClick(scope.row)"
>删除</el-button>
</template>
</el-table-column>
</el-table>
</div>
<el-pagination
:current-page="tablePagination.currentPage"
:page-sizes="tablePagination.pageSizes"
:page-size="tablePagination.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="tablePagination.total"
@size-change="setPage"
@current-change="setPage($event, true)"
/>
</div>
</section>
</template>
<script>
import { post } from '@/utils/http'
import '@/api/jq-signature'
import scan from '@/components/scanCode/scanCode'
export default {
components: {
scan
},
data() {
return {
// 加载中
loading: false,
// 分页
tablePagination: {
currentPage: 1,
pageSize: 5,
total: 0,
pageSizes: [5, 10, 20, 50]
},
// 表格数据
tableData: [],
tableId: null,
popoverVisible: false,
scanId: null
}
},
created() {},
mounted() {},
methods: {
// 初始化数据
getTableData(id) {
// 设置数据
this.loading = true
this.tableData = []
if (id) this.tableId = id
const params = {
pageFrom: this.tablePagination.currentPage,
pageSize: this.tablePagination.pageSize,
indices: ['ScanCodeRecord'],
searchItems: {
items: [
{
fieldName: 'keyID',
operator: 'EQ',
value: this.tableId
}
],
operator: 'AND'
}
}
// 发送请求
post('/ScanCodeRecord/listByKeyId', params)
.then((res) => {
this.tableData = res.items.content || []
this.tablePagination.total = res.items.totalElements
})
.catch((err) => console.log(err))
.finally(() => {
this.loading = false
})
},
/**
* 页码触发
*/
setPage($event, state) {
if (state) {
this.tablePagination.currentPage = $event
} else {
this.tablePagination.currentPage = 1
this.tablePagination.pageSize = $event
}
this.getTableData()
},
/**
* **扫描胶漆合格证二维码记实**
*/
getQRcode(info) {
// 发送请求
post(
'/ScanCodeRecord/scanCode',
{
allocateNo: info, // 记录卡号
keyID: this.tableId
}
)
.then((res) => {
if (res.message.includes('成功')) {
this.$parent.$parent.$parent.$refs.header.getTableData()
this.$message({
showClose: true,
message: '添加成功!',
type: 'success'
})
} else {
this.$message({
showClose: true,
message: '添加失败',
type: 'error'
})
}
})
.catch((err) => console.log(err))
.finally(() => {})
},
/**
* 删除
*/
handleClick(row) {
this.$confirm('你是否确定删除选中的数据项?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
// customClass: 'lacclaims-footer-message'
}).then(() => {
const params = {
id: row.id, // 记实id
operator: 'REMOVE'
}
// 发送请求
post('/ScanCodeRecord/recursion', params)
.then((res) => {
if (res.message.includes('成功')) {
this.$parent.$parent.$parent.$refs.header.getTableData()
this.$message({
type: 'success',
message: '删除成功!'
})
} else {
this.$message({
type: 'error',
message: '删除失败!'
})
}
})
.catch((err) => console.log(err))
.finally(() => {
this.loading = false
})
})
},
codeScanBar() {
this.popoverVisible = true
this.$nextTick(() => {
this.$refs.scanCode.focus()
})
},
/**
* 扫码枪录入
*/
getQRcodeBar($event) {
this.popoverVisible = false
this.getQRcode($event)
this.scanId = null
}
}
}
</script>
<style lang="scss">
.lacclaims-footer {
.lacclaims-footer-title {
display: flex;
justify-content: space-between;
margin-bottom: 10px;
align-items: center;
.title {
border-left: 6px solid #4099f7;
padding: 10px 0 10px 5px;
background-color: #e4e1e1;
// margin-bottom: 10px;
width: 300px;
}
main {
color: #1497f5;
cursor: pointer;
&:hover {
color: #85c5f3;
}
}
}
.el-table thead th {
color: #2e2e2e;
font-weight: 700;
font-size: 14px;
padding: 0;
background-color: #f3f6f7;
line-height: 46px !important;
}
.el-table .highlight {
border: 1px solid #1497f5;
padding: 0;
.cell {
padding: 0;
.el-select {
width: 100%;
}
input {
border: 0;
height: 35px;
background-color: transparent;
text-align: center;
padding-right: 0;
}
}
}
.el-table .cell i.el-icon-loading {
font-size: 16px;
color: #ff0c00;
font-weight: bold;
position: absolute;
right: 10px;
top: 10px;
}
.el-pagination {
text-align: right;
padding: 10px 0;
}
.el-loading-spinner {
width: 100%;
}
.el-message-box {
z-index: 9999999;
}
.right{
display: flex;
align-items: center;
.qiang {
background-repeat: no-repeat;
margin-top: 3px;
cursor: pointer;
background-size: 100% 100%;
display: inline-block;
width: 26px;
margin-right: 10px;
height: 26px;
background-image: url("../../../../icons/扫码枪.png");
}
.scan {
margin-top: 3px;
cursor: pointer;
background-repeat: no-repeat;
background-size: 100% 100%;
display: inline-block;
width: 26px;
height: 26px;
background-image: url("../../../../icons/saoma.png");
}
}
}
</style>
<template>
<section class="lacclaims-header">
<p class="lacclaims-header-title">
<span class="title">胶漆材料</span>
<span class="button">
<span>提示:双击可编辑时间</span>
<el-button
size="mini"
:disabled="
rowData.applyStatus && rowData.applyStatus !== 'notApplied' ||$parent.$parent.$parent.$refs.footer&& $parent.$parent.$parent.$refs.footer.tableData.length > 0
"
style="width: 100px"
@click="applyStorageReqItem"
>胶漆使用申请</el-button>
<el-button
size="mini"
:disabled="rowData.applyStatus !== 'applied'"
@click="cancelApplyStorageReqItem"
>撤销申请</el-button>
</span>
</p>
<!-- 表格 -->
<div>
<div>
<el-table
ref="table"
v-loading="loading"
height="20vh"
:data="tableData"
border
size="mini"
highlight-current-row
:cell-class-name="deeTableCellStyle"
@row-click="rowClick"
@cell-dblclick="deeTableEdit"
>
<el-table-column
type="index"
:width="80"
label="序号"
align="center"
/>
<el-table-column
prop="dxProcessMaterial.resCode"
align="center"
label="物料编码"
:width="120"
sortable
show-overflow-tooltip
/>
<el-table-column
prop="dxProcessMaterial.modelNo"
align="center"
label="牌号/规格/GPM号"
:width="200"
sortable
show-overflow-tooltip
/>
<el-table-column
prop="dxProcessMaterial.resName"
align="center"
label="材料名称"
:min-width="120"
sortable
show-overflow-tooltip
/>
<el-table-column
prop="dxProcessMaterial.resType2.typeName"
align="center"
label="类型"
:width="90"
sortable
/>
<el-table-column
prop="dxProcessMaterial.unit.unitCode"
align="center"
label="单位"
:width="90"
sortable
/>
<el-table-column
prop="reqAmount"
align="center"
label="数量"
:width="90"
sortable
/>
<el-table-column
prop="needTime"
align="center"
label="需求时间"
:width="180"
>
<template slot="header">
<span>需求时间 </span>
<i class="el-icon-edit-outline" />
</template>
<template slot-scope="scope">
<el-input
v-if="scope.row.needTimeSelect"
v-model="scope.row.needTime"
@focus="tableInputFocus"
@blur="deeTableBlur(scope.row, false)"
/>
<span v-else>{{ scope.row[scope.column.property] }}</span>
<i
v-if="scope.row.needTimeLoading"
class="el-icon-loading"
/> </template></el-table-column>
<el-table-column
prop="applyStatus"
align="center"
label="申领状态"
:width="120"
sortable
:formatter="applyStatusFormatter"
/>
<el-table-column
prop="cardNo"
align="center"
label="胶漆料调配号"
:min-width="200"
sortable
show-overflow-tooltip
/>
</el-table>
</div>
<el-pagination
:current-page="tablePagination.currentPage"
:page-sizes="tablePagination.pageSizes"
:page-size="tablePagination.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="tablePagination.total"
@size-change="setPage"
@current-change="setPage($event, true)"
/>
</div>
</section>
</template>
<script>
import { post } from '@/utils/http'
export default {
components: {},
data() {
return {
// 加载中
loading: false,
// 分页
tablePagination: {
currentPage: 1,
pageSize: 5,
total: 0,
pageSizes: [5, 10, 20, 50]
},
// 表格数据
tableData: [],
timer: null,
needTimeRow: null,
rowData: {},
defultRow: null
}
},
created() {},
mounted() {
// this.getTableData()
},
methods: {
// 初始化数据
getTableData() {
// 设置数据
this.loading = true
this.tableData = []
const params = {
pageFrom: this.tablePagination.currentPage,
pageSize: this.tablePagination.pageSize,
indices: ['StorageRequestItem'],
searchItems: {
items: [
{
fieldName: 'aoId',
operator: 'EQ',
value: this.$parent.$parent.$parent.$parent.headerData.aoId
}
],
operator: 'AND'
}
}
// 发送请求
post(
'/StorageRequestItem/getStorageReqItemByAoId',
params
)
.then((res) => {
this.tableData = res.items.content.map((p) => {
return {
...p,
needTimeLoading: false,
needTimeSelect: false
}
})
this.tablePagination.total = res.items.totalElements
this.tableData.length &&
this.$nextTick(() => {
if (!this.defultRow) {
this.defultRow = this.tableData[0]
this.$refs.table.setCurrentRow(this.defultRow)
}
this.rowClick(this.defultRow)
})
})
.catch((err) => console.log(err))
.finally(() => {
this.loading = false
})
},
deeTableCellStyle({ row, column, rowIndex, columnIndex }) {
if (column.property === 'needTime' && row.needTimeSelect) {
return 'highlight'
}
},
applyStatusFormatter(row, column, cellValue, index) {
var label = ''
switch (cellValue) {
case 'notApplied':
label = '未申请'
break
case 'applied':
label = '已申请'
break
case 'checking':
label = '审核中'
break
case 'deployed':
label = '已调配'
break
case ' invalid':
label = '已失效'
break
default:
label = ''
}
return label
},
rowClick(row) {
this.rowData = row
this.$parent.$parent.$parent.$refs.footer.getTableData(this.rowData.id)
},
/**
* 胶漆使用申请
*/
applyStorageReqItem(row) {
var that = this
post(
'/StorageRequestItem/applyStorageReqItem',
{
id: that.rowData.id // 问题id
}
)
.then((res) => {
if (res.message.includes('成功')) {
this.getTableData()
that.$message({
showClose: true,
message: '申请成功!',
type: 'success'
})
} else {
that.$message({
showClose: true,
message: '保存失败',
type: 'error'
})
}
})
.catch((err) => console.error(err))
.finally(() => {})
},
/**
* 撤销胶漆使用申请
*/
cancelApplyStorageReqItem() {
var that = this
post(
'/StorageRequestItem/cancelApplyStorageReqItem',
{
id: that.rowData.id // 问题id
}
)
.then((res) => {
if (res.message.includes('成功')) {
this.getTableData()
that.$message({
showClose: true,
message: '撤销申请成功!',
type: 'success'
})
} else {
that.$message({
showClose: true,
message: '保存失败',
type: 'error'
})
}
})
.catch((err) => console.error(err))
.finally(() => {})
},
deeTableBlur(row) {
var that = this
const param = {
id: row.id,
dxClassname: 'com.tf.mes.vo.storage.StorageRequestItemVo',
subTypeName: 'StorageRequestItemMatch',
operator: 'MODIFY',
needTime: row.needTime
}
row.needTimeSelect = false
row.needTimeLoading = true
if (this.needTimeRow === row.needTime) {
row.needTimeLoading = false
return
}
post('/StorageRequestItem/recursion', param)
.then((res) => {
if (res.message.includes('成功')) {
that.$message({
showClose: true,
message: '保存成功',
type: 'success'
})
} else {
that.$message({
showClose: true,
message: '保存失败',
type: 'error'
})
}
})
.catch((err) => console.error(err))
.finally(() => {
row.needTimeLoading = false
})
},
tableInputFocus() {
clearTimeout(this.timer)
this.timer = null
},
deeTableEdit(row, column, cell, event) {
var that = this
if (column.property === 'needTime') {
row.needTimeSelect = true
this.needTimeRow = row.needTime
} else {
return
}
this.timer = setTimeout(function() {
if (column.property === 'needTime') {
row.needTimeSelect = false
}
clearTimeout(this.timer)
that.timer = null
}, 2000)
},
/**
* 页码触发
*/
setPage($event, state) {
if (state) {
this.tablePagination.currentPage = $event
} else {
this.tablePagination.currentPage = 1
this.tablePagination.pageSize = $event
}
this.getTableData()
}
}
}
</script>
<style lang="scss">
.lacclaims-header {
.lacclaims-header-title {
display: flex;
justify-content: space-between;
margin-bottom: 10px;
.title {
border-left: 6px solid #4099f7;
padding: 10px 0 10px 5px;
background-color: #e4e1e1;
// margin-bottom: 10px;
width: 300px;
}
>.button{
margin-top: 5px;
>span{
margin-right: 15px;
color:red;
font-size: 12px;
}
}
}
.el-table thead th {
color: #2e2e2e;
font-weight: 700;
font-size: 14px;
padding: 0;
background-color: #f3f6f7;
line-height: 46px !important;
}
.el-table .highlight {
border: 1px solid #1497f5;
padding: 0;
.cell {
padding: 0;
.el-select {
width: 100%;
}
input {
border: 0;
height: 35px;
background-color: transparent;
text-align: center;
padding-right: 0;
}
}
}
.el-table .cell i.el-icon-loading {
font-size: 16px;
color: #ff0c00;
font-weight: bold;
position: absolute;
right: 10px;
top: 10px;
}
.el-pagination {
text-align: right;
padding: 10px 0;
}
.el-loading-spinner {
width: 100%;
}
}
</style>
<template>
<dee-dialog
id="dee-dialog"
title="胶漆申领"
custom-class="mobile-dialog"
:dialog-visible.sync="visible"
width="90%"
:before-close="handleClose"
close-on-click-modal
>
<Header ref="header" />
<Footer ref="footer" />
</dee-dialog>
</template>
<script>
import Header from './header'
import Footer from './footer'
export default {
components: {
Header,
Footer
},
data() {
return {
visible: false
}
},
created() { },
methods: {
// 打开弹出框
open() {
this.visible = true
this.$nextTick(() => {
this.$refs.header.getTableData()
})
},
handleClose() {}
}
}
</script>
<style lang="scss">
</style>
......@@ -511,7 +511,7 @@
<!-- 物料确认 -->
<ConfirmMaterial ref="ConfirmMaterial" />
<!--胶漆申领 -->
<!-- <LacClaims ref="LacClaims" /> -->
<LacClaims ref="LacClaims" />
<!-- 技术要求 -->
<TechnicalRequirements ref="TechnicalRequirements" />
<!-- 装配流程 -->
......@@ -536,7 +536,7 @@ import '@/icons/app/iconfont'
import { post, get } from '@/utils/http'
// import Table from './components/table'
import ConfirmMaterial from './components/ConfirmMaterial/index'
// import LacClaims from './components/LacClaims/index'
import LacClaims from './components/LacClaims/index'
import TechnicalRequirements from './components/TechnicalRequirements/index'
import AssemblyProcess from './components/AssemblyProcess/index'
import InspectionRejected from './components/chatBox/index'
......@@ -554,7 +554,8 @@ export default {
AssemblyProcess,
RecordMaintenance,
ConfirmMaterial,
ProblemDeclare
ProblemDeclare,
LacClaims
},
data() {
return {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment