加拿大MES项目
blame | 历史 | 补丁 | 提交 | 提交对比 | show whitespace
clll
2023-09-18 25e25deb11253e83f61835a39ae1da8b6f4e400d 
 CanadaMes-ui/src/views/home/index.vue


@@ -62,17 +62,17 @@


    height: 35px;



    



    position: absolute;



    width: 3.07px;



    width: 3.08px;



    /* width: 4.22px; */



}







.gezi:nth-child(22),



/* .gezi:nth-child(22),



.gezi:nth-child(43),



.gezi:nth-child(64),



.gezi:nth-child(85) {



    margin-left: 7px;



    /* margin-left: 10px; */



}



    margin-left: 10px;



} */















@@ -176,6 +176,10 @@


        transform: translateX(-150%);



    }



}







.el-dialog{



    width: 80%;



}



</style>



<template>



    <el-container>



@@ -183,7 +187,7 @@


        <el-main>



            <div class="box" @click="dialogFormVisible2 = true">



                <div class="text">



                    Alarm:



                    <!-- Alarm: -->



                    <label v-for="item in this.alarm" :key="item['id']">



                        {{ item['content'] }}



                    </label>



@@ -241,46 +245,49 @@


        <el-footer>



            <div class="blocks" style="position: relative;">



                <div style="display:flex;position: absolute;float:left;z-index: 999;top:102px;left:237px;">



                    <div :class="getStatusClass(item.state)" v-for="item in cagelist1" :key="item['date']"



                        :style="{ height: 35 * item['glassWidth'] + 'px' }" @click="showcageinfo(item['cage'])"></div>



                    <div :class="getStatusClass(item.state)" v-for="(item, index) in cagelist1" :key="item['date']"



                        :style="{ height: 35 * item['glassWidth'] + 'px', left: 3.07 * index + Math.abs(item['cage'] - 10) * 6.8 + 'px' }"



                        @click="showcageinfo(item['cage'])"></div>



                </div>



                <div style="display:flex;position: absolute;float:left;z-index: 999;top:102px;left:640px;">



                    <div :class="getStatusClass(item.state)" v-for="item in cagelist2" :key="item['date']"



                        :style="{ height: 35 * item['glassWidth'] + 'px' }" @click="showcageinfo(item['cage'])"></div>



                    <div :class="getStatusClass(item.state)" v-for="(item, index) in cagelist2" :key="item['date']"



                        :style="{ height: 35 * item['glassWidth'] + 'px', left: 3.07 * index + Math.abs(item['cage'] - 5) * 6.8 + 'px' }"



                        @click="showcageinfo(item['cage'])"></div>



                </div>



                <div style="display:flex;position: absolute;float:left;z-index: 999;top:139px;left:237px;">



                    <div :class="getStatusClass(item.state)" v-for="item in cagelist3" :key="item['date']"



                        :style="{ height: 35 * item['glassWidth'] + 'px', top: item['width'] * 35 - 35 + 'px' }"



                    <div :class="getStatusClass(item.state)" v-for="(item, index) in cagelist3" :key="item['date']"



                        :style="{ height: 35 * item['glassWidth'] + 'px', top: item['width'] * 35 - 35 + 'px', left: 3.07 * index + Math.abs(item['cage'] - 10) * 6.8 + 'px' }"



                        @click="showcageinfo(item['cage'])">



                    </div>



                </div>



                <div style="display:flex;position: absolute;float:left;z-index: 999;top:139px;left:640px;">



                    <div :class="getStatusClass(item.state)" v-for="item in cagelist4" :key="item['date']"



                        :style="{ height: 35 * item['glassWidth'] + 'px', top: item['width'] * 35 - 35 + 'px' }"



                    <div :class="getStatusClass(item.state)" v-for="(item, index) in cagelist4" :key="item['date']"



                        :style="{ height: 35 * item['glassWidth'] + 'px', top: item['width'] * 35 - 35 + 'px', left: 3.07 * index + Math.abs(item['cage'] - 5) * 6.8 + 'px' }"



                        @click="showcageinfo(item['cage'])"></div>



                </div>



                <div class="blue gezi" :style="{display:flex,position: absolute,float:left,top: 105 +'px',left: 1050 +'px',height: loadglassheight+'px',width: 5+'px'}"></div>



                <div class="blocks-img" :style="{ left: car1 + 'px', top: '16px' }"></div>



                <div class="blocks-img" :style="{ left: car2 + 'px', top: '175px' }"></div>



                <div class="blocks-img2"></div>



                <div class="blocks-img3"></div>



                <!-- <div style="display:flex;position: absolute;float:left;z-index: 999;top:112px;left:328px;">



                    <div :class="getStatusClass(item.state)" v-for="item in cagelist1" :key="item['date']"



                        :style="{ height: 35 * item['glassWidth'] + 'px' }"



                    <div :class="getStatusClass(item.state)" v-for="(item,index) in cagelist1" :key="item['date']"



                        :style="{ height: 35 * item['glassWidth'] + 'px',left:4.22*index+'px' }"



                        @click="showcageinfo(item['cage'])"></div>



                </div>



                <div style="display:flex;position: absolute;float:left;z-index: 999;top:112px;left:885px;">



                    <div :class="getStatusClass(item.state)" v-for="item in cagelist2" :key="item['date']"



                        :style="{ height: 35 * item['glassWidth'] + 'px' }"



                    <div :class="getStatusClass(item.state)" v-for="(item,index) in cagelist2" :key="item['date']"



                        :style="{ height: 35 * item['glassWidth'] + 'px',left:4.22*index+'px' }"



                        @click="showcageinfo(item['cage'])"></div>



                </div>



                <div style="display:flex;position: absolute;float:left;z-index: 999;top:154px;left:328px;">



                    <div :class="getStatusClass(item.state)" v-for="item in cagelist3" :key="item['date']"



                        :style="{ height: 35 * item['glassWidth'] + 'px', top: item['width'] * 35 - 35 + 'px' }"



                    <div :class="getStatusClass(item.state)" v-for="(item,index) in cagelist3" :key="item['date']"



                        :style="{ height: 35 * item['glassWidth'] + 'px', top: item['width'] * 35 - 35 + 'px',left:4.22*index+'px' }"



                        @click="showcageinfo(item['cage'])"></div>



                </div>



                <div style="display:flex;position: absolute;float:left;z-index: 999;top:154px;left:885px;">



                    <div :class="getStatusClass(item.state)" v-for="item in cagelist4" :key="item['date']"



                        :style="{ height: 35 * item['glassWidth'] + 'px', top: item['width'] * 35 - 35 + 'px' }"



                    <div :class="getStatusClass(item.state)" v-for="(item,index) in cagelist4" :key="item['date']"



                        :style="{ height: 35 * item['glassWidth'] + 'px', top: item['width'] * 35 - 35 + 'px',left:4.22*index+'px' }"



                        @click="showcageinfo(item['cage'])"></div>



                </div>



                <div class="blocks-img" :style="{ left: car1 + 'px', top: '16px' }"></div>



