|
@@ -1,26 +1,68 @@
|
|
// 链表监控 // 排队开始
|
|
// 链表监控 // 排队开始
|
|
<template>
|
|
<template>
|
|
<div class="sale">
|
|
<div class="sale">
|
|
- <div class="top">
|
|
|
|
- <el-form :inline="true" style="margin-top: 1rem;">
|
|
|
|
- <el-form-item>
|
|
|
|
- <label class="el-form-item__label" style="width: auto;">车牌号</label>
|
|
|
|
- </el-form-item>
|
|
|
|
- <el-form-item>
|
|
|
|
- <el-input v-model="capacityNo"></el-input>
|
|
|
|
- </el-form-item>
|
|
|
|
- <el-form-item>
|
|
|
|
- <el-button
|
|
|
|
- type="primary"
|
|
|
|
- class="btn"
|
|
|
|
- @click="onclick"
|
|
|
|
- style="margin-left: 4px;"
|
|
|
|
- clearable
|
|
|
|
- ><i class="el-icon-search"></i>查询</el-button
|
|
|
|
- >
|
|
|
|
- </el-form-item>
|
|
|
|
- </el-form>
|
|
|
|
- </div>
|
|
|
|
|
|
+ <div class="top"></div>
|
|
|
|
+ <el-dialog title="链表详情" :visible.sync="dialogTableVisible">
|
|
|
|
+ <el-table
|
|
|
|
+ :data="tableDataDetails"
|
|
|
|
+ border
|
|
|
|
+ style="width: 100%; margin-top: 20px"
|
|
|
|
+ max-height="500px"
|
|
|
|
+ >
|
|
|
|
+ <el-table-column type="index" width="50"> </el-table-column>
|
|
|
|
+ <el-table-column prop="capacityNumber" label="车牌号" fit>
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column prop="resultStartTime" label="排队开始时间">
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column prop="listNodeOrder" label="序号"></el-table-column>
|
|
|
|
+ <el-table-column prop="materialName" label="物资名称">
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column prop="materialSpecification" label="物资规格">
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column prop="materialModel" label="物资型号">
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column prop="materialNumber" label="物资件数">
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column prop="driverTel" label="司机电话号码">
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column prop="sureTime" label="可进厂确认时间">
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column prop="gatepostName" label="进厂门岗">
|
|
|
|
+ </el-table-column>
|
|
|
|
+ </el-table>
|
|
|
|
+ </el-dialog>
|
|
|
|
+ <el-dialog title="链表详情" :visible.sync="spelldialogTableVisible">
|
|
|
|
+ <el-table
|
|
|
|
+ :data="tableDataSpellDetails"
|
|
|
|
+ :span-method="objectSpanMethod"
|
|
|
|
+ border
|
|
|
|
+ style="width: 100%; margin-top: 20px"
|
|
|
|
+ @selection-change="handleSelectionChange"
|
|
|
|
+ max-height="500px"
|
|
|
|
+ >
|
|
|
|
+ <el-table-column type="selection" width="55"></el-table-column>
|
|
|
|
+ <el-table-column prop="capacityNumber" label="车牌号" fit>
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column prop="grid" label="拼数" fit> </el-table-column>
|
|
|
|
+ <el-table-column prop="resultStartTime" label="排队开始时间">
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column prop="listNodeOrder" label="序号"></el-table-column>
|
|
|
|
+ <el-table-column prop="materialName" label="物资名称">
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column prop="materialSpecification" label="物资规格">
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column prop="materialModel" label="物资型号">
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column prop="materialNumber" label="物资件数">
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column prop="driverTel" label="司机电话号码">
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column prop="gatepostName" label="进厂门岗">
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column prop="sureTime" label="可进厂确认时间">
|
|
|
|
+ </el-table-column>
|
|
|
|
+ </el-table>
|
|
|
|
+ </el-dialog>
|
|
<div class="tabs">
|
|
<div class="tabs">
|
|
<el-tabs v-model="activeName" type="card" @tab-click="handleClick">
|
|
<el-tabs v-model="activeName" type="card" @tab-click="handleClick">
|
|
<el-tab-pane label="单拼车辆排队链表" name="first">
|
|
<el-tab-pane label="单拼车辆排队链表" name="first">
|
|
@@ -28,7 +70,6 @@
|
|
:data="tableData1"
|
|
:data="tableData1"
|
|
border
|
|
border
|
|
style="width: 100%; margin-top: 20px"
|
|
style="width: 100%; margin-top: 20px"
|
|
- @selection-change="handleSelectionChange"
|
|
|
|
max-height="500px"
|
|
max-height="500px"
|
|
>
|
|
>
|
|
<el-table-column type="index" width="50"> </el-table-column>
|
|
<el-table-column type="index" width="50"> </el-table-column>
|
|
@@ -39,19 +80,34 @@
|
|
</el-table-column>
|
|
</el-table-column>
|
|
<el-table-column prop="materialModel" label="物资型号">
|
|
<el-table-column prop="materialModel" label="物资型号">
|
|
</el-table-column>
|
|
</el-table-column>
|
|
|
|
+ <el-table-column fixed="right" label="操作" width="100">
|
|
|
|
+ <template slot-scope="scope">
|
|
|
|
+ <el-button type="text" size="mini" @click="getDetails(scope)">
|
|
|
|
+ 链表详情
|
|
|
|
+ </el-button>
|
|
|
|
+ </template>
|
|
|
|
+ </el-table-column>
|
|
</el-table>
|
|
</el-table>
|
|
</el-tab-pane>
|
|
</el-tab-pane>
|
|
<el-tab-pane label="多拼车辆排队链表" name="second">
|
|
<el-tab-pane label="多拼车辆排队链表" name="second">
|
|
<el-table
|
|
<el-table
|
|
:data="tableData"
|
|
:data="tableData"
|
|
- :span-method="objectSpanMethod"
|
|
|
|
border
|
|
border
|
|
style="width: 100%; margin-top: 20px"
|
|
style="width: 100%; margin-top: 20px"
|
|
- @selection-change="handleSelectionChange"
|
|
|
|
max-height="500px"
|
|
max-height="500px"
|
|
>
|
|
>
|
|
- <el-table-column type="selection" width="55"></el-table-column>
|
|
|
|
<el-table-column prop="count" label="排队数"> </el-table-column>
|
|
<el-table-column prop="count" label="排队数"> </el-table-column>
|
|
|
|
+ <el-table-column fixed="right" label="操作" width="100">
|
|
|
|
+ <template slot-scope="scope">
|
|
|
|
+ <el-button
|
|
|
|
+ type="text"
|
|
|
|
+ size="mini"
|
|
|
|
+ @click="getSpellDetails(scope)"
|
|
|
|
+ >
|
|
|
|
+ 链表详情
|
|
|
|
+ </el-button>
|
|
|
|
+ </template>
|
|
|
|
+ </el-table-column>
|
|
</el-table>
|
|
</el-table>
|
|
</el-tab-pane>
|
|
</el-tab-pane>
|
|
</el-tabs>
|
|
</el-tabs>
|
|
@@ -59,10 +115,15 @@
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
<script>
|
|
<script>
|
|
-import { getCookie } from "@/utils/util.js";
|
|
|
|
export default {
|
|
export default {
|
|
data() {
|
|
data() {
|
|
return {
|
|
return {
|
|
|
|
+ //存放每一行记录的合并数
|
|
|
|
+ spanArr: [],
|
|
|
|
+ tableDataSpellDetails: [],
|
|
|
|
+ spelldialogTableVisible: false,
|
|
|
|
+ dialogTableVisible: false,
|
|
|
|
+ tableDataDetails: [],
|
|
capacityNo: "",
|
|
capacityNo: "",
|
|
inputText: "",
|
|
inputText: "",
|
|
activeName: "first",
|
|
activeName: "first",
|
|
@@ -89,6 +150,68 @@ export default {
|
|
this.getNoSpellingArray();
|
|
this.getNoSpellingArray();
|
|
},
|
|
},
|
|
methods: {
|
|
methods: {
|
|
|
|
+ //记录每一行的合并数
|
|
|
|
+ getSpanArr(data) {
|
|
|
|
+ //每次调用方法初始化
|
|
|
|
+ this.spanArr = [];
|
|
|
|
+ for (var i = 0; i < data.length; i++) {
|
|
|
|
+ if (i === 0) {
|
|
|
|
+ this.spanArr.push(1);
|
|
|
|
+ this.pos = 0;
|
|
|
|
+ } else {
|
|
|
|
+ // 判断当前元素与上一个元素是否相同
|
|
|
|
+ if (data[i].resultTotalId === data[i - 1].resultTotalId) {
|
|
|
|
+ this.spanArr[this.pos] += 1;
|
|
|
|
+ this.spanArr.push(0);
|
|
|
|
+ } else {
|
|
|
|
+ this.spanArr.push(1);
|
|
|
|
+ this.pos = i;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ objectSpanMethod({ row, column, rowIndex, columnIndex }) {
|
|
|
|
+ if (
|
|
|
|
+ columnIndex === 0 ||
|
|
|
|
+ columnIndex === 1 ||
|
|
|
|
+ columnIndex === 2 ||
|
|
|
|
+ columnIndex === 3 ||
|
|
|
|
+ columnIndex === 4 ||
|
|
|
|
+ columnIndex === 9 ||
|
|
|
|
+ columnIndex === 10 ||
|
|
|
|
+ columnIndex === 12
|
|
|
|
+ ) {
|
|
|
|
+ const _row = this.spanArr[rowIndex];
|
|
|
|
+ const _col = _row > 0 ? 1 : 0;
|
|
|
|
+ return {
|
|
|
|
+ rowspan: _row,
|
|
|
|
+ colspan: _col
|
|
|
|
+ };
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ getDetails(scope) {
|
|
|
|
+ console.log(scope.row.gridId);
|
|
|
|
+ let map = {
|
|
|
|
+ locationId: scope.row.gridId
|
|
|
|
+ };
|
|
|
|
+ this.axios.post("/api/v1/qms/getListMonitorMes", map).then(res => {
|
|
|
|
+ console.log(res);
|
|
|
|
+ this.tableDataDetails = res.data.data;
|
|
|
|
+ this.dialogTableVisible = true;
|
|
|
|
+ });
|
|
|
|
+ },
|
|
|
|
+ getSpellDetails(scope) {
|
|
|
|
+ let map = {
|
|
|
|
+ locationId: scope.row.gridId
|
|
|
|
+ };
|
|
|
|
+ this.axios
|
|
|
|
+ .post("/api/v1/qms/getSpellingListMonitorMes", map)
|
|
|
|
+ .then(res => {
|
|
|
|
+ this.tableDataSpellDetails = res.data.data;
|
|
|
|
+ this.getSpanArr(res.data.data);
|
|
|
|
+ this.spelldialogTableVisible = true;
|
|
|
|
+ });
|
|
|
|
+ },
|
|
handleClick() {
|
|
handleClick() {
|
|
if (this.activeName == "first") {
|
|
if (this.activeName == "first") {
|
|
this.getNoSpellingArray();
|
|
this.getNoSpellingArray();
|