@@ -592,6 +630,11 @@ export default {
traceValue: [],
addNum: 0,
tableHeight: 0,
+ // 货运动态位置
+ goodStatusShow: false,
+ goodStatusScreenX: 0,
+ goodStatusScreenY: 0,
+ goodStatusData: null,
// 批量编辑
editingForm: this.$form.createForm(this),
vesselData: [],
@@ -1239,6 +1282,13 @@ export default {
})
}
item.bookstatus = bookstatus
+ let hasGoods = 0
+ item.goodsStatusList.map((gitem, gindex) => {
+ if (gitem.finishTime || gitem.remark) {
+ hasGoods++
+ }
+ })
+ item.hasGoods = hasGoods
return item
})
this.$set(this.gridOptions.pagerConfig, 'columns', JSON.parse(JSON.stringify(initData.columns)))
@@ -1398,6 +1448,34 @@ export default {
this.remarkShow = false
this.remarkData = null
},
+ goodStatusclick (e, data) {
+ if (!this.goodStatusShow) {
+ this.goodStatusHover(e, data)
+ } else {
+ this.goodStatusLeave(e, data)
+ }
+ },
+ goodStatusHover(e, data) {
+ const maxWidth = window.innerWidth
+ console.log(maxWidth, e.pageX, maxWidth - e.pageX)
+ if (maxWidth - e.pageX > 230) {
+ // this.goodStatusScreenX = e.pageX + 20
+ this.goodStatusScreenX = e.pageX - 139
+ } else {
+ // this.goodStatusScreenX = e.pageX - 300
+ this.goodStatusScreenX = e.pageX - 139
+ }
+ // this.goodStatusScreenY = e.pageY + 20
+ this.goodStatusScreenY = e.pageY + 25
+ this.goodStatusData = data.goodsStatusList
+ this.goodStatusShow = true
+ console.log('== 鼠标滑过 ==', this.goodStatusScreenX, this.goodStatusScreenY, this.goodStatusShow, this.goodStatusData)
+ },
+ goodStatusLeave(e, data) {
+ this.goodStatusShow = false
+ this.goodStatusData = null
+ console.log('== 鼠标离开 ==')
+ },
openTraceModel() {
const select = this.$refs.xGrid.getCheckboxRecords()
if (select.length === 0) {
@@ -2151,6 +2229,41 @@ export default {
cursor: pointer;
}
}
+
+// 货物状态
+.goods-status{
+ width: 100%;
+ display: flex;
+ height: 48px;
+ .goods-status-left{
+ flex: 1;
+ overflow: hidden;
+ height: 48px;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ .goods-tip{
+ font-size: 12px;
+ margin: 0 4px;
+ cursor: pointer;
+ height: 48px;
+ line-height: 48px;
+ display: inline-block;
+ color: @primary-color;
+ }
+ }
+ .goods-status-right{
+ width: 30px;
+ text-align: center;
+ height: 48px;
+ i{
+ color: @primary-color;
+ cursor: pointer;
+ height: 48px;
+ line-height: 48px;
+ }
+ }
+}
+
/deep/ .line-box:nth-last-of-type(-n + 5) {
.book-remark-box {
.bookremark {
@@ -2226,6 +2339,67 @@ export default {
}
}
}
+.goods-hovers-list{
+ max-height: 400px;
+ position: fixed;
+ top: 0;
+ left: 0;
+ z-index: 999;
+ width: 300px;
+ background: #fff;
+ box-shadow: 0 0 50px #eee;
+ border-radius: 4px;
+ border: 1px solid #eee;
+ padding: 5px 20px 10px 20px;
+ white-space: normal;
+ text-align: left;
+ z-index: 999 !important;
+ // overflow: auto;
+ &::before{
+ content: '';
+ float: left;
+ width: 0;
+ height: 0;
+ border-width: 8px;
+ border-style: solid;
+ border-color: transparent #fff transparent transparent;
+ -webkit-transform: rotate(90deg);
+ transform: rotate(90deg);
+ position: absolute;
+ top: -15px;
+ left: 50%;
+ margin-left: -16px;
+ }
+ .title {
+ height: 30px;
+ line-height: 30px;
+ font-size: 12px;
+ font-weight: 600;
+ }
+ .goods-btn {
+ display:inline-block;
+ font-size: 12px;
+ color: #666;
+ word-break: break-all;
+ width:82px;
+ height: 28px;
+ line-height: 28px;
+ border-radius: 4px;
+ border: 1px solid #eee;
+ margin-bottom: 6px;
+ text-align: center;
+ margin: 0 2px 8px;
+ cursor: pointer;
+ &.active{
+ color: @primary-color;
+ border: 1px solid @primary-color;
+ }
+ .icon {
+ margin-right: 4px;
+ color: @primary-color;
+ }
+ }
+}
@media (min-width: 1192px) and (max-width: 1591px) {
.booking-from-box {
diff --git a/src/views/main/BookingLedger/list/modules/initData.js b/src/views/main/BookingLedger/list/modules/initData.js
index c1d54e5..ffd36e1 100644
--- a/src/views/main/BookingLedger/list/modules/initData.js
+++ b/src/views/main/BookingLedger/list/modules/initData.js
@@ -101,7 +101,8 @@ export default {
{ field: 'pono', label: 'PONO', width: 120, title: 'PO NO', showHeaderOverflow: true, sortable: true },
// 以下为新增字段
{ field: 'dzRemark', label: 'DZREMARK', width: 160, title: '单证备注', showHeaderOverflow: true, sortable: true },
- { field: 'czRemark', label: 'CZREMARK', width: 160, title: '操作备注', showHeaderOverflow: true, sortable: true }
+ { field: 'czRemark', label: 'CZREMARK', width: 160, title: '操作备注', showHeaderOverflow: true, sortable: true },
+ { field: 'goodsStatusList', label: 'GOODSSTATUSLIST', minWidth: 160, title: '货物状态', showHeaderOverflow: true, slots: { default: 'goodsStatusList' } }
],
// ==== 表单部分 ====
condAllData: [