379 lines
11 KiB
Vue
379 lines
11 KiB
Vue
<template>
|
|
<div>
|
|
<el-dialog title="详情" :visible.sync="xqFlag" width="30%">
|
|
<div class="xqbox">
|
|
<p>
|
|
<span class="s1">网关SN:</span> <span>{{ rowDate.wgsn }}</span>
|
|
</p>
|
|
<p>
|
|
<span class="s1">网关编号:</span> <span>{{ rowDate.wgbh }}</span>
|
|
</p>
|
|
<p>
|
|
<span class="s1">网关名称:</span> <span>{{ rowDate.wgmc }}</span>
|
|
</p>
|
|
<p>
|
|
<span class="s1">参数key:</span> <span>{{ rowDate.cskey }}</span>
|
|
</p>
|
|
<p>
|
|
<span class="s1">参数名称:</span> <span>{{ rowDate.csmc }}</span>
|
|
</p>
|
|
<p>
|
|
<span class="s1">小数位数:</span> <span>{{ rowDate.xsws }}</span>
|
|
</p>
|
|
<p>
|
|
<span class="s1">设定值:</span> <span>{{ rowDate.sdz }}</span>
|
|
</p>
|
|
<p>
|
|
<span class="s1">偏差值:</span> <span>{{ rowDate.pcz }}</span>
|
|
</p>
|
|
<p>
|
|
<span class="s1">维护人:</span> <span>{{ rowDate.whr }}</span>
|
|
</p>
|
|
<p>
|
|
<span class="s1">维护时间:</span> <span>{{ rowDate.whsj }}</span>
|
|
</p>
|
|
</div>
|
|
</el-dialog>
|
|
|
|
<el-dialog
|
|
title="网关维护"
|
|
:visible.sync="dialogVisible"
|
|
:append-to-body="true"
|
|
width="90%"
|
|
>
|
|
<div class="title">
|
|
<div class="left">
|
|
<el-button @click="flag = true">新增参数</el-button>
|
|
<el-button @click="deleteSelectedRows">删除</el-button>
|
|
</div>
|
|
<!-- <div class="right">
|
|
<el-input type="search" style="margin-right: 10px"></el-input>
|
|
<el-button>筛选</el-button>
|
|
</div> -->
|
|
</div>
|
|
<el-table
|
|
ref="multipleTable"
|
|
:data="tableData"
|
|
border
|
|
style="margin-top: 10px"
|
|
tooltip-effect="dark"
|
|
@selection-change="handleSelectionChange"
|
|
>
|
|
<el-table-column label="序号">
|
|
<template slot-scope="scope">
|
|
{{ scope.$index + 1 }}
|
|
</template></el-table-column
|
|
>
|
|
<el-table-column type="selection" width="55"> </el-table-column>
|
|
<el-table-column prop="wgsn" label="网关SN"> </el-table-column>
|
|
<el-table-column prop="wgbh" label="网关编号"> </el-table-column>
|
|
<el-table-column prop="wgmc" label="网关名称"> </el-table-column>
|
|
<el-table-column prop="cskey" label="参数Key"> </el-table-column>
|
|
<el-table-column prop="csmc" label="参数名称"> </el-table-column>
|
|
<el-table-column prop="xsws" label="小数位数"> </el-table-column>
|
|
<el-table-column prop="sdz" label="设定值"> </el-table-column>
|
|
<el-table-column prop="pcz" label="偏差值"> </el-table-column>
|
|
<el-table-column prop="whr" label="维护人"> </el-table-column>
|
|
<el-table-column prop="whsj" label="维护时间"> </el-table-column>
|
|
|
|
<el-table-column label="修改">
|
|
<template slot-scope="scope">
|
|
<el-button
|
|
type="text"
|
|
size="small"
|
|
@click="handleDelete(scope.$index, scope.row)"
|
|
>删除</el-button
|
|
>
|
|
</template></el-table-column
|
|
>
|
|
<el-table-column label="详细">
|
|
<template slot-scope="scope">
|
|
<el-button
|
|
type="text"
|
|
size="small"
|
|
@click="chakan(scope.$index, scope.row)"
|
|
>查看</el-button
|
|
>
|
|
</template></el-table-column
|
|
>
|
|
</el-table>
|
|
</el-dialog>
|
|
|
|
<el-dialog title="新增参数" :visible.sync="flag" width="30%">
|
|
<el-col :span="12">
|
|
<el-form
|
|
:model="ruleForm"
|
|
:rules="rules"
|
|
ref="ruleForm"
|
|
label-width="150px"
|
|
class="demo-ruleForm"
|
|
:label-position="labelPosition"
|
|
>
|
|
<el-form-item label="所属网关:" prop="sswg">
|
|
<el-select v-model="ruleForm.sswg">
|
|
<el-option label="lan-box1" value="lan-box1"></el-option>
|
|
<el-option label="lan-box2" value="lan-box2"></el-option>
|
|
<el-option label="wlan-box1" value="wlan-box1"></el-option>
|
|
<el-option label="wlan-box2" value="wlan-box2"></el-option>
|
|
<!-- <el-option
|
|
label="lan- server port"
|
|
value="lan- server port"
|
|
></el-option>
|
|
<el-option
|
|
label="wlan- server port"
|
|
value="wlan- server port"
|
|
></el-option> -->
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="参数名称:" prop="csname">
|
|
<el-select v-model="ruleForm.csname">
|
|
<el-option label="产量" value="产量"></el-option>
|
|
<el-option label="主轴转速" value="主轴转速"></el-option>
|
|
<el-option label="急停状态" value="急停状态"></el-option>
|
|
<el-option label="切削速度" value="切削速度"></el-option>
|
|
<!-- <el-option label="负载电流" value="负载电流"></el-option>
|
|
<el-option label="额定电流" value="额定电流"></el-option> -->
|
|
</el-select>
|
|
</el-form-item>
|
|
|
|
<el-form-item label="设定值:" prop="sdz">
|
|
<el-input v-model="ruleForm.sdz"> </el-input>
|
|
</el-form-item>
|
|
</el-form>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form
|
|
:model="ruleForm"
|
|
:rules="rules"
|
|
ref="ruleForm"
|
|
label-width="150px"
|
|
class="demo-ruleForm"
|
|
:label-position="labelPosition"
|
|
>
|
|
<el-form-item label="参数key:" prop="cskey">
|
|
<el-select v-model="ruleForm.cskey">
|
|
<el-option
|
|
label="MachinePamHID910"
|
|
value="MachinePamHID910"
|
|
></el-option>
|
|
<el-option
|
|
label="MachinePamHID917"
|
|
value="MachinePamHID917"
|
|
></el-option>
|
|
<el-option
|
|
label="MachinePamHID909"
|
|
value="MachinePamHID909"
|
|
></el-option>
|
|
<el-option
|
|
label="MachinePamHID928"
|
|
value="MachinePamHID928"
|
|
></el-option>
|
|
<!-- <el-option
|
|
label="MachinePamHID923"
|
|
value="MachinePamHID923"
|
|
></el-option>
|
|
<el-option
|
|
label="MachinePamHID924"
|
|
value="MachinePamHID924"
|
|
></el-option> -->
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="小数位数:" prop="xsws">
|
|
<el-input v-model="ruleForm.xsws"> </el-input>
|
|
</el-form-item>
|
|
<el-form-item label="偏差值:" prop="pcz">
|
|
<el-input v-model="ruleForm.pcz"> </el-input>
|
|
</el-form-item>
|
|
</el-form>
|
|
</el-col>
|
|
<span slot="footer" class="dialog-footer">
|
|
<el-button type="primary" @click="saveinfo">保存</el-button>
|
|
<el-button @click="flag = false">取 消</el-button>
|
|
</span>
|
|
</el-dialog>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import { GetUserAnswer, SaveUserAnswer } from "@/api/user";
|
|
export default {
|
|
data() {
|
|
return {
|
|
dialogVisible: true,
|
|
labelPosition: "left",
|
|
flag: false,
|
|
user_id: "",
|
|
xqFlag: false,
|
|
rowDate: {},
|
|
wgid: "",
|
|
multipleSelection: [],
|
|
tableData: [
|
|
// {
|
|
// wgsn: "",
|
|
// wgbh: "",
|
|
// wgmc: "",
|
|
// cskey: "",
|
|
// csmc: "",
|
|
// xsws: "",
|
|
// sdz: "",
|
|
// pcz: "",
|
|
// whr: "",
|
|
// whsj: "",
|
|
// },
|
|
],
|
|
ruleForm: {
|
|
sswg: "",
|
|
csname: "",
|
|
// sfyxbz: "",
|
|
sdz: "",
|
|
cskey: "",
|
|
xsws: "",
|
|
pcz: "",
|
|
},
|
|
FormData: [],
|
|
rules: {
|
|
sswg: [
|
|
{ required: true, trigger: "change", message: "请选择一个选项" },
|
|
],
|
|
csname: [
|
|
{ required: true, trigger: "change", message: "请选择一个选项" },
|
|
],
|
|
// sfyxbz: [
|
|
// { required: true, trigger: "change", message: "请选择一个选项" },
|
|
// ],
|
|
sdz: [{ required: true, trigger: "blur", message: "设定值是必填参数" }],
|
|
cskey: [
|
|
{ required: true, trigger: "change", message: "请选择一个选项" },
|
|
],
|
|
xsws: [
|
|
{ required: true, trigger: "blur", message: "小数位数是必填参数" },
|
|
],
|
|
|
|
pcz: [{ required: true, trigger: "blur", message: "偏差值是必填参数" }],
|
|
},
|
|
};
|
|
},
|
|
created() {
|
|
this.user_id = window.location.href.split("?")[1];
|
|
this.GetUserAnswer();
|
|
},
|
|
methods: {
|
|
//读缓存
|
|
async GetUserAnswer() {
|
|
let { data } = await GetUserAnswer({
|
|
mark: "YDPZYM_wgwh",
|
|
user_id: `${this.user_id}`,
|
|
});
|
|
console.log(data);
|
|
if (data.data && data.state) {
|
|
this.tableData = JSON.parse(data.data.mark_value);
|
|
}
|
|
},
|
|
saveinfo() {
|
|
this.$refs["ruleForm"].validate((valid) => {
|
|
if (valid) {
|
|
if (this.tableData.length < 4) {
|
|
this.SaveUserAnswer();
|
|
localStorage.setItem("wgwh", JSON.stringify(this.tableData));
|
|
this.flag = false;
|
|
} else {
|
|
this.$message({
|
|
message: "抱歉，只能添加四条数据",
|
|
type: "error",
|
|
});
|
|
return false;
|
|
}
|
|
} else {
|
|
console.log("error submit!!");
|
|
return false;
|
|
}
|
|
});
|
|
},
|
|
//删除
|
|
handleDelete(a, b) {
|
|
this.tableData.splice(a, 1);
|
|
localStorage.setItem("wgwh", JSON.stringify(this.tableData));
|
|
this.SaveUserAnswer();
|
|
},
|
|
//多选
|
|
handleSelectionChange(val) {
|
|
this.multipleSelection = val;
|
|
},
|
|
//多选删除
|
|
deleteSelectedRows() {
|
|
if (this.multipleSelection.length == 0) {
|
|
this.$message({
|
|
message: "请先选择要删除的数据",
|
|
type: "warning",
|
|
});
|
|
return;
|
|
}
|
|
this.tableData = this.tableData.filter(
|
|
(row) => !this.multipleSelection.includes(row)
|
|
);
|
|
this.multipleSelection = [];
|
|
localStorage.setItem("wgwh", JSON.stringify(this.tableData));
|
|
this.SaveUserAnswer();
|
|
},
|
|
chakan(a, b) {
|
|
console.log(b);
|
|
this.rowDate = b;
|
|
this.xqFlag = true;
|
|
},
|
|
//保存数据
|
|
async SaveUserAnswer() {
|
|
if (!this.user_id) {
|
|
this.$message.error("操作失败");
|
|
return;
|
|
}
|
|
let { data } = await SaveUserAnswer({
|
|
mark: "YDPZYM_wgwh",
|
|
user_id: `${this.user_id}`,
|
|
mark_value: JSON.stringify(this.tableData),
|
|
});
|
|
if (data.state) {
|
|
this.tableData.push(this.ruleForm);
|
|
this.$message({
|
|
message: "操作成功",
|
|
type: "success",
|
|
});
|
|
} else {
|
|
this.$message.error(data.message);
|
|
}
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
<style scoped lang="less">
|
|
.title {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
|
|
div {
|
|
display: flex;
|
|
}
|
|
}
|
|
|
|
.el-table {
|
|
margin-top: 10px;
|
|
}
|
|
|
|
/deep/.red .el-form-item__label {
|
|
color: red;
|
|
}
|
|
|
|
.xqbox {
|
|
p {
|
|
margin: 5px;
|
|
display: flex;
|
|
|
|
.s1 {
|
|
width: 70px;
|
|
color: #0275ff;
|
|
}
|
|
}
|
|
}
|
|
.el-table {
|
|
height: 400px;
|
|
}
|
|
</style>
|