You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

565 lines
17 KiB

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<!-- <el-dialog title="收货地址" :visible.sync="dialogFormVisible">-->
<el-container>
<el-header style="width: 100%; height: 80px;font-size: 12px">
<el-form :inline="true" label-width="65px" label-position="left">
<el-row>
<el-col :span="22">
<el-form-item label="船号:">
<vxe-pulldown ref="xDown4" transfer >
<template #default>
<vxe-input
v-model="queryParam.dcch"
placeholder="船号"
style="height: 28px;
line-height: 28px; width: 150px;"
suffix-icon="vxe-icon--search"
@keyup="keyupEvent4"
@focus="focusEvent4"
/>
</template>
<template #dropdown>
<div class="my-dropdown mytable " style="width: 250px">
<vxe-grid
highlight-hover-row
height="auto"
:data="projectData"
:columns="projectColumns"
@cell-click="cellClickEvent"
show-overflow
>
<template #wgbsEdit="{ row}">
<vxe-checkbox v-model="row.wgbs" checked-value="Y" unchecked-value="N" disabled ></vxe-checkbox>
</template>
</vxe-grid>
</div>
</template>
</vxe-pulldown>
</el-form-item>
<el-form-item label="批量:">
<el-input v-model="queryParam.dcpl" type="search" placeholder="批量" ></el-input>
</el-form-item>
</el-col>
<el-col :span="2">
<el-form-item style="float: right" >
<el-button type="success" @click="initList">查询</el-button>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="10" :offset="14">
<!-- <el-form-item style="float: right" >-->
<!-- <el-button-->
<!-- type="success"-->
<!-- @click="toolbarButtonClickEvent('save')"-->
<!-- >保存</el-button>-->
<!-- <div style="float: right;margin-left: 5px" >-->
<!-- <el-upload-->
<!-- :action="uploadAction"-->
<!-- :show-file-list="false"-->
<!-- :before-upload="beforeAvatarUpload"-->
<!-- :data="uploadData"-->
<!-- :on-success="handleAvatarSuccess"-->
<!-- :disabled="filedis"-->
<!-- :headers="heads"-->
<!-- >-->
<!-- <el-button type="success" @click="uploadExcel" > 批量表导入 </el-button>-->
<!-- </el-upload>-->
<!-- </div>-->
<!--&lt;!&ndash; <el-button&ndash;&gt;-->
<!--&lt;!&ndash; type="danger"&ndash;&gt;-->
<!--&lt;!&ndash; @click="toolbarButtonClickEvent('delete')"&ndash;&gt;-->
<!--&lt;!&ndash; >删除&ndash;&gt;-->
<!--&lt;!&ndash; </el-button>&ndash;&gt;-->
<!-- </el-form-item>-->
</el-col>
</el-row>
</el-form>
</el-header>
<el-container style="padding-top: 0px">
<el-container>
<el-main>
<div class="mytable">
<vxe-grid
id="id"
ref="xGrid"
border
resizable
keep-source
:align="'center'"
:height="height"
:auto-resize="true"
:columns="tableColumn"
highlight-current-row
:data="list"
:custom-config="{ storage: true }"
:scroll-y="{enabled: true}"
highlight-hover-row
show-overflow
show-header-overflow
:footer-method="footerMethod"
:footer-cell-style="{'text-align':'center','color':'red'}"
show-footer
:span-method="mergeRowMethod"
>
</vxe-grid>
</div>
</el-main>
</el-container>
</el-container>
</el-container>
</template>
<script>
import {
getCzplBase ,
wgetCzplBase,
czPlupdate,
getTLTList,
} from '@/api/sjzx/jcsj'
import { mapGetters } from 'vuex'
import XEUtils from 'xe-utils'
import {getSumAdd, getSumAddDicByName1, null2str} from "@/utils/rpkj";
import { getToken } from '@/utils/auth'
import { startLoading, endLoading } from '@/utils'
import { Message } from 'element-ui'
export default {
name:'BctltCX',
data() {
return {
queryParam: {
dcch:'',
dcpl:'',
hxfl:'B'
},
list: [],
isupload:'02',
filedis:true,
uploadData:{
},
heads: { token: getToken() },
uploadAction: process.env.VUE_APP_BASE_API + '/dmCzplpNew/uploadPl',
dictData:{},
height: '500px',
projectData:[],
projectData1:[],
projectColumns: [
{field: 'cbbm', title: '船号',width: 110},
{ field: 'wgbs', title: '完工标识', width: 80,
slots:{
default: 'wgbsEdit'
},
},
],
tableColumn: [
{ type: 'seq', width: 60, title: '序号' },
{ field: 'dcChZ', title: '船号', width: 100,
filters: [{ data: { checks: [], sVal: '', sMenu: '', fType1: '', fVal1: '', fMode: 'and', fType2: '', fVal2: '' } }],
filterRender: { name: 'FilterCombination', },
},
{ field: 'dcPlZ', title: '批量', width: 100,
filters: [{ data: { checks: [], sVal: '', sMenu: '', fType1: '', fVal1: '', fMode: 'and', fType2: '', fVal2: '' } }],
filterRender: { name: 'FilterCombination', },
},
{ field: 'dcZlZ', title: '组立', width: 100,formatter: ['dictFormat','ZLLB'],
filters: [{ data: { checks: [], sVal: '', sMenu: '', fType1: '', fVal1: '', fMode: 'and', fType2: '', fVal2: '' } }],
filterRender: { name: 'FilterCombination', },
},
{ field: 'ylzd1Z', title: '划线类型', width: 100,formatter: ['dictFormat','HXLX'],
filters: [{ data: { checks: [], sVal: '', sMenu: '', fType1: '', fVal1: '', fMode: 'and', fType2: '', fVal2: '' } }],
filterRender: { name: 'FilterCombination', },
},
{ field: 'wpggZ', title: '规格', width: 100,
filters: [{ data: { checks: [], sVal: '', sMenu: '', fType1: '', fVal1: '', fMode: 'and', fType2: '', fVal2: '' } }],
filterRender: { name: 'FilterCombination', },
},
{ field: 'wpxhZ', title: '材质', width: 100,
filters: [{ data: { checks: [], sVal: '', sMenu: '', fType1: '', fVal1: '', fMode: 'and', fType2: '', fVal2: '' } }],
filterRender: { name: 'FilterCombination', },
},
{ field: 'hxcdZ', title: '划线长度', width: 100,
filters: [{ data: { checks: [], sVal: '', sMenu: '', fType1: '', fVal1: '', fMode: 'and', fType2: '', fVal2: '' } }],
filterRender: { name: 'FilterCombination', },
},
{ field: 'ylzd4Z', title: '切割长度', width: 100,
filters: [{ data: { checks: [], sVal: '', sMenu: '', fType1: '', fVal1: '', fMode: 'and', fType2: '', fVal2: '' } }],
filterRender: { name: 'FilterCombination', },
},
{ field: 'tzbhZ', title: '图纸编号', width: 100,
filters: [{ data: { checks: [], sVal: '', sMenu: '', fType1: '', fVal1: '', fMode: 'and', fType2: '', fVal2: '' } }],
filterRender: { name: 'FilterCombination', },
},
{ field: 'ljslZ', title: '零件数量', width: 100,
filters: [{ data: { checks: [], sVal: '', sMenu: '', fType1: '', fVal1: '', fMode: 'and', fType2: '', fVal2: '' } }],
filterRender: { name: 'FilterCombination', },
},
{ field: 'wph', title: '零件编号', width: 100,
filters: [{ data: { checks: [], sVal: '', sMenu: '', fType1: '', fVal1: '', fMode: 'and', fType2: '', fVal2: '' } }],
filterRender: { name: 'FilterCombination', },
},
{ field: 'zdrZ', title: '编制人', width: 100,
filters: [{ data: { checks: [], sVal: '', sMenu: '', fType1: '', fVal1: '', fMode: 'and', fType2: '', fVal2: '' } }],
filterRender: { name: 'FilterCombination', },
},
{ field: 'zdrqZ', title: '编制日期', width: 100,
filters: [{ data: { checks: [], sVal: '', sMenu: '', fType1: '', fVal1: '', fMode: 'and', fType2: '', fVal2: '' } }],
filterRender: { name: 'FilterCombination', },
},
],
footerData1: [
['合计', '2', '44', '67', '-']
]
}
},
computed: {
...mapGetters(['name', 'bmbm'])
},
created() {
window.addEventListener('resize', this.getHeight)
this.getHeight()
this.initBase()
},
methods: {
mergeRowMethod ({ row, $rowIndex, column, data }) {
const fields = [ 'dcChZ','dcPlZ','dcZlZ','ylzd1Z','wpggZ','','hxcdZ','ylzd4Z','tzbhZ','ljslZ'
]
let tempcol=column.property
let cellValue = row[tempcol]
if (cellValue && fields.includes(column.property)) {
let prevRow = data[$rowIndex - 1]
let nextRow = data[$rowIndex + 1]
if (prevRow && prevRow[tempcol] === cellValue) {
return {rowspan: 0, colspan: 0}
} else {
let countRowspan = 1
while (nextRow && nextRow[tempcol] === cellValue) {
nextRow = data[++countRowspan + $rowIndex]
}
if (countRowspan > 1) {
return {rowspan: countRowspan, colspan: 1}
}
}
}
},
cellClickEvent({row}) {
this.queryParam.dcch = row.cbbm
this.$refs.xDown4.hidePanel()
},
focusEvent4() {
this.$refs.xDown4.showPanel()
},
keyupEvent4() {
if (this.queryParam.dcch) {
this.projectData = this.projectData1.filter(row => row.cbbm.indexOf(this.queryParam.dcch.toUpperCase()) > -1)
} else {
this.projectData = this.projectData1.slice(0)
}
},
uploadExcel() {
if (this.queryParam.cbbm === '') {
this.$message.error('请选择船号!')
return false;
} else {
}
// this.uploadData.czbh = this.queryParam.czbh
this.uploadData.isupload = this.isupload
},
czbhChange(){
if (this.queryParam.cbbm === '') {
this.filedis=true
}else{
this.filedis=false
}
},
beforeAvatarUpload(file) {
// 文件类型
const isType = file.type === 'application/vnd.ms-excel'
const isTypeComputer = file.type === 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
const fileType = isType || isTypeComputer
// if (!fileType) {
// this.$message.error('上传文件只能是xls/xlsx格式')
// return
// }
startLoading()
return fileType
},
handleAvatarSuccess(res, file) {
endLoading()
if (res.success) {
// if(res.data.zt==='01'){
// this.$confirm('该模板已导入数据,是否重新导入并覆盖模板数据?', '提示', {
// confirmButtonText: '确定',
// cancelButtonText: '取消',
// distinguishCancelAndClose: true,
// type: 'warning'
// }).then(type => {
// upload({ file: file.raw, czbh: this.queryParam.czbh, isupload: '02' }).then(res => {
// if (res.success) {
// this.$message({ message: '导入成功', type: 'success' })
// this.loadData()
// }
// })
// })
// }else{
// this.$message({ message: '导入成功', type: 'success' })
// this.loadData()
// }
this.$message({ message: '导入成功', type: 'success' })
this.initList();
} else {
Message({
message: res.message || 'Error',
type: 'error',
duration: 5 * 1000
})
}
},
footerMethod ({ columns, data }) {
return [
columns.map((column, columnIndex) => {
if (['hxcdZ','ylzd4Z','ljslZ'].includes(column.property)) {
console.log(1)
return getSumAddDicByName1(data, column.property,'tzbhZ')
}
if (columnIndex === 1) {
return '合计'
}
return null
})
]
},
initBase(){
getCzplBase({}).then(res=>{
this.dictData = res.data
this.projectData=res.data.cbbm
this.projectData1=res.data.cbbm
// const xGrid = this.$refs.xGrid
//
// const dwbm = xGrid.getColumnByField('dwbm')
// dwbm.editRender.options = res.data.xqdws
})
},
initList() {
// if (this.queryParam.dcch === '') {
// this.$message.warning('选择船只编号')
// return
// }
getTLTList(this.queryParam).then((res) => {
this.list = res.data
if (this.$refs.xGrid) {
this.$refs.xGrid.loadData(this.list)
console.log(this.list)
}
})
},
formatDate ({ cellValue }) {
return XEUtils.toDateString(cellValue, 'yyyy/MM/dd')
},
checkBoxClick(row,column){
// console.log(row)
this.$refs.xGrid.setActiveCell(row,column)
},
selectChange(row) {
// this.$refs.xGrid.clearActived() // 清除单元格激活状态
this.$refs.xGrid.clearEdit() // 清除单元格激活状态
// this.$refs.xGrid.setEditCell(row.row, row.column.property) // 设置单元格为激活状态
null2str(row.row)
},
getHeight() {
this.height = window.innerHeight - 190
},
toolbarButtonClickEvent(code) {
const {
insertRecords,
removeRecords,
updateRecords
} = this.$refs.xGrid.getRecordset()
switch (code) {
case 'insert':
this.$refs.xGrid.insertAt({
}, -1).then(({ row }) => {
this.$refs.xGrid.setActiveRow(row)
})
break
case 'delete':
this.$confirm('删除, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then((type) => {
this.$refs.xGrid.removeCheckboxRow()
})
break
case 'save':
if (removeRecords.length !== 0) {
del(removeRecords).then((response) => {
if (response.success) {
for (let i = 0; i < this.list.length; i++) {
if (removeRecords.indexOf(this.list[i]) !== -1) {
this.list.splice(i, 1)
i--
}
}
this.$message({ message: '保存成功!', type: 'success' })
const xTable = this.$refs.xGrid
xTable.loadData(this.initList())
}
})
}
if (updateRecords.length !== 0) {
czPlupdate(updateRecords).then((response) => {
if (response.success) {
const xTable = this.$refs.xGrid
xTable.loadData(this.initList())
this.$message({message: '保存成功!', type: 'success'})
}
})
}
if (insertRecords.length !== 0) {
add(insertRecords).then((response) => {
if (response.success) {
this.list = this.list.concat(insertRecords)
const xTable = this.$refs.xGrid
xTable.loadData(this.initList())
this.$message({ message: '保存成功!', type: 'success' })
}
})
}
this.$message(
`新增 ${insertRecords.length} 条,删除 ${removeRecords.length} 条,更新 ${updateRecords.length}`
)
break
}
}
}
}
</script>
<style lang="scss" scoped >
.el-header{margin:0;padding: 5px;height:auto;
.el-input{
width: 140px;
}
.el-select{
width: 140px;
}
}
.el-container{padding: 0;margin:0;}
.el-main{padding: 0;}
.el-col{padding: 0;height: 32px;}
.el-aside{background: #fff;padding: 0}
.el-container{padding: 0}
.el-row {}
.el-row:last-child {margin-bottom: 0; }
.tableStyles{
background: #0a76a4;
}
.my-dropdown {
width: 400px;
height: 400px;
background-color: #fff;
border: 1px solid #dcdfe6;
box-shadow: 0 0 6px 2px rgba(0, 0, 0, 0.1);
font-size: 12px;
}
.mytable1{
}
.borderClass{
}
.vxe-input {
display: inline-block !important;
position: relative !important;
width: auto;
}
.el-input {
display: inline-block !important;
position: relative !important;
width: auto;
}
.keyword-lighten {
color: #000;
background-color: #FFFF00;
}
.vxe-textarea--inner {
line-height: inherit;
}
.el-form-item__label-wrap {
margin-left: 0px !important;
float: left;
}
.fontClass{
font-size: 12px;
font-weight: bold;
}
</style>