| | |
|---|
| | | transform: translateX(-150%);
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .el-dialog{
|
|---|
| | | width: 80%;
|
|---|
| | | }
|
|---|
| | | </style>
|
|---|
| | | <template>
|
|---|
| | | <el-container>
|
|---|
| | |
|---|
| | | <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>
|
|---|
| | |
|---|
| | | <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+(item['cage']-1)*6.8 + 'px' }"
|
|---|
| | | :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+(item['cage']-6)*6.8 + 'px' }"
|
|---|
| | | :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+(item['cage']-1)*6.8 + 'px' }"
|
|---|
| | | :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, index) in cagelist4" :key="item['date']"
|
|---|
| | | :style="{ height: 35 * item['glassWidth'] + 'px', top: item['width'] * 35 - 35 + 'px', left: 3.07 * index+(item['cage']-6)*6.8 + 'px' }"
|
|---|
| | | :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="blocks-img" :style="{ left: car1 + 'px', top: '16px' }"></div>
|
|---|
| | |
|---|
| | | </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>
|
|---|
| | |
|---|
| | | //console.log("收到数据====" + msg.data);
|
|---|
| | | let obj = JSON.parse(msg.data);
|
|---|
| | | if (obj.params != null) {
|
|---|
| | | this.car1 = 145 + 8.15 * (obj.params[0][0] - this.carlist[0]['start']) / (this.carlist[0]['end'] - this.carlist[0]['start']) * 100;
|
|---|
| | | this.car2 = 210 + 8.15 * (obj.params[0][1] - this.carlist[1]['start']) / (this.carlist[1]['end'] - this.carlist[1]['start']) * 100;
|
|---|
| | | 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];
|
|---|
