From 5ecb7958c96d3f0b6d47b79aff7eb306c2cf690f Mon Sep 17 00:00:00 2001
From: charles <981744753@qq.com>
Date: 星期二, 06 八月 2024 11:16:58 +0800
Subject: [PATCH] gitlab上面的wms转移到公司git
---
src/components/makepager/TableCommonView.vue | 283 ++++++++++++++++++++++++++++++++++---------------------
1 files changed, 174 insertions(+), 109 deletions(-)
diff --git a/src/components/makepager/TableCommonView.vue b/src/components/makepager/TableCommonView.vue
index 8fcc0fe..d4bc001 100644
--- a/src/components/makepager/TableCommonView.vue
+++ b/src/components/makepager/TableCommonView.vue
@@ -1,9 +1,6 @@
<!-- eslint-disable vue/no-use-v-if-with-v-for -->
<template>
- <div
- :class="{ 'table-view': true, table_height: !showSummary }"
- v-loading="loading"
- >
+ <div class="table-view" v-loading="loading">
<el-table
ref="table"
border
@@ -25,15 +22,8 @@
:summary-method="getSummaries"
:show-summary="showSummary"
>
- <el-table-column v-if="tableList.selectBox" type="selection" width="40">
- </el-table-column>
- <el-table-column
- v-if="tableList.selectIndex"
- type="index"
- label="搴忓彿"
- width="50"
- >
- </el-table-column>
+ <el-table-column v-if="tableList.selectBox" type="selection" width="40" :selectable="selectable"> </el-table-column>
+ <el-table-column v-if="tableList.selectIndex" type="index" label="搴忓彿" width="50"> </el-table-column>
<el-table-column
v-for="(item, i) in tableList.tableColumn"
:key="i"
@@ -43,48 +33,40 @@
:min-width="item.min"
show-overflow-tooltip
:sortable="item.sortable"
+ :align="item.textAlign"
v-if="item.isShowColumn"
>
<template slot-scope="scope">
- <span v-if="item.price">{{
- "锟�" + number_format(scope.row[item.prop], 2, ".", ",")
- }}</span>
+ <span v-if="item.price">{{ "锟�" + number_format(scope.row[item.prop], 2, ".", ",") }}</span>
<!-- 鐘舵�佹樉绀� -->
<div v-else-if="item.status">
<span
class="Badge"
:class="{
- greenSlot: scope.row.status == '4',
+ greenSlot: scope.row.status == '4' || scope.row.status == '瀹屾垚',
redSlot: scope.row.status == '5',
- blueSlot: scope.row.status == '3',
- graySlot: scope.row.status == '1',
+ blueSlot: scope.row.status == '3' || scope.row.status == '灏辩华',
+ graySlot: scope.row.status == '1'
}"
>{{
- item.isCallMethod
- ? item.getCallMethod(scope.row[item.prop], scope.row)
- : scope.row[item.prop]
+ item.isCallMethod ? item.getCallMethod(scope.row[item.prop], scope.row) : scope.row[item.prop]
}}</span
>
</div>
<!-- 璋冪敤鏂规硶鏄剧ず鏂囧瓧 -->
<div v-else-if="item.isCallMethod">
- <span>{{
- item.getCallMethod(scope.row[item.prop], scope.row)
- }}</span>
+ <span>{{ item.getCallMethod(scope.row[item.prop], scope.row) }}</span>
</div>
<!-- 灏忎簬褰撳墠鏃堕棿鏄剧ず涓嶅悓棰滆壊 -->
<span
v-else-if="item.date"
:style="{
- color:
- new Date().getTime() > new Date(scope.row[item.prop]).getTime()
- ? '#D23F3A'
- : '#606266',
+ color: new Date().getTime() > new Date(scope.row[item.prop]).getTime() ? '#D23F3A' : '#606266'
}"
- >{{ timeAgo(scope.row[item.prop]) }}</span
+ >{{ scope.row[item.prop] }}</span
>
<div v-else-if="item.conversion">
- <span>{{ item.getStatus(scope.row[item.prop]) }}</span>
+ <p class="exceed_width">{{ item.getStatus(scope.row[item.prop]) }}</p>
</div>
<span
v-else-if="item.isClick && scope.row[item.prop]"
@@ -93,18 +75,10 @@
>{{ scope.row[item.prop] }}</span
>
<span v-else-if="item.propType == 'mulitple'">
- {{
- scope.row[item.prop][item.propTwo]
- ? scope.row[item.prop][item.propTwo]
- : "--"
- }}
+ {{ scope.row[item.prop][item.propTwo] ? scope.row[item.prop][item.propTwo] : "--" }}
</span>
<span :class="item.className ? item.className : ''" v-else>{{
- scope.row[item.prop]
- ? scope.row[item.prop]
- : scope.row[item.prop] === 0
- ? scope.row[item.prop]
- : "--"
+ scope.row[item.prop] ? scope.row[item.prop] : scope.row[item.prop] === 0 ? scope.row[item.prop] : "--"
}}</span>
</template>
</el-table-column>
@@ -116,25 +90,22 @@
<div class="overSpread1" v-show="iscolopen" @click="onMaskClick"></div>
<div v-if="showCheckcol" class="styleBtn">
<i @click="checkcol()" class="label">...</i>
- <el-checkbox-group
- v-model="showcolList"
- v-show="iscolopen"
- class="checkbox-group"
- @change="selCeckBoxList"
- >
- <el-checkbox v-for="item in tableList.allcol" :label="item" :key="item"
- >{{ item }}
- </el-checkbox>
+ <el-checkbox-group v-model="showcolList" v-show="iscolopen" class="checkbox-group" @change="selCeckBoxList">
+ <el-checkbox v-for="item in tableList.allcol" :label="item" :key="item">{{ item }} </el-checkbox>
</el-checkbox-group>
</div>
</div>
</template>
<script>
-import { timeago } from "@/common/config/index";
+import { timeago } from "@/common/config/index"
export default {
name: "TableCommonView",
props: {
+ warehouseId:{
+ type:Number,
+ default:0
+ },
tableList: {
type: Object,
default: () => {
@@ -149,147 +120,186 @@
highlight: false,
tableColumn: [
// table琛ㄥ崟
- { label: "", prop: "", min: 200, tooltip: true },
- ],
- };
+ { label: "", prop: "", min: 200, tooltip: true, textAlign: "center" }
+ ]
+ }
},
showcol: {
typeof: Array,
- default: () => [],
- },
+ default: () => []
+ }
},
// 鍚堝苟鍗曞厓鏍�
rowData: {
type: Array,
default: () => {
- return [];
- },
+ return []
+ }
},
// 鍔犺浇鐨刲oading
loading: {
type: Boolean,
- default: false,
+ default: false
},
// 閫変腑鐨勬牱寮�
selectClassRow: {
type: Object,
default: () => {
- return {};
- },
+ return {}
+ }
},
showCheckcol: {
type: Boolean,
- default: true,
+ default: true
},
showSummary: {
type: Boolean,
- default: false,
+ default: false
},
+ // 鍒楄〃涓嶅彲閫夌殑鏁版嵁
+ selectBoxList: {
+ type: Array,
+ default: () => []
+ },
+ name:{
+ type:String,
+ default:''
+ }
},
data() {
return {
iscolopen: false,
- showcolList: this.tableList.showcol,
- };
+ showcolList: this.tableList.showcol
+ }
},
watch: {},
computed: {},
beforeUpdate() {},
methods: {
onMaskClick() {
- this.iscolopen = false;
+ this.iscolopen = false
},
// 鍚堝苟鍗曞厓鏍�
objectSpanMethod({ row, column, rowIndex, columnIndex }) {
- row;
- column;
+ row
+ column
if (this.rowData && this.rowData.length > 0) {
// 浜у搧BOM 琛ㄦ牸鐗规畩澶勭悊 鍚堝苟鍗曞厓鏍�
if (columnIndex < 5 || columnIndex == 9) {
- const _row = this.rowData[rowIndex];
- const _col = _row > 0 ? 1 : 0;
+ const _row = this.rowData[rowIndex]
+ const _col = _row > 0 ? 1 : 0
return {
rowspan: _row,
- colspan: _col,
- };
+ colspan: _col
+ }
}
}
},
tableRowClick(row) {
- this.$emit("tableRowClick", row);
+ this.$emit("tableRowClick", row)
},
handleReserve(row) {
- return row._id ? row._id : row.id;
+ return row._id ? row._id : row.id
},
handleSelectionChange(val) {
- this.$emit("getSelectArray", val);
+ this.$emit("getSelectArray", val)
},
// 鍏叡璇︽儏
selCommonClick(row) {
- this.$emit("selCommonClick", row);
+ this.$emit("selCommonClick", row)
},
// 閫夋嫨鍒�
checkcol() {
- this.iscolopen = !this.iscolopen;
+ this.iscolopen = !this.iscolopen
},
closeCheckbox() {
- let label = document.querySelector(".label");
+ let label = document.querySelector(".label")
if (label) {
- this.iscolopen = false;
+ this.iscolopen = false
}
},
selCeckBoxList(val) {
- this.$emit("selTableCol", val);
+ this.$emit("selTableCol", val)
},
// 鍗曢�夎鐩稿叧
tableRowClassName({ row }) {
- if (Object.keys(this.selectClassRow).length > 0) {
- if (row.id == this.selectClassRow.id) {
- return "onSelect";
+ if(this.$route.query.workType!=1){
+ if(Object.keys(this.selectClassRow).length>0&&this.selectClassRow.location){
+ if(this.selectClassRow.id==row.id&&this.selectClassRow.location.warehouseId==row.location.warehouseId&&row.location.name==this.selectClassRow.location.name){
+ return "onSelect";
+ }
+ }
+ } else{
+ if (Object.keys(this.selectClassRow).length > 0) {
+ if (row.id == this.selectClassRow.id) {
+ return "onSelect"
+ }
+ }
}
- }
this.$emit("tableRowClassName", row);
},
timeAgo(val) {
- return timeago(val);
+ return timeago(val)
},
//姹傚拰
getSummaries(param) {
if (this.tableList.countcol && this.tableList.countcol.length > 0) {
- const { columns, data } = param;
- const sums = [];
+ const { columns, data } = param
+ const sums = []
columns.forEach((column, index) => {
if (index === 0) {
- sums[index] = " ";
- return;
+ sums[index] = " "
+ return
}
this.tableList.countcol.forEach((countcols) => {
if (column.label === countcols) {
- const values = data.map((item) => Number(item[column.property]));
+ const values = (data||[]).map((item) => Number(item[column.property]))
if (!values.every((value) => isNaN(value))) {
sums[index] = values.reduce((prev, curr) => {
- const value = Number(curr);
+ const value = Number(curr)
if (!isNaN(value)) {
- return prev + curr;
+ return prev + curr
} else {
- return prev;
+ return prev
}
- }, 0);
- sums[index] =
- this.tableList.tableColumn[index - 1].unit + "" + sums[index];
+ }, 0)
+ let unitIndex = this.tableList.tableColumn.findIndex((obj) => obj.label === column.label)
+ sums[index] = this.tableList.tableColumn[unitIndex].unit + sums[index]
} else {
- sums[index] = "";
+ sums[index] = ""
}
} else {
- return;
+ return
}
- });
- });
- return sums;
+ })
+ })
+ return sums
}
},
- },
-};
+ selectable(row) {
+ let prop='id'
+ if(this.name=='product'){
+ prop='productId'
+ }
+ if(this.$route.query.workType!=1){
+ const flag= this.selectBoxList.some(item=>{
+ if(item.location){
+ return item[prop]==row.id&&item.location.warehouseId==row.location.warehouseId&&item.location.name==row.location.name;
+ }
+ return false;
+ })
+ return !flag;
+ }else{
+ let list = (this.selectBoxList||[]).map((item) => item[prop])
+ if (list.findIndex((v) => v == row.id) == -1) {
+ return true
+ } else {
+ return false
+ }
+ }
+ }
+ }
+}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
@@ -297,7 +307,7 @@
.table_height {
height: 100%;
}
-.el-table__body-wrapper{
+.el-table__body-wrapper {
height: 100%;
}
.table-view {
@@ -333,16 +343,18 @@
.styleBtn {
position: absolute;
width: 30px;
- height: 48px;
+ height: 35px;
// line-height: 26px;
- background: #f1f3f8;
+ background: transparent;
border-top-right-radius: 8px;
top: 0px;
right: 2px;
- // z-index: 9999;
+ display: flex;
+ align-items: center;
+ z-index: 9999;
.label {
position: absolute;
- top: 12px;
+ top: 6px;
font-size: 20px;
cursor: pointer;
color: #000;
@@ -379,9 +391,62 @@
border-top-left-radius: 12px;
border-top-right-radius: 12px;
overflow: auto;
+ .exceed_width {
+ width: 100%;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ }
+ }
+}
+
+::v-deep .el-table .cell {
+ font-size: 12px;
+ line-height: 17px;
+ font-family: PingFangSC;
+ color: rgba(0, 0, 0, 0.9);
+ .el-button--text {
+ width: auto;
+ height: auto;
+ font-family: PingFangSC-Medium, sans-serif;
+ }
+}
+::v-deep .el-table .el-table__cell {
+ padding: 6px 0 !important;
+ height: 35px;
+ text-align: center;
+}
+
+::v-deep {
+ .el-table .cell .el-button--text.el-button--small {
+ padding: 4px 0;
+ }
+ .el-table .el-table__cell {
+ padding: 6px 0 !important;
+ height: 35px;
+ text-align: center;
}
.el-table__body-wrapper {
- // height: ;
+ height: unset !important;
}
+ .el-table__cell.is-left {
+ text-align: left !important;
+ }
+ .el-table__cell.is-right {
+ text-align: right !important;
+ }
+ .el-table::before{ width: 0px; }
+}
+.overSpread1 {
+ width: 100%;
+ height: 100%;
+ position: fixed;
+ top: 0;
+ left: 0;
+ background: rgba(0, 0, 0, 0);
+ z-index: 10;
+}
+.el-table__cell {
+ text-align: unset !important;
}
</style>
--
Gitblit v1.8.0