@@ -337,14 +344,14 @@


        </el-dialog>



        <el-dialog :visible.sync="dialogFormVisible3" :title="$t('Cage Details')">



            <el-table :data="this.cageinfo" :height="700" border style="width: 100%;overflow: auto;">



                <el-table-column :width="150" prop="cage" :label="$t('The Cage number')"></el-table-column>



                <el-table-column prop="cage" :label="$t('The Cage number')"></el-table-column>



                <el-table-column prop="cell" :label="$t('cell')"></el-table-column>



                <el-table-column prop="tier" :label="$t('tier')"></el-table-column>



                <el-table-column prop="glassId" :label="$t('glassid')"></el-table-column>



                <el-table-column :width="130" prop="orderId" :label="$t('order number')"></el-table-column>



                <el-table-column :width="150" prop="lengthWidth" :label="$t('Length and width')"></el-table-column>



                <el-table-column prop="orderId" :label="$t('order number')"></el-table-column>



                <el-table-column prop="lengthWidth" :label="$t('Length and width')"></el-table-column>



                <el-table-column prop="coating" :label="$t('coating')"></el-table-column>



                <el-table-column :width="140" :label="$t('Operate')">



                <el-table-column :label="$t('Operate')">



                    <template slot-scope='scope'>



                        <el-button type="primary" style="padding: 4px 10px;font-size: 12px;"



                            @click="deleteglass(scope.row.glassId, scope.row.state)">{{ $t('delete') }}</el-button>



