Merge branch 'master' of http://10.153.19.25:10101/r/Albania_Mes

严智鑫

2024-03-19 1da9aafdf0d7fe00a6a91483cd4bdd5283dff0e1

 Albania_Mes-ui/src/views/home/index.vue

@@ -6,7 +6,7 @@

.occupy {
    height: 100%;
    width: 10%;
    width: 20%;
    background-color: white;
    margin: 0px 8px 0px 8px;
    border: 1px #EBEEF5 solid;
@@ -64,15 +64,16 @@
}

.blocks {
    background-image: url('../../img/xmjc.png');
    margin: 0 auto;
    background-image: url('../../img/device.png');
    /* margin: 0 auto; */
    /* clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%); */
    background-repeat: no-repeat;
    background-attachment: local;
    min-height: 55vh;
    width: 1400px;
    max-width: 94vw;
    background-size: 1200px 510px;
    margin: 0 auto;
    min-height: 118vh;
    width: 1124px;
    max-width: 57%;
    background-size: 1050px 1400px;
    margin-top: -280px;
    /* width: 1660px;
    max-width: 100vw;
    background-size: 1660px 560px; */
@@ -198,12 +199,13 @@
    font-size: 25px;
}

/* 
@media screen and (min-width: 1900px) {
    .blocks {
        transform: scale(1.5, 1.05);
        width: 1210px;
    }
}
} */

.el-message-box__btns {
    padding: 0px 15px 0;
@@ -235,6 +237,74 @@
    height: 15px;
    position: absolute;
}
/*

*/
#fileinput .container {
  width: 800px;
  margin: 0 auto;
}

#fileinput .header {
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px;
}

#fileinput table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid;
}

#fileinput tr,
#fileinput th,
#fileinput td {
  border: 1px solid #000;
  padding: 5px;
}

#fileinput button {
  border: none;
  padding: 5px;
  background-color: #00a297;
  color: #fff;
  border-radius: 5px;
  cursor: pointer;
  margin: 0 5px;
}

#fileinput tr:nth-child(2n) {
  background-color: #dcdcdc;
}

#fileinput .hide {
  display: none;
}

#fileinput .c1 {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, .5);
  z-index: 2;
}

#fileinput .c2 {
  background-color: white;
  position: fixed;
  width: 400px;
  height: 300px;
  top: 50%;
  left: 50%;
  z-index: 3;
  margin-top: -150px;
  margin-left: -200px;
}


</style>
<template>
    <el-container>
