| | |
| | | <!-- 2--> |
| | | <div class="kb_left_bottom kb_pd10"> |
| | | <div class="kb_left_bottom_content"> |
| | | <div class="content_head">采购到货跟踪:</div> |
| | | <div class="content_head kb_title_text">采购到货跟踪</div> |
| | | <div class="content_body"> |
| | | <el-table |
| | | ref="tableData" |
| | |
| | | <el-table-column |
| | | prop="suppername" |
| | | label="供应商" |
| | | width="163" |
| | | /> |
| | | width="125" |
| | | > |
| | | <template slot-scope="{row}"> |
| | | <div v-if="row.suppername" class="ellipsis">{{ row.suppername }}</div> |
| | | <div v-else /> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="username" |
| | | label="采购员" |
| | | width="68" |
| | | /> |
| | | > |
| | | <template slot-scope="{row}"> |
| | | <div v-if="row.username">{{ row.username }}</div> |
| | | <div v-else>/</div> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="partcode" |
| | | label="产品编码" |
| | | width="84" |
| | | width="108" |
| | | /> |
| | | <el-table-column |
| | | prop="partname" |
| | | label="产品名称" |
| | | width="168" |
| | | width="155" |
| | | /> |
| | | <el-table-column |
| | | prop="partspec" |
| | | label="规格型号" |
| | | width="84" |
| | | /> |
| | | width="130" |
| | | > |
| | | <template slot-scope="{row}"> |
| | | <div v-if="row.partspec" class="ellipsis">{{ row.partspec }}</div> |
| | | <div v-else>/</div> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="quantity" |
| | | label="订单数量" |
| | | width="84" |
| | | /> |
| | | width="74" |
| | | > |
| | | <template slot-scope="{row}"> |
| | | <div v-if="row.quantity">{{ parseFloat(row.quantity) }}</div> |
| | | <div v-else>0</div> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="checktype" |
| | | label="检验状态" |
| | |
| | | <el-table-column |
| | | prop="quantity1" |
| | | label="已收数量" |
| | | width="84" |
| | | /> |
| | | <el-table-column |
| | | label="未收数量" |
| | | width="84" |
| | | width="74" |
| | | > |
| | | <template slot-scope="{row}"> |
| | | <div>{{ parseFloat(row.quantity- row.quantity1) }}</div> |
| | | <div v-if="row.quantity1">{{ parseFloat(row.quantity1) }}</div> |
| | | <div v-else>0</div> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | label="未收数量" |
| | | width="74" |
| | | > |
| | | <template slot-scope="{row}"> |
| | | <div v-if="row.quantity- row.quantity1">{{ parseFloat(row.quantity- row.quantity1) }}</div> |
| | | <div v-else>0</div> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="acceptDate" |
| | | label="预计交期" |
| | | width="84" |
| | | width="95" |
| | | > |
| | | <template slot-scope="{row}"> |
| | | <div>{{ row.acceptDate.substring(5, 10) }}</div> |
| | | <div v-if="row.acceptDate">{{ row.acceptDate.substring(0, 10) }}</div> |
| | | <div v-else>/</div> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | |
| | | > |
| | | <template slot-scope="{row}"> |
| | | <div v-if="parseFloat(row.warning)<0" style="color: red">{{ Math.abs(parseFloat(row.warning)) }}</div> |
| | | <div v-else-if="row.warning===null">0</div> |
| | | <div v-else>{{ row.warning }}</div> |
| | | <div v-else-if="row.warning===null||row.warning===''||row.warning===0">0</div> |
| | | <div v-else-if="parseFloat(row.warning)>3">{{ row.warning }}</div> |
| | | <div v-else-if="parseFloat(row.warning)>0&&parseFloat(row.warning)<=3" style="color:yellow;">{{ row.warning }}</div> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | |
| | | <div class="kb_right kb_pd10"> |
| | | <div class="kb_right_top kb_pd10"> |
| | | <div class="kb_right_top_content"> |
| | | <div class="content_head">供应商延期交货排行:</div> |
| | | <div class="content_head kb_title_text">供应商延期交货排行</div> |
| | | <div class="content_body"> |
| | | <el-table |
| | | ref="tableDataRank" |
| | |
| | | <el-table-column |
| | | type="index" |
| | | label="序号" |
| | | width="100" |
| | | width="90" |
| | | > |
| | | <template slot-scope="{row}"> |
| | | <div>NO.{{ row.index }}</div> |
| | |
| | | <el-table-column |
| | | prop="suppercode" |
| | | label="供应商编码" |
| | | width="145" |
| | | width="170" |
| | | /> |
| | | <el-table-column |
| | | prop="suppername" |
| | | width="163" |
| | | width="183" |
| | | label="供应商名称" |
| | | /> |
| | | <el-table-column |
| | | prop="cont" |
| | | label="延期次数" |
| | | width="125" |
| | | width="90" |
| | | /> |
| | | </el-table> |
| | | </div> |
| | |
| | | getPurchaseLeftTop() { |
| | | PurchaseLeftTop().then(res => { |
| | | this.purchaseLeftTopData = res.data[0] |
| | | console.log(this.purchaseLeftTopData) |
| | | // console.log(this.purchaseLeftTopData) |
| | | }) |
| | | setInterval(() => { |
| | | PurchaseLeftTop().then(res => { |
| | |
| | | getPurchaseLeftBottom() { |
| | | PurchaseLeftBottom().then(res => { |
| | | this.tableData = res.data |
| | | }) |
| | | |
| | | const divData = this.$refs.tableData.bodyWrapper |
| | | // 拿到元素后,对元素进行定时增加距离顶部距离,实现滚动效果(此配置为每100毫秒移动1像素) |
| | | setInterval(() => { |
| | | // 元素自增距离顶部1像素 |
| | | // divData.scrollTop += divData.scrollHeight / this.tableDataRank.length |
| | | divData.scrollTop += 1 |
| | | // 判断元素是否滚动到底部(可视高度+距离顶部=整个高度) |
| | | if (divData.clientHeight + divData.scrollTop === divData.scrollHeight) { |
| | | // 重置table距离顶部距离 |
| | | divData.scrollTop = 0 |
| | | PurchaseLeftBottom().then(res => { |
| | | this.tableData = res.data |
| | | }) |
| | | } |
| | | }, this.tableData.length <= 14 ? 1000 * 6 : 100) |
| | | const divData = this.$refs.tableData.bodyWrapper |
| | | // 拿到元素后,对元素进行定时增加距离顶部距离,实现滚动效果(此配置为每100毫秒移动1像素) |
| | | setInterval(() => { |
| | | // 元素自增距离顶部1像素 |
| | | // divData.scrollTop += divData.scrollHeight / this.tableDataRank.length |
| | | divData.scrollTop += 1 |
| | | // 判断元素是否滚动到底部(可视高度+距离顶部=整个高度) |
| | | if (divData.clientHeight + divData.scrollTop === divData.scrollHeight) { |
| | | // 重置table距离顶部距离 |
| | | divData.scrollTop = 0 |
| | | PurchaseLeftBottom().then(res => { |
| | | this.tableData = res.data |
| | | }) |
| | | } |
| | | }, this.tableData.length <= 14 ? 1000 * 6 : 100) |
| | | }) |
| | | }, |
| | | |
| | | getPurchaseRight() { |
| | | PurchaseRight().then(res => { |
| | | this.tableDataRank = res.data |
| | | }) |
| | | |
| | | const divData = this.$refs.tableDataRank.bodyWrapper |
| | | // 拿到元素后,对元素进行定时增加距离顶部距离,实现滚动效果(此配置为每100毫秒移动1像素) |
| | | setInterval(() => { |
| | | // 元素自增距离顶部1像素 |
| | | // divData.scrollTop += divData.scrollHeight / this.tableDataRank.length |
| | | divData.scrollTop += 1 |
| | | // 判断元素是否滚动到底部(可视高度+距离顶部=整个高度) |
| | | if (divData.clientHeight + divData.scrollTop === divData.scrollHeight) { |
| | | // 重置table距离顶部距离 |
| | | divData.scrollTop = 0 |
| | | PurchaseRight().then(res => { |
| | | this.tableDataRank = res.data |
| | | }) |
| | | } |
| | | }, this.tableDataRank.length <= 22 ? 1000 * 6 : 100) |
| | | const divData = this.$refs.tableDataRank.bodyWrapper |
| | | // 拿到元素后,对元素进行定时增加距离顶部距离,实现滚动效果(此配置为每100毫秒移动1像素) |
| | | setInterval(() => { |
| | | // 元素自增距离顶部1像素 |
| | | // divData.scrollTop += divData.scrollHeight / this.tableDataRank.length |
| | | divData.scrollTop += 1 |
| | | // 判断元素是否滚动到底部(可视高度+距离顶部=整个高度) |
| | | if (divData.clientHeight + divData.scrollTop === divData.scrollHeight) { |
| | | // 重置table距离顶部距离 |
| | | divData.scrollTop = 0 |
| | | PurchaseRight().then(res => { |
| | | this.tableDataRank = res.data |
| | | }) |
| | | } |
| | | }, this.tableDataRank.length <= 22 ? 1000 * 6 : 100) |
| | | }) |
| | | }, |
| | | |
| | | tableRowClassName({ row, rowIndex }) { |
| | |
| | | </script> |
| | | |
| | | <style scoped lang="scss"> |
| | | $kbBorderColor: #09d8f2; |
| | | //$kbBorderColor: #09d8f2; |
| | | $kbBorderColor: rgba(9,216,242,0.4); |
| | | |
| | | .kb_content { |
| | | display: flex; |
| | |
| | | /* width: 0;宽度为0暗藏 */ |
| | | width: 0; |
| | | } |
| | | |
| | | ::v-deep .cell { |
| | | padding: 0 !important; |
| | | } |
| | | </style> |