添加备注,优化列表

master
fanluyan 1 year ago
parent cbf3f163f5
commit aafe8eb927

@ -82,24 +82,24 @@ body {
font-family: "PingFang SC", "Helvetica Neue", Helvetica, "microsoft yahei",
arial, STHeiTi, sans-serif;
}
/* 整个滚动条 */
::-webkit-scrollbar {
width: 8px;
height: 8px;
}
// /* */
// ::-webkit-scrollbar {
// width: 8px;
// height: 8px;
// }
/* 滚动条上的滚动滑块 */
::-webkit-scrollbar-thumb {
background-color: #ccc;
/* 关键代码 */
border-radius: 32px;
}
// /* */
// ::-webkit-scrollbar-thumb {
// background-color: #ccc;
// /* */
// border-radius: 32px;
// }
/* 滚动条轨道 */
::-webkit-scrollbar-track {
background-color: #f0f0f0;
border-radius: 32px;
}
// /* */
// ::-webkit-scrollbar-track {
// background-color: #f0f0f0;
// border-radius: 32px;
// }
.el-dialog__headerbtn {
top: 18px;
.el-dialog__close {

@ -159,3 +159,14 @@ export function getqueryActivityApi(data) {
},
});
}
export function updComment(data) {
return request({
url: "api/updComment.php",
method: "get",
params: data,
headers: {
"Content-Type": "application/x-www-form-urlencoded;charset=UTF-8",
},
});
}

@ -61,6 +61,13 @@
@click="handleEditClick(scope.row)"
size="small"
icon="el-icon-document"
>修改</el-link
>
<el-link
type="primary"
@click="handleLookClick(scope.row)"
size="small"
icon="el-icon-document"
>详情</el-link
>
<el-link
@ -156,6 +163,7 @@ export default {
65286: "河南郑州",
65290: "河南统一视频v2020",
},
ActibityId: "", //
};
},
computed: {},
@ -171,11 +179,11 @@ export default {
const columnData = this.termsData.map((row) => row[dataField]);
console.log(`当前列数据字段:${dataField}`);
console.log(`当前列数据值:${columnData}`);
//this.copyToClipboard(columnData.join("\n"));
this.copyToClipboard(columnData.join("\n"));
console.log(columnData);
this.activityForm.cmdidArr = columnData.join("\n");
this.activityForm.title = this.activityNameTitle;
this.termsShow = false;
// this.activityForm.cmdidArr = columnData.join("\n");
// this.activityForm.title = this.activityNameTitle;
//this.termsShow = false;
},
copyToClipboard(text) {
const textArea = document.createElement("textarea");
@ -217,8 +225,26 @@ export default {
})
.catch((err) => {});
},
//
//
handleEditClick(row) {
console.log(row);
getqueryActivityApi({
act: "detail",
id: row.id,
})
.then((res) => {
console.log(res);
this.ActibityId = res.data.activity.id;
this.activityForm.title = res.data.activity.title;
console.log(this.activityForm.title);
const columnData = res.data.terms.map((item) => item.cmdid);
console.log(columnData);
this.activityForm.cmdidArr = columnData.join("\n");
})
.catch((err) => {});
},
//
handleLookClick(row) {
this.termsShow = true;
this.termsLoading = true;
this.termsData = [];
@ -281,19 +307,32 @@ export default {
this.cmdidFlag = true;
return;
}
let actParams = {};
if (this.ActibityId !== "") {
console.log(this.ActibityId);
actParams = {
id: this.ActibityId,
title: this.activityForm.title,
cmdids: this.activityForm.cmdidArr,
act: "edt",
};
} else {
actParams = {
title: this.activityForm.title,
cmdids: this.activityForm.cmdidArr,
act: "new",
};
}
console.log(this.activityForm.title);
console.log(this.activityForm.cmdidArr);
//console.log(arrList);
updActivityApi({
title: this.activityForm.title,
cmdids: this.activityForm.cmdidArr,
act: "new",
})
updActivityApi(actParams)
.then((res) => {
console.log(res);
this.getactivityList();
this.activityForm.title = "";
this.activityForm.cmdidArr = "";
this.ActibityId = "";
})
.catch((err) => {});
},

