自动化立库仓库-WCS系统
blame | 历史 | 补丁 | 提交 | 提交对比 | show whitespace
#fs
lsh
2024-09-10 e68337c482ca97a32dafdeb87c164f44378fb473 
 src/main/webapp/views/index.html


@@ -1,9 +1,11 @@


<!DOCTYPE html>


<html>


<html lang="en">


<head>


    <meta charset="utf-8">


    <meta name="viewport" content="width=device-width, initial-scale=1.0">


    <title>环形穿梭车智能页面</title>


    <title>环形穿梭车智能系统</title>


    <link rel="stylesheet" href="../static/css/element.css">


    <script type="text/javascript" src="../static/js/jquery/jquery-3.3.1.min.js"></script>


    <script type="text/javascript" src="../static/js/common.js"></script>


    <script type="text/javascript" src="../static/js/vue.min.js"></script>


    <script type="text/javascript" src="../static/js/element.js"></script>


    <style>


@@ -76,7 +78,6 @@


    </style>


</head>


<body>




<!--<header>-->


<!--    环形穿梭车智能系统-->


<!--</header>-->


@@ -85,47 +86,47 @@


    <div class="outer-ring"></div>




    <!-- Stations on outer ring -->


    <div class="station" style="top: -10px; left: 50%;">1</div>


    <div class="station" style="top: 30%; left: 100%;">2</div>


    <div class="station" style="top: 70%; left: 100%;">3</div>


    <div class="station" style="top: 110%; left: 50%;">4</div>


    <div class="station" style="top: 70%; left: 0;">5</div>


    <div class="station" style="top: 30%; left: 0;">6</div>


<!--        <div class="station" style="top: -10px; left: 50%;">1</div>-->


<!--        <div class="station" style="top: 30%; left: 100%;">2</div>-->


<!--        <div class="station" style="top: 70%; left: 100%;">3</div>-->


<!--        <div class="station" style="top: 110%; left: 50%;">4</div>-->


<!--        <div class="station" style="top: 70%; left: 0;">5</div>-->


<!--        <div class="station" style="top: 30%; left: 0;">6</div>-->




    <!-- Stations on inner ring -->


    <div class="station" style="top: 5%; left: 50%;">7</div>


    <div class="station" style="top: 25%; left: 80%;">8</div>


    <div class="station" style="top: 75%; left: 80%;">9</div>


    <div class="station" style="top: 95%; left: 50%;">10</div>


    <div class="station" style="top: 75%; left: 20%;">11</div>


    <div class="station" style="top: 25%; left: 20%;">12</div>


<!--        <div class="station" style="top: 5%; left: 50%;">7</div>-->


<!--        <div class="station" style="top: 25%; left: 80%;">8</div>-->


<!--        <div class="station" style="top: 75%; left: 80%;">9</div>-->


<!--        <div class="station" style="top: 95%; left: 50%;">10</div>-->


<!--        <div class="station" style="top: 75%; left: 20%;">11</div>-->


<!--        <div class="station" style="top: 25%; left: 20%;">12</div>-->


        <div v-for="station in tableDataDev" class="station" :style="{ top: station.valueX + '%', left: station.valueY + '%' }">{{ station.index }}</div>






    <!-- Buses -->


    <div class="bus" style="top: 15%; left: 60%;">A</div>


    <div class="bus" style="top: 45%; left: 85%;">B</div>


    <div class="bus" style="top: 80%; left: 55%;">C</div>


    <div class="bus" style="top: 65%; left: 25%;">D</div>


    <div class="bus" style="top: 45%; left: 35%;">E</div>


        <div v-for="bus in tableDataRgv" class="bus" :style="{ top: bus.valueX + '%', left: bus.valueY + '%' }">{{ bus.index }}</div>


</div>




</body>


<script>


    var app = new Vue({


        el: '#app',


        data: {


            ringThroughringThrough: [],


                tableDataRgv: [],


                tableDataDev: [],


            addWeekPlanDataWeeklySign: [


                {


                    value: '1',


                    label: '上周'


                        index: 1,


                        valueX: 50,


                        valueY: 96.5


                },


                {


                    value: '2',


                    label: '本周'


                        index: 2,


                        valueX: 0,


                        valueY: 0


                },


                {


                    value: '3',


                    label: '下周'


                        index: 3,


                        valueX: 80,


                        valueY: 55


                }


            ]


        },


@@ -133,28 +134,47 @@


            this.init();


        },


        watch: {


            filterText(val) {


                this.$refs.tree.filter(val);


            }


        },


        computed:{


            // cstmrLabel () {


            //     return (val) => {


            //         let item = this.options.find(o => o.value === val);


            //         return item ? item.label : 'Item not found';


            //     }


            // }




        },


        methods: {


            init(){


                let that = this


                    this.getTableDataRgv()


                    this.getTableDataDev()




                    setInterval(() => {


                        this.getTableDataRgv()


                        this.getTableDataDev()


                    }, 1000)


                },


                getTableDataRgv() {


                    let that = this;


                $.ajax({


                    url: baseUrl + '/weekly/list/auth',


                    headers: {'token': localStorage.getItem('token')},


                    method: "get",


                    success: (res) => {


                        that.tableData = res.data.records;


                        console.log(that.tableData)


                        url: baseUrl + "/rgv/ring/through/rgv/position/data",


                        headers: {


                            'token': localStorage.getItem('token')


                        },


                        data: {},


                        dataType: 'json',


                        contentType: 'application/json;charset=UTF-8',


                        method: 'post',


                        success: function (res) {


                            that.tableDataRgv = res.data


                        }


                    });


                },


                getTableDataDev() {


                    let that = this;


                    $.ajax({


                        url: baseUrl + "/rgv/ring/through/dev/position/data",


                        headers: {


                            'token': localStorage.getItem('token')


                        },


                        data: {},


                        dataType: 'json',


                        contentType: 'application/json;charset=UTF-8',


                        method: 'post',


                        success: function (res) {


                            that.tableDataDev = res.data


                    }


                });


            }


@@ -162,4 +182,6 @@


    })




</script>


</body>




</html>