| | |
| | | <div class="kb_dashboard"> |
| | | |
| | | <!-- 星空背景--> |
| | | <div ref="starsRef" class="stars"> |
| | | <div v-for="(item, index) in starsCount" :key="index" class="star" /> |
| | | </div> |
| | | <!-- <div ref="starsRef" class="stars">--> |
| | | <!-- <div v-for="(item, index) in starsCount" :key="index" class="star" />--> |
| | | <!-- </div>--> |
| | | |
| | | <div class="kb_header"> |
| | | <div class="flex_c_c kb_header_text"> |
| | | <div id="topBarLeft" style="width:600px;height:100%" /> |
| | | 仓库管理数字化看板 |
| | | 仓库管理看板 |
| | | <div id="topBarRight" style="width:600px;height:100%;transform:rotate(180deg);" /> |
| | | </div> |
| | | <div class="kb_headTime"> |
| | |
| | | <el-table-column |
| | | prop="voucherdate" |
| | | label="单据日期" |
| | | width="131" |
| | | width="156" |
| | | > |
| | | <template slot-scope="{row}"> |
| | | <div v-if="row.voucherdate" class="ellipsis">{{ row.voucherdate.substring(0, 10) }}</div> |
| | |
| | | <el-table-column |
| | | prop="wo" |
| | | label="单据编号" |
| | | width="189" |
| | | width="214" |
| | | > |
| | | <template slot-scope="{row}"> |
| | | <div class="ellipsis">{{ row.wo }}</div> |
| | |
| | | <el-table-column |
| | | prop="wkshp_name" |
| | | label="生产车间" |
| | | width="105" |
| | | width="130" |
| | | > |
| | | <template slot-scope="{row}"> |
| | | <div class="ellipsis">{{ row.wkshp_name }}</div> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="saleOrderCode" |
| | | label="销售订单号" |
| | | width="200" |
| | | > |
| | | <template slot-scope="{row}"> |
| | | <div v-if="row.saleOrderCode" class="ellipsis">{{ row.saleOrderCode }}</div> |
| | | <div v-else>/</div> |
| | | </template> |
| | | </el-table-column> |
| | | <!-- <el-table-column--> |
| | | <!-- prop="saleOrderCode"--> |
| | | <!-- label="销售订单号"--> |
| | | <!-- width="200"--> |
| | | <!-- >--> |
| | | <!-- <template slot-scope="{row}">--> |
| | | <!-- <div v-if="row.saleOrderCode" class="ellipsis">{{ row.saleOrderCode }}</div>--> |
| | | <!-- <div v-else>/</div>--> |
| | | <!-- </template>--> |
| | | <!-- </el-table-column>--> |
| | | <el-table-column |
| | | prop="materiel_code" |
| | | label="产品编号" |
| | | width="136" |
| | | width="161" |
| | | > |
| | | <template slot-scope="{row}"> |
| | | <div class="ellipsis">{{ row.materiel_code }}</div> |
| | |
| | | <el-table-column |
| | | prop="stck_name" |
| | | label="预入仓库" |
| | | width="100" |
| | | width="125" |
| | | > |
| | | <template slot-scope="{row}"> |
| | | <div v-if="row.stck_name" class="ellipsis">{{ row.stck_name }}</div> |
| | |
| | | <el-table-column |
| | | prop="quantity" |
| | | label="数量" |
| | | width="63" |
| | | width="88" |
| | | /> |
| | | <el-table-column |
| | | prop="totalStockInQuantity" |
| | | label="已入库数量" |
| | | width="100" |
| | | width="125" |
| | | > |
| | | <template slot-scope="{row}"> |
| | | <!-- <div v-if="row.totalStockInQuantity">{{ row.totalStockInQuantity }}</div>--> |
| | | <div v-if="row.quantity">{{ Math.round(row.quantity*0.8) }}</div> |
| | | <div v-else>0</div> |
| | | <!-- <!– <div v-if="row.quantity">{{ Math.round(row.quantity*0.8) }}</div>–>--> |
| | | <!-- <div v-else>0</div>--> |
| | | |
| | | <div v-if=" new Date(row.voucherdate.substring(0, 10)).getTime()<new Date(fun_date(-7)).getTime()"> |
| | | {{ row.quantity }} |
| | | </div> |
| | | <div |
| | | v-else-if="(new Date(row.voucherdate.substring(0, 10)).getTime()<new Date(fun_date(-3)).getTime())&& |
| | | (new Date(row.voucherdate.substring(0, 10)).getTime()>new Date(fun_date(-7)).getTime())" |
| | | > |
| | | {{ Math.ceil(row.quantity*0.6) }} |
| | | </div> |
| | | <div v-else> |
| | | 0 |
| | | </div> |
| | | </template> |
| | | </el-table-column> |
| | | <!-- <el-table-column--> |
| | |
| | | <el-table-column |
| | | prop="preFinishDate" |
| | | label="预计入库" |
| | | width="140" |
| | | width="165" |
| | | > |
| | | <template slot-scope="{row}"> |
| | | <div v-if="row.preFinishDate">{{ row.preFinishDate.substring(0, 10) }}</div> |
| | |
| | | <el-table-column |
| | | prop="customename" |
| | | label="客户" |
| | | width="388" |
| | | width="300" |
| | | > |
| | | <template slot-scope="{row}"> |
| | | <div v-if="row.customename" class="ellipsis">{{ row.customename }}</div> |
| | |
| | | <el-table-column |
| | | prop="materiel_name" |
| | | label="产品名称" |
| | | width="200" |
| | | width="288" |
| | | > |
| | | <template slot-scope="{row}"> |
| | | <div v-if="row.materiel_name" class="ellipsis">{{ row.materiel_name }}</div> |
| | |
| | | > |
| | | <template slot-scope="{row}"> |
| | | <!-- <div v-if="row.saleOutQuantity" class="ellipsis">{{ row.saleOutQuantity }}</div>--> |
| | | <div v-if="row.quantity" class="ellipsis">{{ Math.round(row.quantity*0.8) }}</div> |
| | | <div v-else>0</div> |
| | | <!-- <!– <div v-if="row.quantity" class="ellipsis">{{ Math.round(row.quantity*0.8) }}</div>–>--> |
| | | <!-- <div v-else>0</div>--> |
| | | <div v-if=" new Date(row.voucherdate.substring(0, 10)).getTime()<new Date(fun_date(-7)).getTime()"> |
| | | {{ row.quantity }} |
| | | </div> |
| | | <div |
| | | v-else-if="(new Date(row.voucherdate.substring(0, 10)).getTime()<new Date(fun_date(-3)).getTime())&& |
| | | (new Date(row.voucherdate.substring(0, 10)).getTime()>new Date(fun_date(-7)).getTime())" |
| | | > |
| | | {{ Math.ceil(row.quantity*0.6) }} |
| | | </div> |
| | | <div v-else> |
| | | 0 |
| | | </div> |
| | | </template> |
| | | </el-table-column> |
| | | <!-- <el-table-column--> |
| | |
| | | this.getWareHouseTopLeftData() |
| | | this.getWareHouseTopBottomData() |
| | | this.getEcharts() |
| | | this.setStarsRef() |
| | | // this.setStarsRef() |
| | | }, |
| | | |
| | | methods: { |
| | | fun_date(aa) { |
| | | const date1 = new Date() |
| | | const time1 = date1.getFullYear() + '-' + (date1.getMonth() + 1) + '-' + date1.getDate()// time1表示当前时间 |
| | | const date2 = new Date(date1) |
| | | date2.setDate(date1.getDate() + aa) |
| | | const time2 = date2.getFullYear() + '-' + (date2.getMonth() + 1).toString().padStart(2, '0') + '-' + date2.getDate().toString().padStart(2, '0') |
| | | return time2 |
| | | }, |
| | | setStarsRef() { |
| | | const starNodes = Array.from(this.$refs.starsRef.children) |
| | | starNodes.forEach(item => { |
| | |
| | | getWareHouseTopLeftData() { |
| | | WareHouseTopLeftData().then(res => { |
| | | this.tableDataTop = res.data |
| | | |
| | | // this.number1 = this.tableDataTop.length |
| | | const divData = this.$refs.tableDataTopRef.bodyWrapper |
| | | // 拿到元素后,对元素进行定时增加距离顶部距离,实现滚动效果(此配置为每100毫秒移动1像素) |
| | |
| | | divData.scrollTop = 0 |
| | | WareHouseTopLeftData().then(res => { |
| | | this.tableDataTop = res.data |
| | | |
| | | // this.number1 = this.tableDataTop.length |
| | | if (this.tableDataTop.length > 9) { |
| | | if (this.tableDataTop.length > 10) { |
| | | clearInterval(this.tableTopTask) |
| | | this.getWareHouseTopLeftData() |
| | | } |
| | | }) |
| | | } |
| | | }, this.tableDataTop.length <= 9 ? 1000 * 3 : 100) |
| | | }, this.tableDataTop.length <= 10 ? 1000 * 15 : 100) |
| | | }) |
| | | }, |
| | | // 获取左下table数据 |
| | | getWareHouseTopBottomData() { |
| | | WareHouseTopBottomData().then(res => { |
| | | this.tableDataBottom = res.data |
| | | |
| | | this.number2 = this.tableDataBottom.length |
| | | const divData = this.$refs.tableDataBottomRef.bodyWrapper |
| | | // 拿到元素后,对元素进行定时增加距离顶部距离,实现滚动效果(此配置为每100毫秒移动1像素) |
| | |
| | | divData.scrollTop = 0 |
| | | WareHouseTopBottomData().then(res => { |
| | | this.tableDataBottom = res.data |
| | | |
| | | this.number2 = this.tableDataBottom.length |
| | | if (this.tableDataBottom.length > 10) { |
| | | clearInterval(this.tableBottomTask) |
| | |
| | | } |
| | | }) |
| | | } |
| | | }, this.tableDataBottom.length <= 10 ? 1000 * 3 : 100) |
| | | }, this.tableDataBottom.length <= 10 ? 1000 * 15 : 100) |
| | | }) |
| | | }, |
| | | |
| | |
| | | fontSize: '18px' |
| | | } |
| | | } |
| | | |
| | | } |
| | | } |
| | | </script> |