|
|
@@ -0,0 +1,190 @@
|
|
|
+@extends('layouts.app')
|
|
|
+
|
|
|
+@section('title','列表')
|
|
|
+
|
|
|
+@section('content')
|
|
|
+ <div id="nav2">
|
|
|
+ @component('station.menu')@endcomponent
|
|
|
+ @component('station.cachingShelf.menu')@endcomponent
|
|
|
+ </div>
|
|
|
+ <div class="container-fluid d-none" id="list">
|
|
|
+ @include('station.cachingShelf.list._table')
|
|
|
+ @include('station.cachingShelf.list._fillBox')
|
|
|
+ </div>
|
|
|
+@endsection
|
|
|
+
|
|
|
+@section('lastScript')
|
|
|
+ <script>
|
|
|
+ new Vue({
|
|
|
+ el: '#list',
|
|
|
+ data: {
|
|
|
+ stations: {!! $stations->toJson() !!}['data'],
|
|
|
+ selectTr: null,
|
|
|
+ currentEcho:null,
|
|
|
+ materialBoxCode: null, // 料箱编码
|
|
|
+ currentStation: { // 当前Station
|
|
|
+ id: null, // Station->id
|
|
|
+ data: [[], [], []], // 格口
|
|
|
+ },
|
|
|
+ boxClass: 'modal-sm',
|
|
|
+ broadcastName: null,
|
|
|
+ channelName: ".App\\Events\\BroadcastToStation",
|
|
|
+
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.initCacheShelfBox();
|
|
|
+ this.initModalBox();
|
|
|
+ $('#list').removeClass('d-none');
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ /** 1初始化缓存架格口 */
|
|
|
+ initCacheShelfBox() {
|
|
|
+ this.currentStation.data.forEach(function (item, index, self) {
|
|
|
+ let boxRow = new Array(3);
|
|
|
+ for (let i = 0; i < boxRow.length; i++) {
|
|
|
+ let row = 2 - index + 1;
|
|
|
+ let col = 2 - i + 1;
|
|
|
+ let myIndex = index * 3 + i + 1;
|
|
|
+ boxRow[i] = {x: index, y: i, row: row, col: col, code: null, index: myIndex};
|
|
|
+ }
|
|
|
+ self[index] = boxRow;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /** 2初始化modal大小 */
|
|
|
+ initModalBox() {
|
|
|
+ if (window.screen.width >= 520) this.boxClass = 'modal-sm';
|
|
|
+ if (window.screen.width >= 720) this.boxClass = 'modal-md';
|
|
|
+ if (window.screen.width >= 960) this.boxClass = 'modal-lg';
|
|
|
+ if (window.screen.width >= 1200) this.boxClass = 'modal-xl';
|
|
|
+ },
|
|
|
+ /** 展示modal */
|
|
|
+ showFeedBox(station) {
|
|
|
+ this.currentStation.id = station['id'];
|
|
|
+ this.broadcastName = "{{config('database.redis.options.prefix')}}" + 'station-' + station['id'];
|
|
|
+ this.initCacheGrid();
|
|
|
+ $('#box').modal('show');
|
|
|
+ },
|
|
|
+ /** 清空格口号 */
|
|
|
+ clearCurrentStation() {
|
|
|
+ this.currentStation.data.forEach(function (item, index, items) {
|
|
|
+ items[index].forEach(function (item, index, self) {
|
|
|
+ self[index]['code'] = null;
|
|
|
+ })
|
|
|
+ });
|
|
|
+ this.$forceUpdate();
|
|
|
+ },
|
|
|
+ /** 初始化格口 */
|
|
|
+ initCacheGrid() {
|
|
|
+ let url = '{{url('apiLocal/station/cacheShelf/getTasks')}}'+'/'+this.currentStation.id;
|
|
|
+ window.tempTip.setIndex(1099);
|
|
|
+ window.tempTip.setDuration(3000);
|
|
|
+ window.axios.get(url).then(res => {
|
|
|
+ if (res.data.data) {
|
|
|
+ if (res.data.data.length === 0) return;
|
|
|
+ for (let i = 0; i < res.data.data.length; i++) {
|
|
|
+ if(res.data.data.length === i)break;
|
|
|
+ let grid = res.data.data[i];
|
|
|
+ let gridIndex = grid['grid_id'];
|
|
|
+ let row = Math.round(gridIndex / 3);
|
|
|
+ let col = gridIndex % 3 -1;
|
|
|
+ let code = grid['material_box'] ? grid['material_box']['code'] : null;
|
|
|
+ if(grid['status'] === 1) this.$set(this.currentStation.data[row][col], 'code', code);
|
|
|
+ }
|
|
|
+ this.$forceUpdate();
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ window.tempTip.show('获取缓存货架信息失败');
|
|
|
+ }).catch(err => {
|
|
|
+ window.tempTip.show('获取缓存货架信息异常:' + err);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /** 扫码 1、料箱扫码 */
|
|
|
+ pushMaterialBox($e) {
|
|
|
+ let code = this.materialBoxCode;
|
|
|
+ if (code === null) {
|
|
|
+ $('#material-box').focus();
|
|
|
+ }
|
|
|
+ // 自动排号
|
|
|
+ this.pushBoxToStation(null,null,$e);
|
|
|
+ },
|
|
|
+ /** 扫码 2、填写九宫格 */
|
|
|
+ pushBoxToStation(x = null, y = null, $e = null) {
|
|
|
+ let index = null;
|
|
|
+ // 自动排号和自动发送
|
|
|
+ // 选排
|
|
|
+ if (x !== null && y !== null) {
|
|
|
+ let code = $($e.target).val();
|
|
|
+ index = this.currentStation.data[x][y]['index'];
|
|
|
+ this.fillBox(code,index,x,y);
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ // 自动排号
|
|
|
+ let arr = [];
|
|
|
+ this.currentStation.data.forEach(function (items) {
|
|
|
+ items.forEach(function (item) {
|
|
|
+ if (item['code'] === null) {
|
|
|
+ arr.push(item);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ })
|
|
|
+ x = arr[0]['x'];
|
|
|
+ y = arr[0]['y'];
|
|
|
+ index = arr[0]['index'];
|
|
|
+ this.fillBox(this.materialBoxCode,index,x,y);
|
|
|
+ },
|
|
|
+ /** 扫码 4:填充页面 */
|
|
|
+ fillBox(code,index,x,y){
|
|
|
+ this.$set(this.currentStation.data[x][y], 'code', this.materialBoxCode);
|
|
|
+ this.lightOn(this.currentStation.id,code,index,x,y);
|
|
|
+ this.$forceUpdate();
|
|
|
+ },
|
|
|
+ /** 扫码 3、亮灯 */
|
|
|
+ lightOn(id,code,index,x,y) {
|
|
|
+ let url = '{{url('apiLocal/station/cacheShelf/lightOn')}}';
|
|
|
+ let data = {id:id, code:code, index:index, x:x, y:y};
|
|
|
+ window.tempTip.setDuration(2000);
|
|
|
+ window.tempTip.setIndex(1999);
|
|
|
+ window.axios.post(url,data).then(res=>{
|
|
|
+ if(res.data.success){
|
|
|
+ window.tempTip.showSuccess(res.data.data);
|
|
|
+ this.materialBoxCode = null;
|
|
|
+ return ;
|
|
|
+ }
|
|
|
+ window.tempTip.show('亮灯异常:'+res.data.data);
|
|
|
+ }).catch(err=>{
|
|
|
+ window.tempTip.show(err);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /** 校验是否存在 */
|
|
|
+ checkMaterialBoxCodeExist(code) {
|
|
|
+ let bool = false;
|
|
|
+ for (let x = 0; x < this.currentStation.data.length; x++) {
|
|
|
+ if (!isArray(this.currentStation.data[x])) {
|
|
|
+ continue;
|
|
|
+ }
|
|
|
+ if (this.currentStation.data[x].length > 0) {
|
|
|
+ for (let y = 0; y < this.currentStation.data[y].length; y++) {
|
|
|
+ if (this.currentStation.data[x][y]['code'] === code) return true;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return bool;
|
|
|
+ },
|
|
|
+ removeMaterialBox(x,y){
|
|
|
+ this.$set(this.currentStation.data[x][y],'code',null);
|
|
|
+ },
|
|
|
+ /** 监听 【灭灯】 */
|
|
|
+ _listenBroadcast() {
|
|
|
+ initEcho();
|
|
|
+ if(this.currentEcho)this.currentEcho.disconnect();
|
|
|
+ this.currentEcho = window.Echo.channel(this.broadcastName).listen(this.channelName, (msg) => {
|
|
|
+ let json = JSON.parse(msg.json);
|
|
|
+ if (!json || json.length === 0) return;
|
|
|
+ this.removeMaterialBox(json['x'],json['y']);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ }
|
|
|
+ })
|
|
|
+ </script>
|
|
|
+@endsection
|
|
|
+
|