@ -260,7 +260,7 @@ export default {
justify-items: center;
justify-content: center;
.el-dialog {
width: 90%;
width: 95%;
height: 83%;
margin-top: 0px !important;
@ -299,6 +299,8 @@ export default {
}
.msgTootip {
color: #333;
overflow: auto;
height: 90%;
p {
font-size: 14px;
line-height: 22px;

@ -47,7 +47,14 @@
>装置总数<el-tag type="info">{{ tableData.length }}</el-tag></span
>
</p>
<el-button type="primary" @click="handleExport"></el-button>
<el-tooltip class="item" effect="dark" content="导出" placement="top">
<el-button
type="primary"
icon="el-icon-tickets"
@click="handleExport"
></el-button>
</el-tooltip>
<el-tooltip class="item" effect="dark" content="扩展列" placement="top">
<el-button
class="drawBox"
@ -63,7 +70,7 @@
v-loading="tableLoaidng"
id="ywTable"
ref="ywMultipleTable"
:data="tableData"
:data="tableDataWithEditing"
border
:row-style="isRed"
:row-key="getRowKey"
@ -78,15 +85,13 @@
<u-table-column
type="selection"
:reserve-selection="true"
width="50"
width="30"
fixed
>
</u-table-column>
<u-table-column type="index" width="50" label="序号" fixed>
<u-table-column type="index" width="40" label="序号" fixed>
</u-table-column>
<!-- <u-table-column prop="id" label="ID" width="60" sortable>
</u-table-column> -->
<u-table-column prop="oid" label="出厂ID" width="180" sortable fixed>
<u-table-column prop="oid" label="出厂ID" width="134" sortable fixed>
<template slot-scope="scope">
<span
class="redMlxf"
@ -118,9 +123,9 @@
</span>
</template>
</u-table-column>
<u-table-column prop="cmdid" label="装置编号" width="150" sortable fixed>
<u-table-column prop="cmdid" label="装置编号" width="136" sortable fixed>
</u-table-column>
<u-table-column label="状态" width="72" fixed>
<u-table-column label="状态" width="54" fixed>
<template slot-scope="scope">
<el-tag
type="success"
@ -130,13 +135,7 @@
<el-tag type="danger" v-else>线</el-tag>
</template>
</u-table-column>
<u-table-column
label="运维"
prop="in_maintain"
width="100"
sortable
fixed
>
<u-table-column label="运维" prop="in_maintain" width="68" sortable fixed>
<template slot="header" slot-scope="scope">
<p :class="ywNumber != 0 ? 'redClass' : 'noClass'">
{{ ywNumber }}<span> / {{ tableData.length }}</span>
@ -164,7 +163,7 @@
></el-checkbox>
</template>
</u-table-column>
<u-table-column label="快心跳" prop="quick_hb" width="108" sortable fixed>
<u-table-column label="快心跳" prop="quick_hb" width="90" sortable fixed>
<template slot="header" slot-scope="scope">
<p :class="kxtNumber != 0 ? 'redClass' : 'noClass'">
{{ kxtNumber }}<span> / {{ tableData.length }}</span>
@ -195,20 +194,22 @@
<u-table-column
prop="last_heartbeat"
label="最后心跳"
width="142"
width="130"
sortable
class-name="hbClass"
>
<template slot-scope="scope">
<span @click="handleMsgClick(scope.row)">{{
scope.row.last_heartbeat
}}</span>
<span
@click="handleMsgClick(scope.row)"
:title="scope.row.last_heartbeat"
>{{ scope.row.last_heartbeat }}</span
>
</template>
</u-table-column>
<u-table-column
label="传图"
prop="raw_report.pic"
width="80"
width="50"
class-name="picBg"
sortable
>
@ -229,7 +230,7 @@
{{ protocolMap[scope.row.protocol] }}
</template>
</u-table-column>
<u-table-column label="电池状态" width="138" key="dc" v-if="dccheck">
<u-table-column label="电池状态" width="126" key="dc" v-if="dccheck">
<template slot-scope="scope">
<span v-if="scope.row.raw_report.hasOwnProperty('XyDev')">{{
scope.row.raw_report.battary
@ -245,7 +246,7 @@
<u-table-column label="心跳信息" v-if="xtcheck" key="xt">
<u-table-column
label="次数"
min-width="68"
min-width="48"
sortable
:sort-method="sortnumberOfHb"
>
@ -272,7 +273,7 @@
}}</span>
</template>
</u-table-column>
<u-table-column label="CMA消息" min-width="60">
<u-table-column label="CMA消息" min-width="48">
<template slot-scope="scope">
<span v-if="scope.row.raw_report.hasOwnProperty('XyDev')">{{
scope.row.raw_report.recv
@ -287,7 +288,7 @@
</u-table-column>
<u-table-column label="拍照" v-if="pzcheck" key="pz">
<u-table-column label="计划/实际" min-width="60">
<u-table-column label="计划/实际" min-width="48">
<template slot-scope="scope">
<span v-if="scope.row.raw_report.hasOwnProperty('XyDev')">{{
scope.row.raw_report.photoTimes
@ -301,7 +302,7 @@
</u-table-column>
<u-table-column
label="成功"
min-width="70"
min-width="48"
sortable
:sort-method="sortSuccess"
>
@ -318,7 +319,7 @@
</u-table-column>
<u-table-column
label="失败"
min-width="70"
min-width="48"
sortable
:sort-method="sortFailure"
>
@ -386,7 +387,7 @@
</u-table-column>
<u-table-column
label="错误"
min-width="58"
min-width="48"
prop="networkError"
sortable
:sort-method="sortNumbersErr"
@ -407,7 +408,7 @@
<u-table-column label="重启次数" v-if="cqcheck" key="cq">
<u-table-column
label="系统"
min-width="58"
min-width="48"
prop="rebootTimes"
sortable
:sort-method="sortNumbers"
@ -475,7 +476,7 @@
<u-table-column
label="磁盘剩余空间"
v-if="freecheck"
min-width="120"
min-width="66"
key="free"
sortable
:sort-method="sortfreeNumbers"
@ -491,7 +492,7 @@
}}</span>
</template>
</u-table-column>
<u-table-column label="CMA服务器" v-if="cmacheck" width="160" key="cma">
<u-table-column label="CMA服务器" v-if="cmacheck" width="140" key="cma">
<template slot-scope="scope">
<span v-if="scope.row.raw_report.hasOwnProperty('XyDev')">
{{ scope.row.raw_report.cma }}</span
@ -503,7 +504,7 @@
}}</span>
</template>
</u-table-column>
<u-table-column label="I1版本" v-if="i1check" min-width="160" key="I1">
<u-table-column label="I1版本" v-if="i1check" min-width="192" key="I1">
<template slot-scope="scope">
<span v-if="scope.row.raw_report.hasOwnProperty('XyDev')">{{
scope.row.raw_report.i1Version
@ -518,7 +519,7 @@
<u-table-column
label="运维版本"
v-if="ywbbcheck"
min-width="260"
min-width="248 "
key="ywbb"
>
<template slot-scope="scope">
@ -537,7 +538,7 @@
<u-table-column
label="Camera版本"
v-if="Cameracheck"
width="100"
min-width="80"
key="Camera"
>
<template slot-scope="scope">
@ -548,7 +549,7 @@
}}
</template>
</u-table-column>
<u-table-column label="AI版本" v-if="AIcheck" width="80" key="AI">
<u-table-column label="AI版本" v-if="AIcheck" min-width="80" key="AI">
<template slot-scope="scope">
{{
scope.row.raw_report.msgs.hasOwnProperty("aiVersion")
@ -557,7 +558,7 @@
}}
</template>
</u-table-column>
<u-table-column label="MCU版本" v-if="MCUcheck" min-width="180" key="MCU">
<u-table-column label="MCU版本" v-if="MCUcheck" min-width="210" key="MCU">
<template slot-scope="scope">
{{
scope.row.raw_report.msgs.hasOwnProperty("mcu")
@ -566,6 +567,32 @@
}}
</template>
</u-table-column>
<u-table-column
label="备注"
v-if="notecheck"
min-width="210"
key="note"
sortable
:sort-method="sortNote"
>
<template slot-scope="scope">
<div
@click="handlecolEditClick(scope)"
style="height: 22px; cursor: pointer"
>
<el-input
class="noteclass"
v-if="scope.$index == cellIndex"
v-model="scope.row.comment"
@blur="handleCommentBlur(scope)"
placeholder="请输入备注"
></el-input>
<span v-else :title="scope.row.comment">{{
scope.row.comment
}}</span>
</div>
</template>
</u-table-column>
</u-table>
<el-drawer
class="drawerBox"
@ -625,6 +652,9 @@
<el-checkbox v-model="MCUcheck" @change="saveLocalStorage"
>MCU版本</el-checkbox
>
<el-checkbox v-model="notecheck" @change="saveLocalStorage"
>备注</el-checkbox
>
</div>
</div>
</el-drawer>
@ -816,7 +846,11 @@
</template>
<script>
import { getdoActionApi, getqueryUpgradesApi } from "@/utils/api/index";
import {
getdoActionApi,
getqueryUpgradesApi,
updComment,
} from "@/utils/api/index";
import rowMsgDialog from "./rowMsgDialog.vue";
import htmlToExcel from "@/utils/htmlToExcel";
import { saveAs } from "file-saver";
@ -894,6 +928,7 @@ export default {
kxtNumber: 0,
nowTime: new Date().getTime() / 1000,
gycheck: true,
dccheck: false,
xtcheck: false,
@ -911,6 +946,7 @@ export default {
AIcheck: false,
MCUcheck: false,
freecheck: false,
notecheck: false,
//
operateOptions: [
{ id: 1, name: "重启设备" },
@ -1056,6 +1092,7 @@ export default {
],
},
newupdatatime: null,
cellIndex: null,
};
},
mounted() {
@ -1063,6 +1100,15 @@ export default {
this.calculateHeight(this.showFlag);
window.addEventListener("resize", this.calculateHeight(this.showFlag));
},
computed: {
// 使 isEditing
tableDataWithEditing() {
return this.tableData.map((row) => ({
...row, //
isEditing: false, // isEditing false
}));
},
},
watch: {
tableData: {
handler(newVal) {
@ -1081,9 +1127,9 @@ export default {
this.showFlag = val;
this.screenHeight = window.innerHeight; //
if (val) {
this.tableHeight = this.screenHeight - 240; // 270px
this.tableHeight = this.screenHeight - 230; // 270px
} else {
this.tableHeight = this.screenHeight - 160; // 190px
this.tableHeight = this.screenHeight - 150; // 190px
}
//
@ -1144,6 +1190,23 @@ export default {
parseInt(b.raw_report.msgs.freeROM)
);
},
sortNote(a, b) {
// ab
const aValue = a.comment === null ? "" : String(a.comment);
const bValue = b.comment === null ? "" : String(b.comment);
// const aValue = typeof a === "string" ? a : String(a);
// const bValue = typeof b === "string" ? b : String(b);
// null
if (aValue === "" || bValue === "") {
return aValue === "" ? 1 : -1; //
}
console.log(aValue, bValue);
// 使localeCompare
return aValue.localeCompare(bValue, "zh-Hans-CN", {
sensitivity: "base",
});
},
// sortSignature1(a, b) {
// return (
// Number(a.raw_report.msgs.signature1.split("/")[0]) -
@ -1228,7 +1291,8 @@ export default {
"MCU版本",
];
// CSV
let csvContent = headers.join(",") + "\n";
//let csvContent = headers.join(",") + "\n";
let csvContent = headers.map((header) => `"${header}"`).join(",") + "\n"; // 使
this.tableData.forEach((item) => {
const rawReport = item.raw_report;
const msgs = item.raw_report.msgs;
@ -1245,7 +1309,8 @@ export default {
msgs.numberOfHb || "",
msgs.heartbeatDuration || "",
msgs.recv || "",
msgs.photoTimes || "",
//msgs.photoTimes || "",
String(msgs.photoTimes + "," || ""), //
msgs.success || "",
msgs.failure || "",
msgs.signature1 || "",
@ -1253,8 +1318,10 @@ export default {
msgs.networkError || "",
msgs.rebootTimes || "",
msgs.i1RebootTimes || "",
msgs.simcard1 || "",
msgs.simcard2 || "",
// msgs.simcard1 || "",
// msgs.simcard2 || "",
String(msgs.simcard1 + "," || ""), //
String(msgs.simcard2 + "," || ""), //
msgs.freeROM || "",
msgs.cma || "",
msgs.i1Version || "",
@ -1266,13 +1333,19 @@ export default {
// msgs
// CSV
csvContent += rawReportData.join(",") + "\n";
//csvContent += rawReportData.join(",") + "\n";
csvContent +=
rawReportData.map((value) => `"${value}"`).join(",") + "\n"; // 使
});
// Blob text/csv UTF-8
//
const now = this.$moment(new Date());
const formattedTime = now.format("YYYY年MM月DD日HH时mm分"); // "2023-04-01_15_30_00"
console.log(formattedTime);
// CSVBlob
const blob = new Blob([csvContent], { type: "text/csv;charset=utf-8" });
// 使 FileSaver
saveAs(blob, "运维数据报表.csv");
// 使FileSaver.js
saveAs(blob, `运维数据报表_${formattedTime}.csv`);
},
// id,row-keykey
getRowKey(row) {
@ -1646,6 +1719,7 @@ export default {
localStorage.setItem("AIcheck", this.AIcheck);
localStorage.setItem("MCUcheck", this.MCUcheck);
localStorage.setItem("freecheck", this.freecheck);
localStorage.setItem("notecheck", this.notecheck);
this.adjustTableHeight();
},
@ -1656,6 +1730,7 @@ export default {
this.checkAllYW = localStorage.getItem("checkAllYW", this.checkAllYW)
? JSON.parse(localStorage.getItem("checkAllYW"))
: false;
this.gycheck = localStorage.getItem("gycheck")
? JSON.parse(localStorage.getItem("gycheck"))
: true;
@ -1705,6 +1780,9 @@ export default {
this.freecheck = localStorage.getItem("freecheck")
? JSON.parse(localStorage.getItem("freecheck"))
: false;
this.notecheck = localStorage.getItem("notecheck")
? JSON.parse(localStorage.getItem("notecheck"))
: false;
console.log(
"规约:" + this.gycheck,
@ -1715,7 +1793,7 @@ export default {
"重启次数:" + this.cqcheck,
"sim卡" + this.simcheck,
"cma服务器" + this.cmacheck,
"版本:" + this.bbcheck
"版本:" + this.ywbbcheck
);
},
adjustTableHeight() {
@ -1770,6 +1848,30 @@ export default {
}
}
},
//
handlecolEditClick({ $index, row }) {
this.cellIndex = $index;
},
handleCommentBlur({ row }) {
console.log(row);
updComment({
id: row.id,
comment: row.comment,
})
.then((res) => {
if (res.data) {
this.cellIndex = null;
} else {
this.$message({
duration: 1500,
showClose: true,
message: res.errorMsg,
type: "error",
});
}
})
.catch((err) => {});
},
},
beforeDestroy() {
window.removeEventListener("resize", this.calculateHeight);
@ -1789,11 +1891,14 @@ export default {
.el-form-item--small.el-form-item {
margin-bottom: 0px;
}
.el-select {
width: 158px;
}
}
.zzMsg {
display: flex;
margin-left: auto;
margin-right: 48px;
margin-right: 44px;
.total {
margin-left: 8px;
//width: 100%;
@ -1802,7 +1907,7 @@ export default {
font-size: 14px;
color: #333;
span {
margin-right: 12px;
margin-right: 4px;
}
.el-tag--info {
color: #333;
@ -1813,7 +1918,17 @@ export default {
}
}
}
#ywTable {
.el-input--small .el-input__inner {
height: 20px;
line-height: 20px;
}
}
.plTableBox {
/* 横向滚动条的整体样式 */
// ::-webkit-scrollbar {
// height: 12px; /* */
// }
.el-table {
thead {
color: #333;
@ -1831,8 +1946,8 @@ export default {
text-align: center;
}
.cell {
padding-left: 4px;
padding-right: 4px;
padding-left: 4px !important;
padding-right: 4px !important;
}
}
.hbClass {
@ -1850,6 +1965,9 @@ export default {
.has-color td.el-table__cell {
background: #ffb8b8 !important;
}
.el-table__fixed::before {
height: 0px;
}
}
.ywTableBox {
color: #333;
@ -1963,6 +2081,7 @@ export default {
right: 0;
top: 5px;
}
.drawerBox {
.el-drawer {
width: 240px !important;

@ -178,7 +178,7 @@
>
<el-button
type="primary"
class="toggleClass"
:class="showDiv ? 'toggleClass' : 'toggleClass2'"
:icon="showDiv ? 'el-icon-d-arrow-right' : 'el-icon-d-arrow-left'"
circle
@click="toggleDiv"
@ -651,9 +651,9 @@ export default {
</script>
<style lang="less">
.homeBox {
height: calc(100% - 24px);
height: calc(100% - 16px);
width: calc(100% - 24px);
padding: 12px;
padding: 12px 12px 4px 12px;
.filterBox {
position: relative;
font-size: 12px;
@ -662,6 +662,7 @@ export default {
}
.el-input__inner {
font-size: 12px;
padding: 0px 24px 0px 4px !important;
}
.el-form {
display: flex;
@ -717,6 +718,7 @@ export default {
align-items: center;
.el-input {
margin-right: 8px;
width: 150px;
}
}
}
@ -727,7 +729,18 @@ export default {
}
.toggleClass {
position: absolute;
right: 0px;
right: 2px;
top: 82px;
.el-icon-d-arrow-left {
transform: rotate(-90deg);
}
.el-icon-d-arrow-right {
transform: rotate(-90deg);
}
}
.toggleClass2 {
position: absolute;
right: 2px;
top: 0px;
.el-icon-d-arrow-left {
transform: rotate(-90deg);

Loading…
Cancel
Save