@@ -249,229 +319,302 @@
                    </label>
                </div>
            </div>
            <div style="display:flex;justify-content: space-around;width: 9zz5%;margin: 0 auto;">
                <el-button type="primary" @click="showform(1)" :disabled="SoftEmergencyStopState"
            <div style="display:flex;justify-content: space-around;width: 95%;margin: 0 auto;">
                <el-button type="primary" @click="showform(1)" :disabled="SoftEmergencyStopState" style="z-index: 999;"
                    :class="SoftEmergencyStopState == true ? 'hide' : ''">
                    {{ $t('Import order') }}</el-button>
                <el-button type="primary" @click="showform(2)" :disabled="SoftEmergencyStopState"

                <el-button type="primary" @click="showform(2)" :disabled="SoftEmergencyStopState" style="z-index: 999;"
                    :class="SoftEmergencyStopState == true ? 'hide' : ''">
                    {{ $t('Measure') }}</el-button>
                <el-button type="primary" @click="showform(2)" :disabled="SoftEmergencyStopState"

                <el-button type="primary" @click="showform(3)" :disabled="SoftEmergencyStopState" style="z-index: 999;"
                    :class="SoftEmergencyStopState == true ? 'hide' : ''">
                    {{ $t('StorageCage') }}</el-button>
                <el-button type="primary" @click="showform(2)" :disabled="SoftEmergencyStopState"
                <el-button type="primary" @click="showform(4)" :disabled="SoftEmergencyStopState" style="z-index: 999;"
                    :class="SoftEmergencyStopState == true ? 'hide' : ''">
                    {{ $t('Task queue') }}</el-button>
            </div>
            <div>
                <el-table :data="this.tasklist1" border style="width: 100%">
                    <el-table-column :min-width="180" prop="glassId" :label="$t('Outfeed glass barcode')"></el-table-column>
                    <el-table-column :min-width="130" prop="cage" :label="$t('Cage No')"></el-table-column>
                    <el-table-column :min-width="130" prop="cell" :label="$t('Slot No')"></el-table-column>
                    <el-table-column :min-width="130" prop="orderId" :label="$t('Order No')"></el-table-column>
                    <el-table-column prop="orderId" :label="$t('List No')"></el-table-column>
                    <el-table-column prop="orderId" :label="$t('Box No')"></el-table-column>
                    <el-table-column :min-width="150" prop="lengthWidth" :label="$t('Dim')">
                        <template slot-scope='scope'>
                            {{ scope.row.glasswidthmm }}*{{ scope.row.glassheightmm }}
                        </template>
                    </el-table-column>
                    <el-table-column :label="$t('Terminate Task')">
                        <template slot-scope='scope'>
                            <el-button type="primary" style="padding: 4px 10px;font-size: 12px;"
                                @click="endtask(1, scope.row.glassId, scope.row.cell)">{{ $t('Terminate Task')
                                }}</el-button>
                        </template>
                    </el-table-column>
                </el-table>
                <el-table :data="this.tasklist2" border style="width: 100%">
                    <el-table-column :min-width="180" prop="glassId" :label="$t('Infeed glass barcode')"></el-table-column>
                    <el-table-column :min-width="130" prop="cage" :label="$t('Cage No')"></el-table-column>
                    <el-table-column :min-width="130" prop="cell" :label="$t('Slot No')"></el-table-column>
                    <el-table-column :min-width="130" prop="orderId" :label="$t('Order No')"></el-table-column>
                    <el-table-column prop="orderId" :label="$t('List No')"></el-table-column>
                    <el-table-column prop="orderId" :label="$t('Box No')"></el-table-column>
                    <el-table-column :min-width="150" prop="lengthWidth" :label="$t('Dim')">
                        <template slot-scope='scope'>
                            {{ scope.row.glasswidthmm }}*{{ scope.row.glassheightmm }}
                        </template>
                    </el-table-column>

                    <el-table-column :label="$t('Terminate Task')">
                        <template slot-scope='scope'>
                            <el-button type="primary" style="padding: 4px 10px;font-size: 12px;"
                                @click="endtask(0, scope.row.glassId, scope.row.cell)">{{ $t('Terminate Task')
                                }}</el-button>
                        </template>
                    </el-table-column>
                </el-table>
            </div>
            <div style="padding: 10px;display: flex;height:85px;">
                <div v-for="item in tableData" :key="item['cageno']" class="occupy">
                    <el-col style="text-align:left;font-weight: bold;">#{{ item['cage'] }}</el-col>
                    <el-col style="text-align:left;display:flex;justify-content: space-between;align-items: center;">
                        <span class="biao">{{ $t('Usage') }}</span><span class="zhi">{{ item['cell'] }}%</span>
                    </el-col>
                    <hr style="width:80%;margin: 0 auto;" />
                    <el-col style="text-align:left;display:flex;justify-content: space-between;align-items: center;">
                        <span class="biao">{{ $t('Space (Pieces)') }}</span><span class="zhi">{{ item['state'] }}</span>
                    </el-col>
            <div style="display: flex;align-items: center;">
                <div class="blocks" style="position: relative;width: 100%;">

                </div>
                <div>
                    <div style="padding: 10px;display: flex;height:100px;">
                        <div v-for="item in tableData" :key="item['cageno']" class="occupy">
                            <el-col style="text-align:left;font-weight: bold;">#{{ item['cage'] }}</el-col>
                            <el-col
                                style="text-align:left;display:flex;justify-content: space-between;align-items: center;">
                                <span class="biao">{{ $t('Usage') }}</span><span class="zhi">{{ item['cell'] }}%</span>
                            </el-col>
                            <hr style="width:80%;margin: 0 auto;" />
                            <el-col
                                style="text-align:left;display:flex;justify-content: space-between;align-items: center;">
                                <span class="biao">{{ $t('Space (Pieces)') }}</span><span class="zhi">{{ item['state']
                                    }}</span>
                            </el-col>
                        </div>
                    </div>
                    <el-table :data="this.tasklist1" border style="width: 700px;">
                        <el-table-column prop="glasstype" :label="$t('Glasstype')"></el-table-column>
                        <el-table-column prop="storageCage.cage" :label="$t('Cage No')"></el-table-column>
                        <el-table-column prop="storageCage.cell" :label="$t('Slot No')"></el-table-column>
                        <el-table-column prop="storageCage.glassWidth" :label="$t('Width')"></el-table-column>
                        <el-table-column prop="storageCage.glassHeight" :label="$t('Height')"></el-table-column>
                        <el-table-column prop="storageCage.thickness" :label="$t('Thickness')"></el-table-column>
                        <el-table-column prop="storageCage.films" :label="$t('Films')"></el-table-column>
                        <el-table-column :min-width="100" :label="$t('Terminate Task')">
                            <template slot-scope='scope'>
                                <el-button type="primary" style="padding: 4px 10px;font-size: 12px;"
                                    @click="FinishTask(0, scope.row.id)">{{ $t('Complete') }}</el-button>
                            </template>
                        </el-table-column>
                    </el-table>
                    <el-table :data="this.tasklist2" border style="width: 100%">
                        <el-table-column prop="glassId" :label="$t('Glasstype')"></el-table-column>
                        <el-table-column prop="storageCage.cage" :label="$t('Cage No')"></el-table-column>
                        <el-table-column prop="storageCage.cell" :label="$t('Slot No')"></el-table-column>
                        <el-table-column prop="storageCage.glassWidth" :label="$t('Width')"></el-table-column>
                        <el-table-column prop="storageCage.glassHeight" :label="$t('Height')"></el-table-column>
                        <el-table-column prop="storageCage.thickness" :label="$t('Thickness')"></el-table-column>
                        <el-table-column prop="storageCage.films" :label="$t('Films')"></el-table-column>

                        <el-table-column :min-width="100" :label="$t('Terminate Task')">
                            <template slot-scope='scope'>
                                <el-button type="primary" style="padding: 4px 10px;font-size: 12px;"
                                    @click="FinishTask(1, scope.row.id)">{{ $t('Complete') }}</el-button>
                            </template>
                        </el-table-column>
                    </el-table>
                </div>
            </div>


        </el-main>
        <el-dialog :visible.sync="Importorder" :title="$t('Importorder')"
            top="5vh">
        </el-dialog>
        <el-dialog :visible.sync="Measure" :title="$t('Measure')"
            top="5vh">
        </el-dialog>
        <el-dialog :visible.sync="StorageCage" :title="$t('StorageCage')"
            top="5vh">
        </el-dialog>
        <el-dialog :visible.sync="Taskqueue" :title="$t('Taskqueue')"
            top="5vh">
        </el-dialog>
        <!-- <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, 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, 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, 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'])">
        <el-dialog :visible.sync="Importorder" :title="$t('Import order')" top="5vh">
            <!--文件导入数据页面-->
            <div id="fileinput" class="container">
                <div class="header">
                    <div class="btn">
                        <button @click="AllAdd">保存</button>
                    </div>
                    <div class="inp">
                        <input type="file" id="uploadExcel" multiple @change="Change" />
                    </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, 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: 28 + 'px', left: 1050 + 'px', height: loadglassheight1 + 'px', width: 4 + 'px' }">
                </div>
                <div class="blue gezi"
                    :style="{ display: 'flex', position: 'absolute', float: 'left', top: 105 + 'px', left: 1050 + 'px', height: loadglassheight2 + 'px', width: 4 + 'px' }">
                </div>
                <table id="table">
                    <thead>
                        <tr>
                            <th>Customer</th>
                            <th>order</th>
                            <th>base</th>
                            <th>height</th>
                            <th>thickness</th>
                            <th>films</th>
                            <th>quantity</th>
                            <th>tier</th>
                            <th>matching</th>
                            <th>glasstype</th>
                            <th>productname</th>
                        </tr>
                    </thead>
                    <tbody style="text-align: center">
                        <tr v-for="item in dataList" :key="item.id">
                            <!-- <td>{{ item[0] }}</td>
                            <td>{{ item[1] }}</td>
                            <td>{{ item[2] }}</td>
                            <td>{{ item[3] }}</td>
                            <td>{{ item[4] }}</td>
                            <td>{{ item[5] }}</td>
                            <td>{{ item[6] }}</td>
                            <td>{{ item[7] }}</td>
                            <td>{{ item[8] }}</td>
                            <td>{{ item[9] }}</td>
                            <td>{{ item[10] }}</td> -->
                            <td>{{ item.Customer }}</td>
                            <td>{{ item.order }}</td>
                            <td>{{ item.base }}</td>
                            <td>{{ item.height }}</td>
                            <td>{{ item.thickness }}</td>
                            <td>{{ item.films }}</td>
                            <td>{{ item.quantity }}</td>
                            <td>{{ item.tier }}</td>
                            <td>{{ item.matching}}</td>
                            <td>{{ item.glasstype }}</td>
                            <td>{{ item.productname }}</td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </el-dialog>

                <div class="blocks-img2"></div>
                <div class="blocks-img3"></div>
        <el-dialog :visible.sync="Measure" :title="$t('Measure')" top="5vh"><!--测量页面-->
            <!--测量页面主体-->
            <div>
                <!--功能-->
                <div>
                    <el-button type="primary" @click="ManualMatching()" :disabled="SoftEmergencyStopState"
                        style="z-index: 999;">人工匹配</el-button>
                    <el-button type="primary" @click="ManualTake()" :disabled="SoftEmergencyStopState"
                        style="z-index: 999;">人工匹配</el-button>
                </div>
                <!--显示-->
                <div style="width:1000px;height: 720px;border: 2px solid #d1d1d1;margin: auto auto;">
                    <!--玻璃图  #81b337-->
                    <div :style="'top:10px;bottom: 10px;left: 10px;right: 10px;margin: auto;position:absolute;width:'
                + (this.LastQueue.glasswidth / 25 * 7) + 'px;height:'
                + (this.LastQueue.glassheight / 25 * 7) + 'px;line-height: '
                + (this.LastQueue.glassheight / 25 * 7) + 'px;background-color: #93d2f3;text-align: center;'">
                        {{ this.LastQueue.glasswidth }}*{{ this.LastQueue.glassheight }}
                    </div>

                <div class="device" :style="'top: 25px;left: 1027px;background-color: ' + ShowDeviceList(0) + ';'">D01</div>
                <div class="device" :style="'top: 105px;left: 1027px;background-color: ' + ShowDeviceList(1) + ';'">D02
                </div>
                <div class="device" :style="'top: 102px;left: 605px;background-color: ' + ShowDeviceList(2) + ';'">B01</div>
                <div class="device" :style="'top: 102px;left: 197px;background-color: ' + ShowDeviceList(3) + ';'">B02</div>
                <div class="blocks-img" :style="'left:' + car2 + 'px;top:175px;background-color:' + ShowDeviceList(4) + ''">
                    A01</div>
                <div class="blocks-img" :style="'left:' + car1 + 'px;top:16px;background-color:' + ShowDeviceList(5) + ''">
                    A02</div>
                <div class="device" :style="'top: 108px;left: 150px;background-color: ' + ShowDeviceList(6) + ';'">D03</div>
                <div class="device" :style="'top: 185px;left: 150px;background-color: ' + ShowDeviceList(7) + ';'">D04</div>
                <div class="device" :style="'top: 262px;left: 150px;background-color: ' + ShowDeviceList(8) + ';'">D05</div>
                <div class="device" :style="'top: 339px;left: 150px;background-color: ' + ShowDeviceList(9) + ';'">D06</div>

                <div class="device" :style="'top: 395px;left: 90px;background-color: ;'">E01</div>
                <div class="device" :style="'top: 395px;left: 243px;background-color: ;'">E02</div>
                <div class="device" :style="'top: 395px;left: 395px;background-color: ;'">E03</div>
                <div class="device" :style="'top: 345px;left: 655px;background-color: ;'">E04</div>
                <div class="device" :style="'top: 345px;left: 810px;background-color: ;'">E05</div>
                <div class="device" :style="'top: 345px;left: 960px;background-color: ;'">E06</div>

                <div class="device" :style="'top: 345px;left: 525px;background-color: ;'">J01</div>
                <div class="device" :style="'top: 345px;left: 1100px;background-color: ;'">F01</div>
                <div class="device" :style="'top: 275px;left: 1100px;background-color: ;'">G01</div>

                <div class="glass D01" style="top: 39px;left: 1055px;position: absolute;">{{ ShowGlassIdList(0) }}
                    <br />
                    <el-button type="primary" size="mini" @click="ClearGlassId('DB101.9.2', 0)">
                        {{ $t('Clear') }}</el-button>
                </div>
                <div class="glass D02" style="top: 117px;left: 1055px;position: absolute;">{{ ShowGlassIdList(1) }}
                    <br />
                    <el-button type="primary" size="mini" @click="ClearGlassId('DB101.9.2', 1)">
                        {{ $t('Clear') }}</el-button>
                </div>
                <div class="glass B01" style="top: 270px;left: 640px;position: absolute;">
                    B01:{{ ShowGlassIdList(2) }}
                    <br />
                    <el-button type="primary" size="mini" @click="ClearGlassId('DB101.10.2', 2)">
                        {{ $t('Clear') }}</el-button>
                </div>
                <div class="glass B02" style="top: 315px;left: 640px;position: absolute;">B02:{{ ShowGlassIdList(3) }}
                    <br />
                    <el-button type="primary" size="mini" @click="ClearGlassId('DB101.10.3', 3)">
                        {{ $t('Clear') }}</el-button>
                </div>
                <div class="glass A01" style="top: 270px;left: 289px;position: absolute;">
                    A01.1:{{ ShowGlassIdList(4) }}
                    <br />
                    <el-button type="primary" size="mini" @click="ClearGlassId('DB101.10.0', 4)">
                        {{ $t('Clear') }}</el-button>
                </div>

                <div class="glass A01" style="top: 315px;left: 289px;position: absolute;">A01.2:{{ ShowGlassIdList(5) }}
                    <br />
                    <el-button type="primary" size="mini" @click="ClearGlassId('DB101.10.0', 5)">
                        {{ $t('Clear') }}</el-button>
                </div>

                <div class="glass A02" style="top: 360px;left: 289px;position: absolute;">A02:{{ ShowGlassIdList(6) }}
                    <br />
                    <el-button type="primary" size="mini" @click="ClearGlassId('DB101.10.1', 6)">
                        {{ $t('Clear') }}</el-button>
                </div>

                <div class="glass D03" style="top: 122px;left: 42px;position: absolute;">
                    {{ ShowGlassIdList(7) }}
                    <br />
                    <el-button type="primary" size="mini" @click="ClearGlassId('DB101.9.4', 7)">
                        {{ $t('Clear') }}</el-button>
                </div>
                <div class="glass D04" style="top: 198px;left: 42px;position: absolute;">
                    {{ ShowGlassIdList(8) }}
                    <br />
                    <el-button type="primary" size="mini" @click="ClearGlassId('DB101.9.5', 8)">
                        {{ $t('Clear') }}</el-button>
                </div>
                <div class="glass D05" style="top: 275px;left: 42px;position: absolute;">
                    {{ ShowGlassIdList(9) }}
                    <br />
                    <el-button type="primary" size="mini" @click="ClearGlassId('DB101.9.6', 9)">
                        {{ $t('Clear') }}</el-button>
                </div>
                <div class="glass D06" style="top: 352px;left: 42px;position: absolute;">
                    {{ ShowGlassIdList(10) }}
                    <br />
                    <el-button type="primary" size="mini" @click="ClearGlassId('DB101.9.5', 10)">
                        {{ $t('Clear') }}</el-button>
                </div>
            </div>
        </el-footer> -->
        </el-dialog>

        <el-dialog :visible.sync="StorageCage" :title="$t('StorageCage')" top="5vh">
            <el-table :data="this.StorageCageInfo" :height="700" border style="width: 100%;overflow: auto;">
                <el-table-column :min-width="80" prop="cage" :label="$t('Cage No')"></el-table-column>
                <el-table-column :min-width="80" prop="cell" :label="$t('Slot No')"></el-table-column>
                <el-table-column :min-width="80" prop="glasstype" :label="$t('GlassType')"></el-table-column>
                <el-table-column :min-width="80" prop="glassWidth" :label="$t('Width')"></el-table-column>
                <el-table-column :min-width="80" prop="glassHeight" :label="$t('Height')"></el-table-column>
                <el-table-column :min-width="80" prop="thickness" :label="$t('Thickness')"></el-table-column>
                <el-table-column :min-width="80" prop="number" :label="$t('number')"></el-table-column>
                <el-table-column :min-width="80" prop="width" :label="$t('Width')"></el-table-column>
                <el-table-column :min-width="250" :label="$t('Operate')">
                    <template slot-scope='scope'>

                        <el-button type="primary" style="padding: 4px 10px;font-size: 12px;"
                            @click="UpdateDisabled(scope.row.cage, scope.row.cell, scope.row.disabled == 0 ? 1 : 0)">
                            {{ scope.row.disabled == 0 ? $t('Disable') : $t('Enable') }}</el-button>

                        <el-button type="primary" style="padding: 4px 10px;font-size: 12px;"
                            :disabled="(scope.row.width < scope.row.glassWidth + 100 ? true : false)"
                            @click="UpdateStroageCageByCell(scope.row.cell, scope.row.number, 1)">{{ $t('Add')
                            }}
                        </el-button>

                        <el-button type="primary" style="padding: 4px 10px;font-size: 12px;"
                            :disabled="scope.row.number >= 1 ? false : true"
                            @click="UpdateStroageCageByCell(scope.row.cell, scope.row.number, -1)">{{ $t('Reduce')
                            }}</el-button>

                        <el-button type="primary" style="padding: 4px 10px;font-size: 12px;"
                            :disabled="scope.row.number >= 1 ? false : true"
                            @click="UpdateStroageCageByCell(scope.row.cell, scope.row.number, 0)">{{ $t('Delete')
                            }}</el-button>
                    </template>
                </el-table-column>
            </el-table>
        </el-dialog>

        <el-dialog :visible.sync="Taskqueue" :title="$t('Task queue')" top="5vh">
            <el-table :data="tableData1" style="width: 100%;margin-bottom: 20px;" row-key="id" border lazy
                default-expand-all :tree-props="{ children: 'glassinfo', hasChildren: 'hasChildren' }">
                <el-table-column prop="flowcard" :label="$t('Order')">
                </el-table-column>
                <el-table-column prop="glasstype" :label="$t('GlassType')">
                </el-table-column>
                <el-table-column prop="number" :label="$t('Order No')">
                </el-table-column>
                <el-table-column prop="cageno" :label="$t('No Of Cage')">
                </el-table-column>
                <el-table-column prop="finishnumber" :label="$t('Finish No')">
                </el-table-column>
                <el-table-column prop="mateid" :label="$t('Mate No')">
                </el-table-column>
                <el-table-column prop="films" :label="$t('Films')">
                </el-table-column>
                <el-table-column prop="thickness" :label="$t('Thickness')">
                </el-table-column>
                <el-table-column prop="width" :label="$t('Width')">
                </el-table-column>
                <el-table-column prop="height" :label="$t('Height')">
                </el-table-column>
                <el-table-column prop="state" :label="$t('Task State')">
                    <template slot-scope='scope'>
                        {{ scope.row.state >= 0 ? scope.row.state == 0 ? $t('Start') : $t('Stop') : "" }}
                    </template>
                </el-table-column>
                <el-table-column prop="method" :label="$t('Task Method')">
                    <template slot-scope='scope'>
                        {{ scope.row.state >= 0 ? scope.row.method == 0 ? $t('Out') : $t('All Out') : "" }}
                    </template>

                </el-table-column>
                <el-table-column prop="line" :label="$t('Task Line')">
                </el-table-column>
                <el-table-column width="220" :label="$t('Operate')">
                    <template slot-scope='scope'>
                        <el-button type="primary" style="padding: 4px 10px;font-size: 12px;"
                            v-show="scope.row.state >= 0 ? true : false"
                            @click="ClaimTasks(scope.row.flowcard, scope.row.state)">
                            {{ scope.row.status == '0' ? $t('Start Task') : $t('Stop Task') }}</el-button>

                        <el-button type="primary" style="padding: 4px 10px;font-size: 12px;"
                            v-show="scope.row.state >= 0 ? true : false"
                            @click="ModeChange(scope.row.flowcard, scope.row.method)">
                            {{ $t('Mode Change') }}</el-button>
                    </template>
                </el-table-column>
            </el-table>
        </el-dialog>

        <el-dialog :visible.sync="StorageCageAdd" :title="$t('StorageCageAdd')" top="5vh" width="80%">
            <div style="display: flex;height: 40px;line-height: 40px;">
                <label for="">{{ $t('Width') }}</label>
                <el-input v-model="StorageCageForm.width" autocomplete="off" style="width:15%;" />
                <label for="">{{ $t('Height') }}</label>
                <el-input v-model="StorageCageForm.height" autocomplete="off" style="width:15%;" />
                <label for="">{{ $t('Thickness') }}</label>
                <el-input v-model="StorageCageForm.thickness" autocomplete="off" style="width:15%;" />
                <label for="">{{ $t('Films') }}</label>
                <el-input v-model="StorageCageForm.films" autocomplete="off" style="width:15%;" />
                <el-button @click="SelectGlassInfo()" type="primary">
                    {{ $t('Select') }}</el-button>
            </div>
            <el-table :data="this.StorageCageAddInfo" :height="700" border style="width: 100%;overflow: auto;">
                <el-table-column prop="flowcard" :label="$t('Flowcard')"></el-table-column>
                <el-table-column prop="glasstype" :label="$t('GlassType')"></el-table-column>
                <el-table-column prop="width" :label="$t('Width')"></el-table-column>
                <el-table-column prop="height" :label="$t('Height')"></el-table-column>
                <el-table-column prop="thickness" :label="$t('Thickness')"></el-table-column>
                <el-table-column prop="films" :label="$t('Films')"></el-table-column>
                <el-table-column :label="$t('Operate')">
                    <template slot-scope='scope'>
                        <el-button type="primary" style="padding: 4px 10px;font-size: 12px;"
                            @click="StorageCageAddGlass(scope.$index)">
                            {{ $t('Add') }}</el-button>
                    </template>
                </el-table-column>
            </el-table>
        </el-dialog>

    </el-container>
