|
@@ -1,23 +1,223 @@
|
|
|
<template>
|
|
|
<div>
|
|
|
- <select-one :name="'原始点位描述中识别的设备类型'"></select-one>
|
|
|
- <select-one :name="'已标准化的设备标识'"></select-one>
|
|
|
+ <select-one @check="typeCheck" :renderData="typeArr" infosKey="EquipmentType" name="原始点位描述中的设备类型关键字"></select-one>
|
|
|
+ <select-one @check="paramCheck" :renderData="identifyArr" infosKey="ownMess" name="原始点位描述中设备参数关键字"></select-one>
|
|
|
+ <div class="handson-view saga-border">
|
|
|
+ <div v-if="hotData.length" class="h100">
|
|
|
+ <div class="title-view">
|
|
|
+ <el-input v-model="inputValue" placeholder="批量填充空白的值/单位说明" style="width:200px;"></el-input>
|
|
|
+ <span class="w10"></span>
|
|
|
+ <el-button @click="fullValue">批量填充值/单位说明</el-button>
|
|
|
+ </div>
|
|
|
+ <div class="handson-main">
|
|
|
+ <handsontable-component ref="handsontable"></handsontable-component>
|
|
|
+ </div>
|
|
|
+ <div class="center">
|
|
|
+ <el-button @click="saveData">保存修改</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div v-else class="center">
|
|
|
+ 暂无数据
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
+ import {
|
|
|
+ mapGetters,
|
|
|
+ mapActions
|
|
|
+ } from "vuex";
|
|
|
+ import {
|
|
|
+ queryAllEqTypeList,
|
|
|
+ queryAllEqParamList,
|
|
|
+ queryPoint,
|
|
|
+ updatePoint
|
|
|
+ } from "fetch/point_http"
|
|
|
import selectOne from "components/config_point/select_one"
|
|
|
+ import handsontableComponent from "components/common/handsontable"
|
|
|
export default {
|
|
|
- components:{
|
|
|
- selectOne
|
|
|
+ components: {
|
|
|
+ selectOne,
|
|
|
+ handsontableComponent
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapGetters("project", [
|
|
|
+ "projectId",
|
|
|
+ "datasourceId",
|
|
|
+ "protocolType"
|
|
|
+ ])
|
|
|
},
|
|
|
data() {
|
|
|
- return {}
|
|
|
+ return {
|
|
|
+ typeArr: [],
|
|
|
+ identifyArr: [],
|
|
|
+ EquipmentType: "",
|
|
|
+ EquipmentParameter: "",
|
|
|
+ inputValue: "",
|
|
|
+ header: ['原始点位描述', '值/单位说明', '*识别的设备类型关键字', '*识别的设备参数关键字'],
|
|
|
+ type: [{
|
|
|
+ data: 'RoutingKey',
|
|
|
+ readOnly: true
|
|
|
+ },
|
|
|
+ {
|
|
|
+ data: 'ValueDescription'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ data: 'KeyEquipmentType'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ data: 'KeyEquipmentParameter'
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ hot: "",
|
|
|
+ hotData: []
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.getTypes()
|
|
|
},
|
|
|
- created() {},
|
|
|
mounted() {},
|
|
|
- methods: {}
|
|
|
+ methods: {
|
|
|
+ //保存数据
|
|
|
+ saveData(){
|
|
|
+ let param = this.hot.getSourceData().map(item => {
|
|
|
+ return {
|
|
|
+ ValueDescription: item.ValueDescription || null,
|
|
|
+ KeyEquipmentType: item.KeyEquipmentType || null,
|
|
|
+ KeyEquipmentParameter: item.KeyEquipmentParameter || null,
|
|
|
+ Id: item.Id,
|
|
|
+ DatasourceId: item.DatasourceId
|
|
|
+ }
|
|
|
+ })
|
|
|
+ console.log(param)
|
|
|
+ updatePoint({
|
|
|
+ data: {Content: param},
|
|
|
+ type: this.protocolType
|
|
|
+ },res => {
|
|
|
+ console.log(res)
|
|
|
+ this.typeCheck()
|
|
|
+ })
|
|
|
+ },
|
|
|
+ //填充值被点击
|
|
|
+ fullValue(){
|
|
|
+ if(!this.inputValue){
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ this.hotData.map(item => {
|
|
|
+ //如果没有值
|
|
|
+ if(!item.ValueDescription){
|
|
|
+ item.ValueDescription = this.inputValue
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ //设备类型被点击
|
|
|
+ typeCheck(item) {
|
|
|
+ this.EquipmentType = item.EquipmentType == "空" ? "" : item.EquipmentType
|
|
|
+ this.getParam()
|
|
|
+ },
|
|
|
+ //设备参数被点击
|
|
|
+ paramCheck(item) {
|
|
|
+ console.log(item, "设备参数")
|
|
|
+ this.inputValue = ""
|
|
|
+ if (!!item) {
|
|
|
+ this.EquipmentParameter = (item.EquipmentParameter == "空" || !item.EquipmentParameter) ? null : item.EquipmentParameter
|
|
|
+ this.queryPoint()
|
|
|
+ } else {
|
|
|
+ this.hotData = []
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //获取点位列表
|
|
|
+ queryPoint() {
|
|
|
+ console.log(this.EquipmentType, this.EquipmentParameter, "EquipmentParameter")
|
|
|
+ let param = {
|
|
|
+ data: {
|
|
|
+ Filters: {
|
|
|
+ DataSourceId: this.datasourceId,
|
|
|
+ ProjectId: this.projectId,
|
|
|
+ KeyEquipmentParameter: this.EquipmentParameter,
|
|
|
+ KeyEquipmentType: this.EquipmentType
|
|
|
+ }
|
|
|
+ },
|
|
|
+ type: this.protocolType
|
|
|
+ },
|
|
|
+ width, settings
|
|
|
+ console.log(param.data)
|
|
|
+ queryPoint(param, res => {
|
|
|
+ this.hotData = res.Content
|
|
|
+ console.log(res)
|
|
|
+ if (!!this.hot) {
|
|
|
+ this.hot.destroy()
|
|
|
+ }
|
|
|
+ settings = {
|
|
|
+ data: this.hotData,
|
|
|
+ colHeaders: this.header,
|
|
|
+ columns: this.type,
|
|
|
+ rowHeights: 30,
|
|
|
+ maxRows: res.Content.length
|
|
|
+ }
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.hot = this.$refs.handsontable.init(settings)
|
|
|
+ })
|
|
|
+ console.log(this.hot)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ //获取原始点位描述中设备参数关键字
|
|
|
+ getParam() {
|
|
|
+ queryAllEqParamList({
|
|
|
+ type: this.protocolType,
|
|
|
+ data: {
|
|
|
+ DataSourceId: this.datasourceId,
|
|
|
+ ProjectId: this.projectId,
|
|
|
+ KeyEquipmentType: this.EquipmentType
|
|
|
+ }
|
|
|
+ }, res => {
|
|
|
+ this.identifyArr = res.Content.map(item => {
|
|
|
+ if (!!item.EquipmentParameter) {
|
|
|
+ item.ownMess = item.EquipmentParameter + "(涉及原始点位:" + item.PointCount + ")"
|
|
|
+ } else {
|
|
|
+ item.ownMess = "空" + "(涉及原始点位:" + item.PointCount + ")"
|
|
|
+ }
|
|
|
+ return item
|
|
|
+ })
|
|
|
+ console.log(this.identifyArr, "res")
|
|
|
+ })
|
|
|
+ },
|
|
|
+ //获取原始点位描述中的设备类型关键字
|
|
|
+ getTypes() {
|
|
|
+ queryAllEqTypeList({
|
|
|
+ type: this.protocolType,
|
|
|
+ data: {
|
|
|
+ DataSourceId: this.datasourceId,
|
|
|
+ ProjectId: this.projectId
|
|
|
+ }
|
|
|
+ }, res => {
|
|
|
+ // res.Content.unshift({EquipmentType: "空"})
|
|
|
+ this.typeArr = res.Content
|
|
|
+ console.log(this.typeArr)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ }
|
|
|
}
|
|
|
</script>
|
|
|
<style lang="scss" scoped>
|
|
|
-
|
|
|
+ .handson-view {
|
|
|
+ height: 340px;
|
|
|
+ width: 480px;
|
|
|
+ float: right;
|
|
|
+ overflow-y: auto;
|
|
|
+ }
|
|
|
+ .title-view {
|
|
|
+ height: 50px;
|
|
|
+ line-height: 50px;
|
|
|
+ padding-left: 10px;
|
|
|
+ }
|
|
|
+ .w10 {
|
|
|
+ width: 10px;
|
|
|
+ display: inline-block;
|
|
|
+ }
|
|
|
+ .handson-main {
|
|
|
+ height: calc(100% - 90px);
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
</style>
|