@@ -360,7 +367,7 @@


</template>



<script>







import { home, home2, loadtask, InsertOrder, Addglassid, UpdateTask, SelectAlarmmgInfo, SelectCageInfo, DeleteByGlassID, OutByGlassID } from "../../api/home";



import { home, home2, loadtask, InsertOrder, Addglassid, UpdateTask, SelectAlarmmgInfo, SelectCageInfo, DeleteByGlassID, OutByGlassID, Loadcarlist } from "../../api/home";











import LanguageMixin from '../../lang/LanguageMixin'



@@ -397,12 +404,14 @@


            order: "",



            glassid: "",



            url: "../../img/bigcar01.png",



            car1: 107,



            car2: 175,



            // car1: 150,



            // car2: 242,



            car1: 145,



            car2: 210,



            // car1: 210,



            // car2: 300,



            cageinfo: [],



            cage: 0



            cage: 0,



            carlist: [],



            loadglassheight:0



        };



    },



    created() {



@@ -434,10 +443,11 @@


                    //console.log("收到数据====" + msg.data);



                    let obj = JSON.parse(msg.data);



                    if (obj.params != null) {



                        this.car1 = 107 + 17.62 * obj.params[0][0]/1000;



                        this.car2 = 175 + 17.62 * obj.params[0][1]/1000;



                        // this.car1 = 150 + 24.6 * obj.params[0][0]/1000;



                        // this.car2 = 242 + 24.6 * obj.params[0][1]/1000;



                        this.car1 = 145 + 8.1 * Math.abs(obj.params[0][0] - this.carlist[0]['start']) / Math.abs(this.carlist[0]['end'] - this.carlist[0]['start']) * 100;



                        this.car2 = 210 + 8.25 * Math.abs(obj.params[0][1] - this.carlist[1]['start']) / Math.abs(this.carlist[1]['end'] - this.carlist[1]['start']) * 100;



                        // this.car1 = 210 + 11.25 * (obj.params[0][1]-this.carlist[1]['start'])/(this.carlist[1]['end']-this.carlist[1]['start'])*100;



                        // this.car2 = 300 + 11.25 * (obj.params[0][1]-this.carlist[1]['start'])/(this.carlist[1]['end']-this.carlist[1]['start'])*100;



                        console.log(obj.params[0][1], this.carlist[1]['start']);



                    }



                    this.tableData = obj.tableData[0];



                    this.cagelist1 = obj.cagelist1[0];



@@ -447,7 +457,7 @@


                    this.tasklist1 = obj.tasklist1[0];



                    this.tasklist2 = obj.tasklist2[0];



                    this.alarm = obj.alarmmg[0];







                    this.loadglassheight=obj.loadglassheight;



                    SelectCageInfo(this.cage).then(res => {



                        this.cageinfo = res.data.cageinfo;



                    });



@@ -486,15 +496,17 @@


                if (res.data.list.length > 0) {



                    this.outcell = this.tasklist2[0]['cell'];



                }







            });



            loadtask(this.task2).then(res => {



                this.tasklist2 = res.data.list;







            });



            SelectAlarmmgInfo().then(res => {



                this.alarm = res.data.alarmmg;



            });



            Loadcarlist().then(res => {



                this.carlist = res.data.carlist;



                console.log(this.carlist);



            });



        },



        //根据格子状态修改颜色



        getStatusClass(state) {