|
|
|
|
<template>
|
|
|
|
|
<basic-container>
|
|
|
|
|
<!-- 记录仪管理 -->
|
|
|
|
|
<el-tabs v-model="tabPosition" class="demo-tabs" @tab-change="tabPositionChange">
|
|
|
|
|
<el-tab-pane label="记录仪" name="recorder">
|
|
|
|
|
<avue-crud
|
|
|
|
|
:option="option"
|
|
|
|
|
:table-loading="loading"
|
|
|
|
|
:data="data"
|
|
|
|
|
v-model="form"
|
|
|
|
|
v-model:page="page"
|
|
|
|
|
ref="crud"
|
|
|
|
|
@row-del="rowDel"
|
|
|
|
|
@row-save="rowSave"
|
|
|
|
|
@row-update="rowUpdate"
|
|
|
|
|
@search-change="searchChange"
|
|
|
|
|
@search-reset="searchReset"
|
|
|
|
|
@selection-change="selectionChange"
|
|
|
|
|
@current-change="currentChange"
|
|
|
|
|
@size-change="sizeChange"
|
|
|
|
|
@refresh-change="refreshChange"
|
|
|
|
|
|
|
|
|
|
>
|
|
|
|
|
<template #menu="{ row, index, size }">
|
|
|
|
|
<el-button type="text" @click="showDetail(row)" v-if="tabPosition == 'recorder'"
|
|
|
|
|
>明细</el-button
|
|
|
|
|
>
|
|
|
|
|
<el-button type="text" @click="rowEdit(row, index)">修改</el-button>
|
|
|
|
|
<el-button type="text" @click="deleteRow(row)" v-if="tabPosition == 'recorder'"
|
|
|
|
|
>删除</el-button
|
|
|
|
|
>
|
|
|
|
|
</template>
|
|
|
|
|
<template #menu-left>
|
|
|
|
|
<el-button
|
|
|
|
|
type="primary"
|
|
|
|
|
icon="el-icon-plus"
|
|
|
|
|
@click="handleAdd"
|
|
|
|
|
v-if="tabPosition == 'recorderLineSetting'"
|
|
|
|
|
>新增</el-button
|
|
|
|
|
>
|
|
|
|
|
<el-button
|
|
|
|
|
type="primary"
|
|
|
|
|
icon="el-icon-setting"
|
|
|
|
|
@click="setCycle"
|
|
|
|
|
v-if="tabPosition == 'recorder'"
|
|
|
|
|
>打包周期配置</el-button
|
|
|
|
|
>
|
|
|
|
|
</template>
|
|
|
|
|
</avue-crud>
|
|
|
|
|
</el-tab-pane>
|
|
|
|
|
<el-tab-pane label="记录仪曲线配置" name="recorderLineSetting">
|
|
|
|
|
<avue-crud
|
|
|
|
|
:option="option"
|
|
|
|
|
:table-loading="loading"
|
|
|
|
|
:data="data"
|
|
|
|
|
v-model="form"
|
|
|
|
|
v-model:page="page"
|
|
|
|
|
ref="crud"
|
|
|
|
|
@row-del="rowDel"
|
|
|
|
|
@row-save="rowSave"
|
|
|
|
|
@row-update="rowUpdate"
|
|
|
|
|
@search-change="searchChange"
|
|
|
|
|
@search-reset="searchReset"
|
|
|
|
|
@selection-change="selectionChange"
|
|
|
|
|
@current-change="currentChange"
|
|
|
|
|
@size-change="sizeChange"
|
|
|
|
|
@refresh-change="refreshChange"
|
|
|
|
|
@on-load="onLoad"
|
|
|
|
|
>
|
|
|
|
|
<template #menu="{ row, index, size }">
|
|
|
|
|
<el-button type="text" @click="showDetail(row)" v-if="tabPosition == 'recorder'"
|
|
|
|
|
>明细</el-button
|
|
|
|
|
>
|
|
|
|
|
<el-button type="text" @click="rowEdit(row, index)">修改</el-button>
|
|
|
|
|
<el-button type="text" @click="deleteRow(row)" v-if="tabPosition == 'recorder'"
|
|
|
|
|
>删除</el-button
|
|
|
|
|
>
|
|
|
|
|
</template>
|
|
|
|
|
<template #menu-left>
|
|
|
|
|
<el-button
|
|
|
|
|
type="primary"
|
|
|
|
|
icon="el-icon-plus"
|
|
|
|
|
@click="handleAdd"
|
|
|
|
|
v-if="tabPosition == 'recorderLineSetting'"
|
|
|
|
|
>新增</el-button
|
|
|
|
|
>
|
|
|
|
|
<el-button
|
|
|
|
|
type="primary"
|
|
|
|
|
icon="el-icon-setting"
|
|
|
|
|
@click="setCycle"
|
|
|
|
|
v-if="tabPosition == 'recorder'"
|
|
|
|
|
>打包周期配置</el-button
|
|
|
|
|
>
|
|
|
|
|
</template>
|
|
|
|
|
</avue-crud>
|
|
|
|
|
</el-tab-pane>
|
|
|
|
|
<el-tab-pane label="记录仪历史曲线" name="recorderHistoryLine">
|
|
|
|
|
<el-form
|
|
|
|
|
:inline="true"
|
|
|
|
|
:model="searchForm"
|
|
|
|
|
:rules="searchRules"
|
|
|
|
|
ref="searchForm"
|
|
|
|
|
class="demo-form-inline"
|
|
|
|
|
>
|
|
|
|
|
<el-form-item label="设备编码" prop="code">
|
|
|
|
|
<el-input v-model="searchForm.code" placeholder="设备编码"></el-input>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="统计日期" prop="queryDate">
|
|
|
|
|
<el-date-picker
|
|
|
|
|
v-model="searchForm.queryDate"
|
|
|
|
|
type="datetimerange"
|
|
|
|
|
range-separator="至"
|
|
|
|
|
start-placeholder="开始日期"
|
|
|
|
|
end-placeholder="结束日期"
|
|
|
|
|
>
|
|
|
|
|
</el-date-picker>
|
|
|
|
|
<!-- <el-date-picker v-model="form.queryDate" :default-time="['00:00:00', '23:59:59']" type="datetimerange" value-format="YYYY-MM-DD HH:mm:ss" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" /> -->
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item>
|
|
|
|
|
<el-button type="primary" @click="onSubmit">查询</el-button>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-form>
|
|
|
|
|
<div style="width: 100%; height: 70vh">
|
|
|
|
|
<div style="width: 100%; height: 100%" ref="historyCurve"></div>
|
|
|
|
|
</div>
|
|
|
|
|
</el-tab-pane>
|
|
|
|
|
</el-tabs>
|
|
|
|
|
<el-dialog append-to-body title="详情" width="80%" v-model="detailDialog">
|
|
|
|
|
<avue-crud
|
|
|
|
|
:option="detailOption"
|
|
|
|
|
:table-loading="detailLoading"
|
|
|
|
|
:data="detailData"
|
|
|
|
|
v-model="detailForm"
|
|
|
|
|
v-model:page="detailPage"
|
|
|
|
|
ref="crud"
|
|
|
|
|
@current-change="currentChange"
|
|
|
|
|
@size-change="sizeChange"
|
|
|
|
|
>
|
|
|
|
|
</avue-crud>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
<el-dialog append-to-body title="打包周期配置" v-model="settingDialog">
|
|
|
|
|
<el-form ref="setForm" :model="setForm" :rules="setRules" label-width="120px">
|
|
|
|
|
<el-form-item label="记录仪打包周期" prop="cpcQuantity">
|
|
|
|
|
<!-- <el-input placeholder="请输入记录仪打包周期" v-model="setForm.cpcQuantity"></el-input> -->
|
|
|
|
|
<el-input-number
|
|
|
|
|
v-model="setForm.cpcQuantity"
|
|
|
|
|
controls-position="right"
|
|
|
|
|
@change="handleChange"
|
|
|
|
|
:min="1"
|
|
|
|
|
></el-input-number>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item prop="cpcUnit">
|
|
|
|
|
<el-radio-group v-model="setForm.cpcUnit" size="small">
|
|
|
|
|
<el-radio label="0" border>年</el-radio>
|
|
|
|
|
<el-radio label="1" border>月</el-radio>
|
|
|
|
|
<el-radio label="2" border>日</el-radio>
|
|
|
|
|
<el-radio label="3" border>时</el-radio>
|
|
|
|
|
<el-radio label="4" border>分</el-radio>
|
|
|
|
|
<el-radio label="5" border>秒</el-radio>
|
|
|
|
|
</el-radio-group>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-form>
|
|
|
|
|
<template #footer>
|
|
|
|
|
<span class="dialog-footer">
|
|
|
|
|
<el-button @click="settingDialog = false">取 消</el-button>
|
|
|
|
|
<el-button type="primary" @click="submitCycle">确 定</el-button>
|
|
|
|
|
</span>
|
|
|
|
|
</template>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
<el-dialog append-to-body title="新增" v-model="addDialog" width="80%">
|
|
|
|
|
<div style="display: flex; align-items: center" v-if="addType == 'add'">
|
|
|
|
|
<span>设备编号</span>
|
|
|
|
|
<el-input style="width: 300px; margin-left: 10px" v-model="deviceCode"></el-input>
|
|
|
|
|
</div>
|
|
|
|
|
<div style="margin: 10px 0">
|
|
|
|
|
<el-button type="primary" icon="el-icon-plus" @click="insertEvent()">插入一行</el-button>
|
|
|
|
|
<el-button plain type="danger" @click="remove">删除选择行</el-button>
|
|
|
|
|
<el-button type="primary" @click="handleSave">保存</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
<el-table :data="settingData" @select="selectChange">
|
|
|
|
|
<el-table-column type="selection"></el-table-column>
|
|
|
|
|
<el-table-column label="参数名称" prop="name" align="center">
|
|
|
|
|
<template #default="scope">
|
|
|
|
|
<el-input v-model="scope.row.name"></el-input>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column label="参数显示名称" prop="showName" align="center">
|
|
|
|
|
<template #default="scope">
|
|
|
|
|
<el-input v-model="scope.row.showName"></el-input>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column label="是否显示曲线图" prop="showGraph" align="center">
|
|
|
|
|
<template #default="scope">
|
|
|
|
|
<el-switch
|
|
|
|
|
v-model="scope.row.showGraph"
|
|
|
|
|
active-color="#13ce66"
|
|
|
|
|
inactive-color="#ff4949"
|
|
|
|
|
>
|
|
|
|
|
</el-switch>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column label="曲线X轴间隔" prop="crcX" align="center">
|
|
|
|
|
<template #default="scope">
|
|
|
|
|
<!-- <el-input v-model="scope.row.crcX"></el-input> -->
|
|
|
|
|
<el-input
|
|
|
|
|
v-model.number="scope.row.crcX"
|
|
|
|
|
oninput="scope.row.crcX=scope.row.crcX.replace(/[^\d]/g,'')"
|
|
|
|
|
>
|
|
|
|
|
></el-input
|
|
|
|
|
>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
</el-table>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
</basic-container>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
import recorderColumnData from './js/recorderColumnData';
|
|
|
|
|
import { getRecorderList,addRecorder,updateRecorder,deleteRecorder,getRecorderDetail,addpackCycle } from '@/api/equiptManagement/recorderList';
|
|
|
|
|
export default {
|
|
|
|
|
data() {
|
|
|
|
|
return {
|
|
|
|
|
searchForm: {},
|
|
|
|
|
searchRules: {
|
|
|
|
|
code: [{ required: true, message: '请输入设备编码', trigger: 'blur' }],
|
|
|
|
|
queryDate: [{ required: true, message: '请选择统计日期', trigger: 'blur' }],
|
|
|
|
|
},
|
|
|
|
|
deviceCode: '',
|
|
|
|
|
settingData: [],
|
|
|
|
|
tabPosition: 'recorder',
|
|
|
|
|
loading: false,
|
|
|
|
|
data: [],
|
|
|
|
|
form: {},
|
|
|
|
|
detailDialog: false,
|
|
|
|
|
detailData: [],
|
|
|
|
|
settingDialog: false,
|
|
|
|
|
page: {
|
|
|
|
|
pageSize: 10,
|
|
|
|
|
currentPage: 1,
|
|
|
|
|
total: 0,
|
|
|
|
|
},
|
|
|
|
|
addType: 'add',
|
|
|
|
|
addDialog: false,
|
|
|
|
|
setForm: {},
|
|
|
|
|
setRules: {
|
|
|
|
|
cpcQuantity: [{ required: true, message: '请输入记录仪打包周期', trigger: 'blur' }],
|
|
|
|
|
},
|
|
|
|
|
option: {
|
|
|
|
|
columnSort: true,
|
|
|
|
|
tip: false,
|
|
|
|
|
height: 'auto',
|
|
|
|
|
align: 'center',
|
|
|
|
|
calcHeight: 32,
|
|
|
|
|
simplePage: false,
|
|
|
|
|
searchShow: true,
|
|
|
|
|
searchMenuSpan: 6,
|
|
|
|
|
searchIcon: true,
|
|
|
|
|
searchIndex: 3,
|
|
|
|
|
tree: false,
|
|
|
|
|
border: true,
|
|
|
|
|
index: false,
|
|
|
|
|
selection: false,
|
|
|
|
|
viewBtn: false,
|
|
|
|
|
delBtn: false,
|
|
|
|
|
editBtn: false,
|
|
|
|
|
addBtnIcon: ' ',
|
|
|
|
|
viewBtnIcon: ' ',
|
|
|
|
|
delBtnIcon: ' ',
|
|
|
|
|
editBtnIcon: ' ',
|
|
|
|
|
addBtn: true,
|
|
|
|
|
labelWidth: 120,
|
|
|
|
|
searchLabelWidth: 120,
|
|
|
|
|
menu: true,
|
|
|
|
|
menuWidth: 200,
|
|
|
|
|
dialogWidth: 600,
|
|
|
|
|
dialogClickModal: false,
|
|
|
|
|
searchEnter: true,
|
|
|
|
|
excelBtn: true,
|
|
|
|
|
gridBtn: false,
|
|
|
|
|
searchShowBtn: false,
|
|
|
|
|
showOverflowTooltip: true,
|
|
|
|
|
searchLabelPosition: 'left',
|
|
|
|
|
searchLabelPosition: 'left',
|
|
|
|
|
searchGutter: 24,
|
|
|
|
|
searchSpan: 6,
|
|
|
|
|
menuAlign: 'left',
|
|
|
|
|
gridBtn: false,
|
|
|
|
|
searchMenuPosition: 'right',
|
|
|
|
|
column: [],
|
|
|
|
|
},
|
|
|
|
|
detailOption: {
|
|
|
|
|
columnSort: true,
|
|
|
|
|
tip: false,
|
|
|
|
|
height: 'auto',
|
|
|
|
|
align: 'center',
|
|
|
|
|
calcHeight: 32,
|
|
|
|
|
simplePage: false,
|
|
|
|
|
searchShow: true,
|
|
|
|
|
searchMenuSpan: 6,
|
|
|
|
|
searchIcon: true,
|
|
|
|
|
searchIndex: 3,
|
|
|
|
|
tree: false,
|
|
|
|
|
border: true,
|
|
|
|
|
index: true,
|
|
|
|
|
selection: false,
|
|
|
|
|
viewBtn: false,
|
|
|
|
|
delBtn: false,
|
|
|
|
|
editBtn: false,
|
|
|
|
|
delBtnIcon: ' ',
|
|
|
|
|
addBtn: false,
|
|
|
|
|
labelWidth: 120,
|
|
|
|
|
searchLabelWidth: 120,
|
|
|
|
|
menu: false,
|
|
|
|
|
menuWidth: 200,
|
|
|
|
|
dialogWidth: 600,
|
|
|
|
|
dialogClickModal: false,
|
|
|
|
|
searchEnter: true,
|
|
|
|
|
excelBtn: true,
|
|
|
|
|
gridBtn: false,
|
|
|
|
|
searchShowBtn: false,
|
|
|
|
|
showOverflowTooltip: true,
|
|
|
|
|
searchLabelPosition: 'left',
|
|
|
|
|
searchLabelPosition: 'left',
|
|
|
|
|
searchGutter: 24,
|
|
|
|
|
searchSpan: 6,
|
|
|
|
|
menuAlign: 'left',
|
|
|
|
|
gridBtn: false,
|
|
|
|
|
searchMenuPosition: 'right',
|
|
|
|
|
column: [
|
|
|
|
|
{
|
|
|
|
|
label: '记录仪',
|
|
|
|
|
prop: 'recorder',
|
|
|
|
|
span: 24,
|
|
|
|
|
labelWidth: 140,
|
|
|
|
|
addDisplay: false,
|
|
|
|
|
editDisplay: false,
|
|
|
|
|
overflow: true,
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
label: '使用时间',
|
|
|
|
|
prop: 'recordDate',
|
|
|
|
|
span: 24,
|
|
|
|
|
labelWidth: 140,
|
|
|
|
|
addDisplay: false,
|
|
|
|
|
editDisplay: false,
|
|
|
|
|
overflow: true,
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
label: '数据信息',
|
|
|
|
|
prop: 'memo',
|
|
|
|
|
span: 24,
|
|
|
|
|
labelWidth: 140,
|
|
|
|
|
addDisplay: false,
|
|
|
|
|
editDisplay: false,
|
|
|
|
|
overflow: true,
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
},
|
|
|
|
|
detailPage: {
|
|
|
|
|
pageSize: 10,
|
|
|
|
|
currentPage: 1,
|
|
|
|
|
total: 0,
|
|
|
|
|
},
|
|
|
|
|
detailForm: {},
|
|
|
|
|
};
|
|
|
|
|
},
|
|
|
|
|
mounted() {
|
|
|
|
|
this.tabPositionChange();
|
|
|
|
|
this.option.column = recorderColumnData[this.tabPosition];
|
|
|
|
|
},
|
|
|
|
|
methods: {
|
|
|
|
|
// 查询
|
|
|
|
|
onSubmit() {
|
|
|
|
|
this.$refs.searchForm.validate(valid => {
|
|
|
|
|
if (valid) {
|
|
|
|
|
let chartData = {
|
|
|
|
|
yArray: [
|
|
|
|
|
{
|
|
|
|
|
showName: '压力',
|
|
|
|
|
yData: [
|
|
|
|
|
11.75, 1.0, 0.15, 1.9, 11.75, 0.15, 1.75, 1.9, 1.0, 1.75, 1.0, 0.15, 0.15, 1.9,
|
|
|
|
|
1.0, 1.75, 1.9, 11.75, 1.75, 11.75, 11.75, 1.0, 0.15, 1.9, 11.75, 0.15, 1.75, 1.9,
|
|
|
|
|
1.0, 1.75, 1.0, 0.15, 0.15, 1.9, 1.0, 1.75, 1.9, 11.75, 1.75, 11.75, 11.75, 1.0,
|
|
|
|
|
0.15, 1.9, 11.75, 0.15, 1.75, 1.9, 1.0, 1.75, 1.0, 0.15, 0.15, 1.9, 1.0, 1.75,
|
|
|
|
|
1.9, 11.75, 1.75, 11.75, 11.75, 1.0, 0.15, 1.9, 11.75, 0.15, 1.75, 1.9, 1.0, 1.75,
|
|
|
|
|
1.0, 0.15, 0.15, 1.9, 1.0, 1.75, 1.9, 11.75, 1.75, 11.75,
|
|
|
|
|
],
|
|
|
|
|
crcY: 0.25,
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
showName: '温度',
|
|
|
|
|
yData: [
|
|
|
|
|
85.0, 500.0, 30.0, 500.0, 85.0, 30.0, 65.0, 500.0, 500.0, 65.0, 500.0, 30.0, 30.0,
|
|
|
|
|
500.0, 500.0, 65.0, 500.0, 85.0, 65.0, 85.0, 85.0, 500.0, 30.0, 500.0, 85.0, 30.0,
|
|
|
|
|
65.0, 500.0, 500.0, 65.0, 500.0, 30.0, 30.0, 500.0, 500.0, 65.0, 500.0, 85.0,
|
|
|
|
|
65.0, 85.0, 85.0, 500.0, 30.0, 500.0, 85.0, 30.0, 65.0, 500.0, 500.0, 65.0, 500.0,
|
|
|
|
|
30.0, 30.0, 500.0, 500.0, 65.0, 500.0, 85.0, 65.0, 85.0, 85.0, 500.0, 30.0, 500.0,
|
|
|
|
|
85.0, 30.0, 65.0, 500.0, 500.0, 65.0, 500.0, 30.0, 30.0, 500.0, 500.0, 65.0,
|
|
|
|
|
500.0, 85.0, 65.0, 85.0,
|
|
|
|
|
],
|
|
|
|
|
crcY: 65.0,
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
showName: '低真空',
|
|
|
|
|
yData: [
|
|
|
|
|
12.0, 7.8, 1.0, 7.5, 12.0, 1.0, 6.0, 7.5, 7.8, 6.0, 7.8, 1.0, 1.0, 7.5, 7.8, 6.0,
|
|
|
|
|
7.5, 12.0, 6.0, 12.0, 12.0, 7.8, 1.0, 7.5, 12.0, 1.0, 6.0, 7.5, 7.8, 6.0, 7.8,
|
|
|
|
|
1.0, 1.0, 7.5, 7.8, 6.0, 7.5, 12.0, 6.0, 12.0, 12.0, 7.8, 1.0, 7.5, 12.0, 1.0,
|
|
|
|
|
6.0, 7.5, 7.8, 6.0, 7.8, 1.0, 1.0, 7.5, 7.8, 6.0, 7.5, 12.0, 6.0, 12.0, 12.0, 7.8,
|
|
|
|
|
1.0, 7.5, 12.0, 1.0, 6.0, 7.5, 7.8, 6.0, 7.8, 1.0, 1.0, 7.5, 7.8, 6.0, 7.5, 12.0,
|
|
|
|
|
6.0, 12.0,
|
|
|
|
|
],
|
|
|
|
|
crcY: 1.0,
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
showName: '高真空',
|
|
|
|
|
yData: [
|
|
|
|
|
1.875, 0.875, 0.101, 0.375, 1.875, 0.101, 0.875, 0.375, 0.875, 0.875, 0.875,
|
|
|
|
|
0.101, 0.101, 0.375, 0.875, 0.875, 0.375, 1.875, 0.875, 1.875, 1.875, 0.875,
|
|
|
|
|
0.101, 0.375, 1.875, 0.101, 0.875, 0.375, 0.875, 0.875, 0.875, 0.101, 0.101,
|
|
|
|
|
0.375, 0.875, 0.875, 0.375, 1.875, 0.875, 1.875, 1.875, 0.875, 0.101, 0.375,
|
|
|
|
|
1.875, 0.101, 0.875, 0.375, 0.875, 0.875, 0.875, 0.101, 0.101, 0.375, 0.875,
|
|
|
|
|
0.875, 0.375, 1.875, 0.875, 1.875, 1.875, 0.875, 0.101, 0.375, 1.875, 0.101,
|
|
|
|
|
0.875, 0.375, 0.875, 0.875, 0.875, 0.101, 0.101, 0.375, 0.875, 0.875, 0.375,
|
|
|
|
|
1.875, 0.875, 1.875,
|
|
|
|
|
],
|
|
|
|
|
crcY: 0.125,
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
xData: [
|
|
|
|
|
'2024-03-16 12:01:17.0',
|
|
|
|
|
'2024-03-16 12:13:11.0',
|
|
|
|
|
'2024-03-16 12:20:12.0',
|
|
|
|
|
'2024-03-16 12:20:25.0',
|
|
|
|
|
'2024-03-16 12:21:27.0',
|
|
|
|
|
'2024-03-16 12:30:00.0',
|
|
|
|
|
'2024-03-16 12:30:27.0',
|
|
|
|
|
'2024-03-16 12:40:15.0',
|
|
|
|
|
'2024-03-16 12:43:10.0',
|
|
|
|
|
'2024-03-16 12:50:17.0',
|
|
|
|
|
'2024-03-16 16:13:11.0',
|
|
|
|
|
'2024-03-16 16:20:12.0',
|
|
|
|
|
'2024-03-16 16:30:00.0',
|
|
|
|
|
'2024-03-16 16:40:15.0',
|
|
|
|
|
'2024-03-16 16:43:10.0',
|
|
|
|
|
'2024-03-16 16:50:17.0',
|
|
|
|
|
'2024-03-16 17:20:25.0',
|
|
|
|
|
'2024-03-16 17:21:27.0',
|
|
|
|
|
'2024-03-16 17:30:27.0',
|
|
|
|
|
'2024-03-16 17:41:17.0',
|
|
|
|
|
'2024-03-17 12:01:17.0',
|
|
|
|
|
'2024-03-17 12:13:11.0',
|
|
|
|
|
'2024-03-17 12:20:12.0',
|
|
|
|
|
'2024-03-17 12:20:25.0',
|
|
|
|
|
'2024-03-17 12:21:27.0',
|
|
|
|
|
'2024-03-17 12:30:00.0',
|
|
|
|
|
'2024-03-17 12:30:27.0',
|
|
|
|
|
'2024-03-17 12:40:15.0',
|
|
|
|
|
'2024-03-17 12:43:10.0',
|
|
|
|
|
'2024-03-17 12:50:17.0',
|
|
|
|
|
'2024-03-17 16:13:11.0',
|
|
|
|
|
'2024-03-17 16:20:12.0',
|
|
|
|
|
'2024-03-17 16:30:00.0',
|
|
|
|
|
'2024-03-17 16:40:15.0',
|
|
|
|
|
'2024-03-17 16:43:10.0',
|
|
|
|
|
'2024-03-17 16:50:17.0',
|
|
|
|
|
'2024-03-17 17:20:25.0',
|
|
|
|
|
'2024-03-17 17:21:27.0',
|
|
|
|
|
'2024-03-17 17:30:27.0',
|
|
|
|
|
'2024-03-17 17:41:17.0',
|
|
|
|
|
'2024-03-18 12:01:17.0',
|
|
|
|
|
'2024-03-18 12:13:11.0',
|
|
|
|
|
'2024-03-18 12:20:12.0',
|
|
|
|
|
'2024-03-18 12:20:25.0',
|
|
|
|
|
'2024-03-18 12:21:27.0',
|
|
|
|
|
'2024-03-18 12:30:00.0',
|
|
|
|
|
'2024-03-18 12:30:27.0',
|
|
|
|
|
'2024-03-18 12:40:15.0',
|
|
|
|
|
'2024-03-18 12:43:10.0',
|
|
|
|
|
'2024-03-18 12:50:17.0',
|
|
|
|
|
'2024-03-18 16:13:11.0',
|
|
|
|
|
'2024-03-18 16:20:12.0',
|
|
|
|
|
'2024-03-18 16:30:00.0',
|
|
|
|
|
'2024-03-18 16:40:15.0',
|
|
|
|
|
'2024-03-18 16:43:10.0',
|
|
|
|
|
'2024-03-18 16:50:17.0',
|
|
|
|
|
'2024-03-18 17:20:25.0',
|
|
|
|
|
'2024-03-18 17:21:27.0',
|
|
|
|
|
'2024-03-18 17:30:27.0',
|
|
|
|
|
'2024-03-18 17:41:17.0',
|
|
|
|
|
'2024-03-19 12:01:17.0',
|
|
|
|
|
'2024-03-19 12:13:11.0',
|
|
|
|
|
'2024-03-19 12:20:12.0',
|
|
|
|
|
'2024-03-19 12:20:25.0',
|
|
|
|
|
'2024-03-19 12:21:27.0',
|
|
|
|
|
'2024-03-19 12:30:00.0',
|
|
|
|
|
'2024-03-19 12:30:27.0',
|
|
|
|
|
'2024-03-19 12:40:15.0',
|
|
|
|
|
'2024-03-19 12:43:10.0',
|
|
|
|
|
'2024-03-19 12:50:17.0',
|
|
|
|
|
'2024-03-19 16:13:11.0',
|
|
|
|
|
'2024-03-19 16:20:12.0',
|
|
|
|
|
'2024-03-19 16:30:00.0',
|
|
|
|
|
'2024-03-19 16:40:15.0',
|
|
|
|
|
'2024-03-19 16:43:10.0',
|
|
|
|
|
'2024-03-19 16:50:17.0',
|
|
|
|
|
'2024-03-19 17:20:25.0',
|
|
|
|
|
'2024-03-19 17:21:27.0',
|
|
|
|
|
'2024-03-19 17:30:27.0',
|
|
|
|
|
'2024-03-19 17:41:17.0',
|
|
|
|
|
],
|
|
|
|
|
crcX: 2,
|
|
|
|
|
};
|
|
|
|
|
this.$nextTick(() => {
|
|
|
|
|
this.setEchart(chartData);
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
setEchart(data) {
|
|
|
|
|
if (data.xData.length == 0 || data.yArray.length == 0) {
|
|
|
|
|
return this.$message.warning('暂无数据');
|
|
|
|
|
}
|
|
|
|
|
const chart = this.$echarts.init(this.$refs.historyCurve);
|
|
|
|
|
var colors = [
|
|
|
|
|
'#5793f3',
|
|
|
|
|
'#d14a61',
|
|
|
|
|
'#675bba',
|
|
|
|
|
'#C502F3',
|
|
|
|
|
'#0102F3',
|
|
|
|
|
'#FF2366',
|
|
|
|
|
'red',
|
|
|
|
|
'orange',
|
|
|
|
|
'green',
|
|
|
|
|
'blue',
|
|
|
|
|
'purple',
|
|
|
|
|
'pink',
|
|
|
|
|
'orange',
|
|
|
|
|
'blue',
|
|
|
|
|
];
|
|
|
|
|
const yAxis = [];
|
|
|
|
|
const series = [];
|
|
|
|
|
|
|
|
|
|
let offsetArr = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
|
|
|
|
|
|
|
|
|
|
const le = data.yArray.length;
|
|
|
|
|
if (le >= 1 && le <= 2) {
|
|
|
|
|
offsetArr = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
|
|
|
|
|
} else if (le >= 3 && le <= 4) {
|
|
|
|
|
offsetArr = [70, 70, 10, 10, 0, 0, 0, 0, 0, 0];
|
|
|
|
|
} else if (le >= 5 && le <= 6) {
|
|
|
|
|
offsetArr = [142, 142, 70, 70, 0, 0, 0, 0, 0, 0];
|
|
|
|
|
} else if (le >= 7 && le <= 8) {
|
|
|
|
|
offsetArr = [203, 203, 140, 140, 70, 70, 0, 0, 0, 0];
|
|
|
|
|
} else if (le >= 9 && le <= 10) {
|
|
|
|
|
offsetArr = [273, 273, 203, 203, 130, 130, 60, 60, 0, 0];
|
|
|
|
|
}
|
|
|
|
|
for (var index = 0; index < le; index++) {
|
|
|
|
|
if (index % 2 == 0) {
|
|
|
|
|
yAxis.push({
|
|
|
|
|
type: 'value',
|
|
|
|
|
name: data.yArray[index].showName,
|
|
|
|
|
position: 'left',
|
|
|
|
|
offset: offsetArr[le - index - 1],
|
|
|
|
|
|
|
|
|
|
axisLine: {
|
|
|
|
|
lineStyle: {
|
|
|
|
|
color: colors[index],
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
});
|
|
|
|
|
} else {
|
|
|
|
|
yAxis.push({
|
|
|
|
|
type: 'value',
|
|
|
|
|
name: data.yArray[index].showName,
|
|
|
|
|
position: 'right',
|
|
|
|
|
offset: offsetArr[le - index],
|
|
|
|
|
|
|
|
|
|
axisLine: {
|
|
|
|
|
lineStyle: {
|
|
|
|
|
color: colors[index],
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
series.push({
|
|
|
|
|
name: data.yArray[index].showName,
|
|
|
|
|
type: 'line',
|
|
|
|
|
smooth: true,
|
|
|
|
|
showSymbol: false,
|
|
|
|
|
yAxisIndex: index,
|
|
|
|
|
data: data.yArray[index].yData,
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
const option = {
|
|
|
|
|
color: colors,
|
|
|
|
|
toolbox: {
|
|
|
|
|
show: true,
|
|
|
|
|
right: '4%',
|
|
|
|
|
top: '-1%',
|
|
|
|
|
feature: {
|
|
|
|
|
saveAsImage: { show: true }, // 保存图表
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
tooltip: {
|
|
|
|
|
trigger: 'axis',
|
|
|
|
|
axisPointer: { type: 'cross' },
|
|
|
|
|
},
|
|
|
|
|
grid: {
|
|
|
|
|
top: '10%',
|
|
|
|
|
right: parseInt((le + 1) / 2) * 5 + '%',
|
|
|
|
|
left: parseInt((le + 1) / 2) * 5 + '%',
|
|
|
|
|
},
|
|
|
|
|
xAxis: [
|
|
|
|
|
{
|
|
|
|
|
type: 'category',
|
|
|
|
|
axisTick: {
|
|
|
|
|
alignWithLabel: true,
|
|
|
|
|
},
|
|
|
|
|
data: data.xData,
|
|
|
|
|
boundaryGap: false,
|
|
|
|
|
interval: 2, // 步长
|
|
|
|
|
axisLabel: {
|
|
|
|
|
formatter: function (value, index) {
|
|
|
|
|
if (data.crcX > 1) {
|
|
|
|
|
if (parseInt(index % data.crcX) == 0) {
|
|
|
|
|
return value;
|
|
|
|
|
} else {
|
|
|
|
|
return '';
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
return value;
|
|
|
|
|
},
|
|
|
|
|
rotate: 25,
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
yAxis: yAxis,
|
|
|
|
|
series: series,
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
// 使用制定的配置项和数据显示图表
|
|
|
|
|
chart.setOption(option, true);
|
|
|
|
|
// 图表自适应
|
|
|
|
|
window.addEventListener('resize', function () {
|
|
|
|
|
chart.resize();
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
getRecorder() {
|
|
|
|
|
getRecorderList({
|
|
|
|
|
current: this.page.currentPage,
|
|
|
|
|
size: this.page.pageSize,
|
|
|
|
|
}).then(res => {
|
|
|
|
|
this.data = res.data.data.records;
|
|
|
|
|
this.page.total = res.data.data.total;
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
// tab切换
|
|
|
|
|
tabPositionChange(val) {
|
|
|
|
|
this.option.column = recorderColumnData[val];
|
|
|
|
|
if (this.tabPosition == 'recorderLineSetting') {
|
|
|
|
|
this.option.addBtn = false;
|
|
|
|
|
this.data = [
|
|
|
|
|
{
|
|
|
|
|
code: '001',
|
|
|
|
|
crcId: 1,
|
|
|
|
|
crcX: 2,
|
|
|
|
|
crcY: 65.0,
|
|
|
|
|
keyValue: 1,
|
|
|
|
|
name: 'Var2',
|
|
|
|
|
showGraph: true,
|
|
|
|
|
showName: '温度',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
code: '001',
|
|
|
|
|
crcId: 3,
|
|
|
|
|
crcX: 2,
|
|
|
|
|
crcY: 0.25,
|
|
|
|
|
keyValue: 3,
|
|
|
|
|
name: 'Var1',
|
|
|
|
|
showGraph: true,
|
|
|
|
|
showName: '压力',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
code: '001',
|
|
|
|
|
crcId: 4,
|
|
|
|
|
crcX: 2,
|
|
|
|
|
crcY: 1.0,
|
|
|
|
|
keyValue: 4,
|
|
|
|
|
name: 'Var3',
|
|
|
|
|
showGraph: true,
|
|
|
|
|
showName: '低真空',
|
|
|
|
|
},
|
|
|
|
|
];
|
|
|
|
|
this.page.total = this.data.length;
|
|
|
|
|
} else if (this.tabPosition == 'recorder') {
|
|
|
|
|
this.getRecorder();
|
|
|
|
|
// this.option.addBtn = true
|
|
|
|
|
// this.data = [
|
|
|
|
|
// { crtCode: '001', memo: '' },
|
|
|
|
|
// { crtCode: '002', memo: '' },
|
|
|
|
|
// { crtCode: '003', memo: '' },
|
|
|
|
|
// ]
|
|
|
|
|
// this.page.total = this.data.length
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
insertEvent() {
|
|
|
|
|
const record = { _select: false };
|
|
|
|
|
this.settingData.push(record);
|
|
|
|
|
},
|
|
|
|
|
selectChange(list, row) {
|
|
|
|
|
row._select = !row._select;
|
|
|
|
|
},
|
|
|
|
|
rowSave(row, done, loading){
|
|
|
|
|
if(this.tabPosition == "recorder"){
|
|
|
|
|
let params = {
|
|
|
|
|
crtCode:row.crtCode,
|
|
|
|
|
memo:row.memo
|
|
|
|
|
}
|
|
|
|
|
addRecorder(params).then(res =>{
|
|
|
|
|
if(res.data.code == 200){
|
|
|
|
|
this.$message.success('新增成功')
|
|
|
|
|
done()
|
|
|
|
|
this.getRecorder()
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
rowUpdate(row, index, done, loading){
|
|
|
|
|
console.log('row--------------',row)
|
|
|
|
|
console.log('tabPosition--------------',this.tabPosition)
|
|
|
|
|
if(this.tabPosition == "recorder"){
|
|
|
|
|
let params = {
|
|
|
|
|
id:row.id,
|
|
|
|
|
crtCode:row.crtCode,
|
|
|
|
|
memo:row.memo
|
|
|
|
|
}
|
|
|
|
|
console.log('params-----------',params)
|
|
|
|
|
updateRecorder(params).then(res =>{
|
|
|
|
|
if(res.data.code == 200){
|
|
|
|
|
this.$message.success('修改成功')
|
|
|
|
|
done()
|
|
|
|
|
this.getRecorder()
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
remove() {
|
|
|
|
|
let arr = this.settingData.filter(item => item._select);
|
|
|
|
|
if (arr.length != 0) {
|
|
|
|
|
this.$confirm('确定将选择数据删除?', {
|
|
|
|
|
confirmButtonText: '确定',
|
|
|
|
|
cancelButtonText: '取消',
|
|
|
|
|
type: 'warning',
|
|
|
|
|
}).then(() => {
|
|
|
|
|
if (this.rowId) {
|
|
|
|
|
let deleteData = this.settingData.filter(item => item._select);
|
|
|
|
|
this.deleteTidArr = deleteData.filter(item => item.tidId);
|
|
|
|
|
}
|
|
|
|
|
let deleteArr = this.settingData.filter(item => !item._select);
|
|
|
|
|
this.settingData = deleteArr;
|
|
|
|
|
});
|
|
|
|
|
} else {
|
|
|
|
|
this.$message.error('请至少选择一条数据进行操作！');
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
handleSave() {
|
|
|
|
|
this.addDialog = false;
|
|
|
|
|
},
|
|
|
|
|
rowEdit(row, index) {
|
|
|
|
|
if (this.tabPosition == 'recorder') {
|
|
|
|
|
this.$refs.crud.rowEdit(row, index);
|
|
|
|
|
} else if (this.tabPosition == 'recorderLineSetting') {
|
|
|
|
|
this.addType = 'edit';
|
|
|
|
|
this.settingData = [
|
|
|
|
|
{
|
|
|
|
|
code: '001',
|
|
|
|
|
crcId: 1,
|
|
|
|
|
crcX: 2,
|
|
|
|
|
crcY: 65.0,
|
|
|
|
|
keyValue: 1,
|
|
|
|
|
name: 'Var2',
|
|
|
|
|
showGraph: true,
|
|
|
|
|
showName: '温度',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
code: '001',
|
|
|
|
|
crcId: 3,
|
|
|
|
|
crcX: 2,
|
|
|
|
|
crcY: 0.25,
|
|
|
|
|
keyValue: 3,
|
|
|
|
|
name: 'Var1',
|
|
|
|
|
showGraph: true,
|
|
|
|
|
showName: '压力',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
code: '001',
|
|
|
|
|
crcId: 4,
|
|
|
|
|
crcX: 2,
|
|
|
|
|
crcY: 1.0,
|
|
|
|
|
keyValue: 4,
|
|
|
|
|
name: 'Var3',
|
|
|
|
|
showGraph: true,
|
|
|
|
|
showName: '低真空',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
code: '001',
|
|
|
|
|
crcId: 5,
|
|
|
|
|
crcX: 2,
|
|
|
|
|
crcY: 0.125,
|
|
|
|
|
keyValue: 5,
|
|
|
|
|
name: 'Var4',
|
|
|
|
|
showGraph: true,
|
|
|
|
|
showName: '高真空',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
code: '001',
|
|
|
|
|
crcId: 49,
|
|
|
|
|
crcX: 2,
|
|
|
|
|
crcY: null,
|
|
|
|
|
keyValue: 49,
|
|
|
|
|
name: 'Var5',
|
|
|
|
|
showGraph: false,
|
|
|
|
|
showName: 'Var5',
|
|
|
|
|
},
|
|
|
|
|
];
|
|
|
|
|
this.addDialog = true;
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
showDetail(row) {
|
|
|
|
|
this.loadData();
|
|
|
|
|
this.detailDialog = true;
|
|
|
|
|
getRecorderDetail({id:row.id}).then(res =>{
|
|
|
|
|
console.log('res----------------',res)
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
setCycle() {
|
|
|
|
|
this.settingDialog = true;
|
|
|
|
|
},
|
|
|
|
|
handleAdd() {
|
|
|
|
|
this.addType = 'add';
|
|
|
|
|
this.addDialog = true;
|
|
|
|
|
},
|
|
|
|
|
deleteRow(row) {
|
|
|
|
|
this.$confirm('确定删除本条数据?', {
|
|
|
|
|
confirmButtonText: '确定',
|
|
|
|
|
cancelButtonText: '取消',
|
|
|
|
|
type: 'warning',
|
|
|
|
|
}).then(() => {
|
|
|
|
|
if(this.tabPosition == 'recorder'){
|
|
|
|
|
deleteRecorder({ids:row.id}).then(res => {
|
|
|
|
|
if(res.data.code == 200){
|
|
|
|
|
this.$message.success('删除成功')
|
|
|
|
|
this.getRecorder()
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
submitCycle() {
|
|
|
|
|
this.$refs.setForm.validate(valid => {
|
|
|
|
|
if (valid) {
|
|
|
|
|
console.log('set-------------',this.setForm)
|
|
|
|
|
// this.settingDialog = false;
|
|
|
|
|
addpackCycle(this.setForm).then(res => {
|
|
|
|
|
if(res.data.code == 200){
|
|
|
|
|
this.$message.success('保存成功')
|
|
|
|
|
this.settingDialog = false;
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
loadData() {
|
|
|
|
|
this.detailData = [
|
|
|
|
|
{ recorder: '1302022', recordDate: '2025-07-26 16:04:43' },
|
|
|
|
|
{ recorder: '1302022', recordDate: '2025-07-26 16:04:43' },
|
|
|
|
|
{ recorder: '1302022', recordDate: '2025-07-26 16:04:43' },
|
|
|
|
|
{ recorder: '1302022', recordDate: '2025-07-26 16:04:43' },
|
|
|
|
|
];
|
|
|
|
|
this.detailPage.total = this.detailData.length;
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
onLoad() {
|
|
|
|
|
this.data = [
|
|
|
|
|
{ crtCode: '001', memo: '' },
|
|
|
|
|
{ crtCode: '002', memo: '' },
|
|
|
|
|
{ crtCode: '003', memo: '' },
|
|
|
|
|
];
|
|
|
|
|
this.page.total = this.data.length;
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
};
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style></style>
|