</template>
<script>

import {
    home, home2,  UpdateTask, SelectCageInfo, DeleteByGlassID, 
    SelectPassword,  Disabled,  AddOutSliceS,  SelectPermissionByUserName, currentUsername, CompleteQueue,
    isAllowReorderings,  WriteGlassID, ClearGlassId, CloseForm7,  SoftEmergencyStop, SwitchScanMethod
    home, home2, SelectCageInfo,
    Disabled, SelectPermissionByUserName, currentUsername, CompleteQueue,
    isAllowReorderings,

    UpdateStroageCageByCell, FinishTask, SelectGlassInfo, StorageCageAddGlass, ClaimTasks, ModeChange, UpdateQueue
} from "../../api/home";


import LanguageMixin from '../../lang/LanguageMixin'
import LanguageMixin from '../../lang/LanguageMixin';
import * as XLSX from "../../../node_modules/xlsx/xlsx.mjs";
let socket;
export default {
    name: "Home",
    data() {
        return {
            dataList: [],
            tableData1: [],
            Measuermode: false,
            confirm1: false,
            confirm2: false,
            insertcage: 0,
@@ -482,16 +625,21 @@
            dialogFormVisible: false,
            dialogFormVisible1: false,
            dialogFormVisible2: false,
            Importorder:false,
            Measure:false,
            StorageCage:false,
            Taskqueue:false,
            form: {
                orderId: "",
                glassId: "",
            Importorder: false,
            Measure: false,
            StorageCage: false,
            Taskqueue: false,
            StorageCageAdd: false,
            StorageCageInfo: [],
            StorageCageForm: {
                width: "",
                height: "",
                width: ""
                thickness: "",
                films: ""
            },
            StorageCageAddInfo: [],
            TaskqueueInfo: [],
            cell: "",
            form1: {},
            form2: {},
            form3: {},
@@ -559,7 +707,8 @@
            DeviceList: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
            GlassIdList: [],
            Scanningmethod: true,
            CurrrentGlassId: ""
            CurrrentGlassId: "",
            LastQueue: {}
        };
    },
    created() {
@@ -571,15 +720,15 @@
    }
    ,
    methods: {
        showform(i){
            if(i==1){
                this.Importorder=true;
            }else if(i==2){
                this.Measure=true;
            }else if(i==3){
                this.StorageCage=true;
            }else if(i==4){
                this.Taskqueue=true;
        showform(i) {
            if (i == 1) {
                this.Importorder = true;
            } else if (i == 2) {
                this.Measure = true;
            } else if (i == 3) {
                this.StorageCage = true;
            } else if (i == 4) {
                this.Taskqueue = true;
            }
        },
        init() {
@@ -617,11 +766,12 @@
                    this.cagelist2 = obj.cagelist2[0];
                    this.cagelist3 = obj.cagelist3[0];
                    this.cagelist4 = obj.cagelist4[0];
                    this.tasklist1 = obj.tasklist1[0];
                    this.tasklist2 = obj.tasklist2[0];
                    this.tasklist2 = obj.StoragTaskeTaskFeed[0];
                    this.tasklist1 = obj.StoragTaskeTaskOut[0];
                    this.alarm = obj.alarmmg[0];
                    

                    this.tableData1 = obj.OrderTask[0];
                    this.LastQueue = obj.LastQueue[0];


                    //是否允许出片
@@ -639,6 +789,9 @@
                        SelectCageInfo(this.cageglassid).then(res => {
                            this.cageinfo = res.data.cageinfo;
                        });
                    }
                    if (obj.StorageCageInfo != null) {
                        this.StorageCageInfo = obj.StorageCageInfo[0];
                    }
                    this.$forceUpdate();

@@ -703,66 +856,72 @@
                this.cagelist3 = res.data.list3;
                this.cagelist4 = res.data.list4;
            });
            //加载确认密码
            SelectPassword().then(res => {
                this.password = res.data.password;
            });
        },
        
        //结束进/出片任务
        endtask(type, glassid, cell) {
            this.$prompt(this.$t('Are you sure to perform this operation ?'), this.$t('prompt'), {
                inputType: 'password',
                inputPlaceholder: this.$t('Please enter the password'),
                confirmButtonText: this.$t('Yes'),
                cancelButtonText: this.$t('No'),
                type: 'warning'
            }).then(({ value }) => {
                if (this.password == value) {
                    UpdateTask(type, glassid, cell).then(res => {
                        if (res.data.message3 == 200) {
                            this.$message.success(this.$t('Operation successful'));
                        }
                    });
                } else {
                    this.$message.error(this.$t('Password error'));//密码错误
                }
            }).catch(() => {
                this.$message({
                    type: 'info',
                    message: this.$t('Operation canceled')
                });
            });
        },
        //删除理片笼玻璃
        deleteglass(glassid, state) {
            this.$prompt(this.$t('Are you sure to perform this operation ?'), this.$t('prompt'), {
                inputType: 'password',
                inputPlaceholder: this.$t('Please enter the password'),
                confirmButtonText: this.$t('Yes'),
                cancelButtonText: this.$t('No'),
                type: 'warning'
            }).then(({ value }) => {
                if (this.password == value) {
                    if (state == 1) {
                        DeleteByGlassID(glassid).then(res => {
                            if (res.data.message3 == 200) {
                                this.$message.success(this.$t('Operation successful'));
                            }
                        });
                    } else {
                        this.$message.error(this.$t('No delete allowed'));
        //添加理片笼玻璃
        StorageCageAddGlass(index) {
            if (this.Measuermode == true) {
                StorageCageAddGlass(this.cell, this.StorageCageAddInfo[index]).then(res => {
                    if (res.data.message == 200) {
                        this.$message.success(this.$t('Operation successful'));
                    }
                } else {
                    this.$message.error(this.$t('Password error'));//密码错误
                }

            }).catch(() => {
                this.$message({
                    type: 'info',
                    message: this.$t('Operation canceled')
                })
            } else {
                UpdateQueue(this.StorageCageAddInfo[index]).then(res => {
                    if (res.data.message == 200) {
                        this.$message.success(this.$t('Operation successful'));
                    } else {
                        this.$message.error(this.$t('Operation failed'));
                    }
                });
            }

        },
        //领取/暂停任务
        ClaimTasks(flowcard, state) {
            ClaimTasks(flowcard, state).then(res => {
                if (res.data.message == 200) {
                    this.$message.success(this.$t('Operation successful'));
                }
            });
        },
        //修改出片方式
        ModeChange(flowcard, method) {
            ModeChange(flowcard, method).then(res => {
                if (res.data.message == 200) {
                    this.$message.success(this.$t('Operation successful'));
                }
            });
        },
        //查询玻璃信息
        SelectGlassInfo() {
            SelectGlassInfo(this.StorageCageForm.width, this.StorageCageForm.height, this.StorageCageForm.thickness, this.StorageCageForm.films).then(res => {
                this.StorageCageAddInfo = res.data.StorageCageAddInfo;
            })
        },
        //完成进/出片任务
        FinishTask(tasktype, id) {
            FinishTask(tasktype, id).then(res => {
                if (res.data.message3 == 200) {
                    this.$message.success(this.$t('Operation successful'));
                }
            });
        },
        //修改理片笼玻璃信息
        UpdateStroageCageByCell(cell, nownum, num) {
            if (nownum == null && num == 1) {
                this.StorageCageAdd = true;
                this.cell = cell;
            } else {
                if (nownum + num == 0) {
                    num = 0;
                }
                UpdateStroageCageByCell(cell, num).then(res => {
                    if (res.data.message3 == 200) {
                        this.$message.success(this.$t('Operation successful'));
                    }
                });
            }

        },
        //启用//理片笼禁用
        UpdateDisabled(cage, cell, disabled) {
@@ -772,7 +931,7 @@
                }
            });
        },
        

        //改变每页容纳的数据量
        handleSizeChange: function (size) {
            this.pagesize = size;
@@ -789,7 +948,7 @@
        handleCurrentChanges: function (currentPage) {
            this.currentPages = currentPage;
        },
        

        //是否允许出片队列排序
        isAllowReorderings() {
            isAllowReorderings(!this.isAllowReordering, this.OutSlice).then(res => {
@@ -825,8 +984,57 @@
                const specialChars = /[^\w\s]/g;
                return this.GlassIdList[num].replace(specialChars, "");
            }
        },
        //人工匹配
        ManualMatching() {
            this.StorageCageAdd = true;
        },
        //人工拿走
        ManualTake() {

        },
        Change(event) {
            // 获取到文件夹
            let fileList = event.target.files;
            // 如果数据不为空
            if (fileList) {
                // FileReader是一种异步文件读取机制，结合input:file可以很方便的读取本地文件。
                let reader = new FileReader();
                let file = fileList[0]; //拿到第一条数据
                reader.readAsBinaryString(file)// 将文件以二进制形式读入页面
                let _this = this //把data里的数据赋值给新的变量
                // wb:wordbook 工作表  
                reader.addEventListener("load", function (e) {
                    
                    var data = e.target.result; //读取成功后result中的数据
                    var wb = XLSX.read(data, { type: "binary" });  
                    let sheetName = wb.SheetNames[0]; //是获取Sheets中第一个Sheet的名字
                    let sheets = wb.Sheets[sheetName];
                    let dataList2 = JSON.stringify(XLSX.utils.sheet_to_json(sheets));
                    let dataList3 = (JSON.parse(dataList2));
                    _this.dataList = dataList3;//赋值
                    //console.log(dataList2);  
                    console.log(dataList3);

                })
            }
        },
        Add() {
            
        },
        Hide() {
            
        },
        AllAdd() {
            //添加数据进后台
            console.log(this.dataList);
        },
        del() {
            
            this.StorageCageAdd = true;
        }
        


    }
}
</script>
</script>