|
|
|
@ -0,0 +1,174 @@
|
|
|
|
|
<template>
|
|
|
|
|
<div class="mytable">
|
|
|
|
|
<el-button size="small" type="primary" @click="getList" >查询</el-button>
|
|
|
|
|
<el-button size="small" type="success" @click="add" >新增</el-button>
|
|
|
|
|
<el-button size="small" type="danger" @click="remove" >删除</el-button>
|
|
|
|
|
<el-button size="small" type="success" @click="saveGxcd" >保存</el-button>
|
|
|
|
|
<vxe-grid
|
|
|
|
|
id="dhId"
|
|
|
|
|
ref="xGridDh"
|
|
|
|
|
border
|
|
|
|
|
resizable
|
|
|
|
|
keep-source
|
|
|
|
|
:align="'center'"
|
|
|
|
|
:height="height"
|
|
|
|
|
:auto-resize="true"
|
|
|
|
|
:columns="dhjhTableColumn"
|
|
|
|
|
:data="dhjhList"
|
|
|
|
|
:custom-config="{storage: true }"
|
|
|
|
|
:edit-config="{
|
|
|
|
|
trigger: 'click',
|
|
|
|
|
mode: 'row',
|
|
|
|
|
showStatus: true,
|
|
|
|
|
}"
|
|
|
|
|
:scroll-x="{enabled: true}"
|
|
|
|
|
:scroll-y="{enabled: true}"
|
|
|
|
|
:span-method="rowspanMethod"
|
|
|
|
|
highlight-current-row
|
|
|
|
|
highlight-hover-row
|
|
|
|
|
show-overflow
|
|
|
|
|
show-header-overflow
|
|
|
|
|
>
|
|
|
|
|
<template #month_edit="{ row }">
|
|
|
|
|
<vxe-input
|
|
|
|
|
v-model="row.month"
|
|
|
|
|
type="month"
|
|
|
|
|
value-format="yyyy/MM"
|
|
|
|
|
placeholder=""
|
|
|
|
|
transfer
|
|
|
|
|
></vxe-input>
|
|
|
|
|
</template>
|
|
|
|
|
<template #allArriveData_edit="{ row }">
|
|
|
|
|
<vxe-input
|
|
|
|
|
v-model="row.allArriveData"
|
|
|
|
|
type="date"
|
|
|
|
|
value-format="yyyy/MM/dd"
|
|
|
|
|
placeholder=""
|
|
|
|
|
transfer
|
|
|
|
|
></vxe-input>
|
|
|
|
|
</template>
|
|
|
|
|
</vxe-grid>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
import {getDhjhAll, saveDhjh, removeDhjh} from '@/api/jhzx/pc'
|
|
|
|
|
export default {
|
|
|
|
|
name:'GxCD',
|
|
|
|
|
props:{
|
|
|
|
|
height:{
|
|
|
|
|
type:Number,
|
|
|
|
|
default:700,
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
data(){
|
|
|
|
|
return {
|
|
|
|
|
dhjhList:[],
|
|
|
|
|
dhjhTableColumn:[
|
|
|
|
|
{ type: 'checkbox', width: 50 },
|
|
|
|
|
{ field: 'month', title: '月份', width: 150,
|
|
|
|
|
editRender: { name: "input" },
|
|
|
|
|
slots: { edit: "month_edit" },
|
|
|
|
|
filters: [{ data: { checks: [], sVal: '', sMenu: '', fType1: '', fVal1: '', fMode: 'and', fType2: '', fVal2: '' } }],
|
|
|
|
|
filterRender: { name: 'FilterCombination', },
|
|
|
|
|
},
|
|
|
|
|
{ field: 'index', title: '序号', width: 150,
|
|
|
|
|
editRender: { name: "input" },
|
|
|
|
|
filters: [{ data: { checks: [], sVal: '', sMenu: '', fType1: '', fVal1: '', fMode: 'and', fType2: '', fVal2: '' } }],
|
|
|
|
|
filterRender: { name: 'FilterCombination', },
|
|
|
|
|
},
|
|
|
|
|
{ field: 'dcch', title: '船只', width: 150,
|
|
|
|
|
editRender: { name: "input" },
|
|
|
|
|
filters: [{ data: { checks: [], sVal: '', sMenu: '', fType1: '', fVal1: '', fMode: 'and', fType2: '', fVal2: '' } }],
|
|
|
|
|
filterRender: { name: 'FilterCombination', },
|
|
|
|
|
},
|
|
|
|
|
{ field: 'pls', title: '批量范围', width: 150,
|
|
|
|
|
editRender: { name: "input" },
|
|
|
|
|
filters: [{ data: { checks: [], sVal: '', sMenu: '', fType1: '', fVal1: '', fMode: 'and', fType2: '', fVal2: '' } }],
|
|
|
|
|
filterRender: { name: 'FilterCombination', },
|
|
|
|
|
},
|
|
|
|
|
{ field: 'tonnage', title: '吨位', width: 150,
|
|
|
|
|
editRender: { name: "input" },
|
|
|
|
|
filters: [{ data: { checks: [], sVal: '', sMenu: '', fType1: '', fVal1: '', fMode: 'and', fType2: '', fVal2: '' } }],
|
|
|
|
|
filterRender: { name: 'FilterCombination', },
|
|
|
|
|
},
|
|
|
|
|
{ field: 'sumWeight', title: '累计重量', width: 150,
|
|
|
|
|
editRender: { name: "input" },
|
|
|
|
|
filters: [{ data: { checks: [], sVal: '', sMenu: '', fType1: '', fVal1: '', fMode: 'and', fType2: '', fVal2: '' } }],
|
|
|
|
|
filterRender: { name: 'FilterCombination', },
|
|
|
|
|
},
|
|
|
|
|
{ field: 'allArriveData', title: '到齐日期', width: 150,
|
|
|
|
|
editRender: { name: "input" },
|
|
|
|
|
slots: { edit: "allArriveData_edit" },
|
|
|
|
|
filters: [{ data: { checks: [], sVal: '', sMenu: '', fType1: '', fVal1: '', fMode: 'and', fType2: '', fVal2: '' } }],
|
|
|
|
|
filterRender: { name: 'FilterCombination', },
|
|
|
|
|
},
|
|
|
|
|
{ field: 'remarks', title: '备注', width: 150,
|
|
|
|
|
editRender: { name: "input" },
|
|
|
|
|
filters: [{ data: { checks: [], sVal: '', sMenu: '', fType1: '', fVal1: '', fMode: 'and', fType2: '', fVal2: '' } }],
|
|
|
|
|
filterRender: { name: 'FilterCombination', },
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
created() {
|
|
|
|
|
this.getList()
|
|
|
|
|
},
|
|
|
|
|
methods:{
|
|
|
|
|
getList(){
|
|
|
|
|
getDhjhAll().then((res) => {
|
|
|
|
|
this.dhjhList = res.data
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
add(){
|
|
|
|
|
this.$refs.xGridDh.insertAt({},-1)
|
|
|
|
|
},
|
|
|
|
|
remove(){
|
|
|
|
|
this.$refs.xGridDh.removeCheckboxRow()
|
|
|
|
|
},
|
|
|
|
|
async saveGxcd(){
|
|
|
|
|
const {insertRecords, removeRecords, updateRecords} = this.$refs.xGridDh.getRecordset()
|
|
|
|
|
if (insertRecords.length !== 0 ) {
|
|
|
|
|
await saveDhjh(insertRecords).then(res => {
|
|
|
|
|
this.getList()
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
if (updateRecords.length !== 0) {
|
|
|
|
|
await saveDhjh(updateRecords).then(res => {
|
|
|
|
|
this.getList()
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
if (removeRecords.length !== 0) {
|
|
|
|
|
await removeDhjh(removeRecords).then(res => {
|
|
|
|
|
this.getList()
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
//合并行
|
|
|
|
|
rowspanMethod({row, _rowIndex, column, visibleData}) {
|
|
|
|
|
//不要忘记在vxe-grid上配置 :scroll-y="{enabled: false}" 防止下拉时样式变化
|
|
|
|
|
// 需要合并的列字段
|
|
|
|
|
let fields = ['month'];// 需要合并的列
|
|
|
|
|
const cellValue = row[column.property];// 合并行的相同的唯一标识
|
|
|
|
|
if (cellValue && fields.includes(column.property)) {
|
|
|
|
|
const prevRow = visibleData[_rowIndex - 1];
|
|
|
|
|
let nextRow = visibleData[_rowIndex + 1];
|
|
|
|
|
if (prevRow && prevRow[column.property] === cellValue) {
|
|
|
|
|
// 如果和第一行数据一样,就删除
|
|
|
|
|
return {rowspan: 0, colspan: 0};
|
|
|
|
|
} else {
|
|
|
|
|
// 获取有机会数据是一样的
|
|
|
|
|
let countRowspan = 1;
|
|
|
|
|
while (nextRow && nextRow[column.property] === cellValue) {
|
|
|
|
|
nextRow = visibleData[++countRowspan + _rowIndex];
|
|
|
|
|
}
|
|
|
|
|
if (countRowspan > 1) {
|
|
|
|
|
return {rowspan: countRowspan, colspan: 1};
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
</script>
|