|
|
@@ -1,59 +1,30 @@
|
|
|
<template>
|
|
|
<div>
|
|
|
- <el-dialog
|
|
|
- :title="dataItemDialogTitle"
|
|
|
- width="80%"
|
|
|
- top="10vh"
|
|
|
- class="cy-custom-dialog"
|
|
|
- center
|
|
|
- v-dialog-drag-and-zoom
|
|
|
- v-if="dataItemDialogVisible"
|
|
|
- :before-close="itemDialogClose"
|
|
|
- :visible.sync="dataItemDialogVisible"
|
|
|
- :close-on-click-modal="false"
|
|
|
- :append-to-body="true">
|
|
|
+ <el-dialog :title="dataItemDialogTitle" width="80%" top="10vh" class="cy-custom-dialog" center v-dialog-drag-and-zoom
|
|
|
+ v-if="dataItemDialogVisible" :before-close="itemDialogClose" :visible.sync="dataItemDialogVisible"
|
|
|
+ :close-on-click-modal="false" :append-to-body="true">
|
|
|
<el-form label-width='100px' style="display: flex;">
|
|
|
- <el-row style="width: 650px;">
|
|
|
- <el-col :span="12">
|
|
|
- <el-form-item label='数据源：' style="margin-bottom: 0px; width: 300px;">
|
|
|
- <el-select v-model="groupBasicForm.dataSourceId" disabled>
|
|
|
- <el-option
|
|
|
- v-for="dict in dataSourceList"
|
|
|
- :key="dict.id"
|
|
|
- :label="dict.dataSourceName"
|
|
|
- :value="dict.id"
|
|
|
- ></el-option>
|
|
|
+ <el-row style="width: 650px;">
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label='数据源：' style="margin-bottom: 0px; width: 300px;">
|
|
|
+ <el-select v-model="groupBasicForm.dataSourceId" disabled>
|
|
|
+ <el-option v-for="dict in dataSourceList" :key="dict.id" :label="dict.dataSourceName"
|
|
|
+ :value="dict.id"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-select v-model="queryParams.needItemStr" multiple collapse-tags placeholder="请选择">
|
|
|
+ <el-option v-for="item in DriverItemData" :key="item.id" :label="item.itemName" :value="item.itemName">
|
|
|
+ </el-option>
|
|
|
</el-select>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-select
|
|
|
- v-model="queryParams.needItemStr"
|
|
|
- multiple
|
|
|
- collapse-tags
|
|
|
- placeholder="请选择"
|
|
|
- >
|
|
|
- <el-option
|
|
|
- v-for="item in DriverItemData"
|
|
|
- :key="item.id"
|
|
|
- :label="item.itemName"
|
|
|
- :value="item.itemName"
|
|
|
- >
|
|
|
- </el-option>
|
|
|
- </el-select>
|
|
|
- <el-button
|
|
|
- type="primary"
|
|
|
- size="mini"
|
|
|
- style="margin-left: 15px;"
|
|
|
+ <el-button type="primary" size="mini" style="margin-left: 15px;" @click="getCompositeScreen">复合筛选</el-button>
|
|
|
|
|
|
- @click="query"
|
|
|
- >复合筛选</el-button>
|
|
|
+ <el-form-item v-if="itemDataStep == 2" label='数据项：' style="margin-bottom: 0px; width: 300px;">
|
|
|
+ <el-input placeholder="请输入数据项名称进行过滤" style="" @input="chooseItemChangeEvent"
|
|
|
+ v-model="filterChooseItemText"></el-input>
|
|
|
+ </el-form-item>
|
|
|
|
|
|
- <el-form-item v-if="itemDataStep == 2" label='数据项：' style="margin-bottom: 0px; width: 300px;">
|
|
|
- <el-input placeholder="请输入数据项名称进行过滤" style=""
|
|
|
- @input="chooseItemChangeEvent" v-model="filterChooseItemText"></el-input>
|
|
|
- </el-form-item>
|
|
|
-
|
|
|
- </el-row>
|
|
|
+ </el-row>
|
|
|
</el-form>
|
|
|
<div v-if="itemDataStep == 1" style="display: flex; height: calc(100% - 36px); overflow: auto;">
|
|
|
<!-- 数据项 -->
|
|
|
@@ -62,51 +33,33 @@
|
|
|
<div class="cy-line" style="padding-bottom: 10px;">
|
|
|
<div style="height: 35px;">
|
|
|
<el-input placeholder="输入关键字进行过滤" v-model="filterItemData" size="mini"
|
|
|
- prefix-icon="el-icon-search"></el-input>
|
|
|
+ prefix-icon="el-icon-search"></el-input>
|
|
|
</div>
|
|
|
<div style="height: calc(100% - 35px); overflow: auto;">
|
|
|
- <div :style="hasLeavesFlag == 1 ? 'height: 40%; overflow: auto;' : 'height: 100%; overflow: auto;'">
|
|
|
- <!-- :show-checkbox="hasLeavesFlag == 1 ? false : true"-->
|
|
|
- <el-tree class="cy-item-tree"
|
|
|
- ref="itemTree"
|
|
|
- :indent="10"
|
|
|
- :load="loadGroupDataItemNode"
|
|
|
- :props="groupProps"
|
|
|
- lazy
|
|
|
- node-key="id"
|
|
|
- :show-checkbox="true"
|
|
|
- :filter-node-method="filterItemEvent"
|
|
|
- @node-click="handleItemNodeClick"
|
|
|
- :check-on-click-node="true"
|
|
|
- :highlight-current="true"
|
|
|
- :default-expand-all="itemDataExpandAll">
|
|
|
+ <div :style="'height: 40%; overflow: auto;'">
|
|
|
+ <virtual-tree class="cy-item-tree" ref="itemTree" :data="treeData" :indent="10" node-key="id"
|
|
|
+ :filter-node-method="filterItemEvent" @node-click="handleItemNodeClick" :check-on-click-node="false"
|
|
|
+ :show-checkbox="true" :highlight-current="true" :default-expand-all="true">
|
|
|
<span class="custom-tree-node" slot-scope="{ node, data }">
|
|
|
- <svg-icon v-if="data.isLeaf" icon-class="file-bg"/>
|
|
|
- <svg-icon v-else-if="node.expanded" icon-class="folder-open" style="width: 1.2em;"/>
|
|
|
- <svg-icon v-else icon-class="folder"/>
|
|
|
+ <svg-icon v-if="data.isLeaf" icon-class="file-bg" />
|
|
|
+ <svg-icon v-else-if="node.expanded" icon-class="folder-open" style="width: 1.2em;" />
|
|
|
+ <svg-icon v-else icon-class="folder" />
|
|
|
<span :title='node.label || "-"' style="margin-left: 2px;">{{ node.label }}</span>
|
|
|
</span>
|
|
|
- </el-tree>
|
|
|
+ </virtual-tree>
|
|
|
</div>
|
|
|
- <div v-if="hasLeavesFlag == 1" style="height: 60%; overflow: auto;">
|
|
|
+ <div style="height: 60%; overflow: auto;">
|
|
|
<el-divider content-position="left" style="margin-bottom: 15px!important;">
|
|
|
<i class="el-icon-collection-tag"></i>
|
|
|
<span>（共{{ leavesList.length }}项）</span>
|
|
|
</el-divider>
|
|
|
- <el-input placeholder="输入关键字进行过滤"
|
|
|
- style="margin-top: -10px;width: calc(100% - 60px);" size="mini"
|
|
|
- @input="itemChangeEvent" v-model="filterItemText"></el-input>
|
|
|
- <el-checkbox v-model="isSelectAllItemData" @change="handleCheckAllChange"
|
|
|
- style="margin-left: 5px;">全选
|
|
|
+ <el-input placeholder="输入关键字进行过滤" style="margin-top: -10px;width: calc(100% - 60px);" size="mini"
|
|
|
+ @input="itemChangeEvent" v-model="filterItemText"></el-input>
|
|
|
+ <el-checkbox v-model="isSelectAllItemData" @change="handleCheckAllChange" style="margin-left: 5px;">全选
|
|
|
</el-checkbox>
|
|
|
<div class="cy-leaves-div">
|
|
|
- <!-- <el-checkbox-group v-model="leavesChooseList" @change="handleCheckedCitiesChange">-->
|
|
|
- <!-- <el-checkbox v-for="leaves in leavesList" :label="leaves">{{ leaves.itemName }}</el-checkbox>-->
|
|
|
- <!-- </el-checkbox-group>-->
|
|
|
- <p-virtual-check ref="pvc"
|
|
|
- :data-sources="leavesList"
|
|
|
- @check-change-all="checkChangeAll"
|
|
|
- @check-change="checkChange"></p-virtual-check>
|
|
|
+ <p-virtual-check ref="pvc" :data-sources="leavesList" @check-change-all="checkChangeAll"
|
|
|
+ @check-change="checkChange"></p-virtual-check>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -146,39 +99,25 @@
|
|
|
<!-- <span :title='node.label || data.itemName' style="margin-left: 2px;">{{ node.label || data.itemName }}</span>-->
|
|
|
<!-- </span>-->
|
|
|
<!-- </el-tree>-->
|
|
|
- <p-virtual-check ref="pvcChoose"
|
|
|
- :data-sources="chooseItemDataListByTree"
|
|
|
- @check-change-all="checkChangeAllChoose"
|
|
|
- @check-change="checkChangeChoose"></p-virtual-check>
|
|
|
+ <p-virtual-check ref="pvcChoose" :data-sources="chooseItemDataListByTree"
|
|
|
+ @check-change-all="checkChangeAllChoose" @check-change="checkChangeChoose"></p-virtual-check>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div v-if="itemDataStep == 2" style="overflow: auto; height: calc(100% - 40px);">
|
|
|
- <el-button size="mini"
|
|
|
- @click="multipleSetting"
|
|
|
- style="position: absolute; right: 30px; top: 80px;">批量设置表达式
|
|
|
+ <el-button size="mini" @click="multipleSetting" style="position: absolute; right: 30px; top: 80px;">批量设置表达式
|
|
|
</el-button>
|
|
|
- <el-button size="mini"
|
|
|
- @click="multipleSettingEventReport"
|
|
|
- style="position: absolute; right: 160px; top: 80px; display: none;">批量配置事件驱动
|
|
|
+ <el-button size="mini" @click="multipleSettingEventReport"
|
|
|
+ style="position: absolute; right: 160px; top: 80px; display: none;">批量配置事件驱动
|
|
|
</el-button>
|
|
|
- <u-table ref="multipleTable"
|
|
|
- row-key="label"
|
|
|
- use-virtual
|
|
|
- :height="430"
|
|
|
- :data="chooseItemDataList"
|
|
|
- @selection-change="selectionLineChangeHandle"
|
|
|
- @sort-change="sortChange"
|
|
|
- :big-data-checkbox="true"
|
|
|
- showBodyOverflow="title"
|
|
|
- showHeaderOverflow="title"
|
|
|
- style="margin-top: 10px;"
|
|
|
- border>
|
|
|
- <u-table-column type="selection" width="55" align="center"/>
|
|
|
- <u-table-column type="index" label="序号" width="60" fixed align="center"/>
|
|
|
- <u-table-column label="数据项名称" prop="itemName" sortable="custom" align="center"/>
|
|
|
- <u-table-column label="四则运算表达式" prop="rule.operationRule" sortable="custom" width="200" align="center"/>
|
|
|
+ <u-table ref="multipleTable" row-key="label" use-virtual :height="430" :data="chooseItemDataList"
|
|
|
+ @selection-change="selectionLineChangeHandle" @sort-change="sortChange" :big-data-checkbox="true"
|
|
|
+ showBodyOverflow="title" showHeaderOverflow="title" style="margin-top: 10px;" border>
|
|
|
+ <u-table-column type="selection" width="55" align="center" />
|
|
|
+ <u-table-column type="index" label="序号" width="60" fixed align="center" />
|
|
|
+ <u-table-column label="数据项名称" prop="itemName" sortable="custom" align="center" />
|
|
|
+ <u-table-column label="四则运算表达式" prop="rule.operationRule" sortable="custom" width="200" align="center" />
|
|
|
<u-table-column label="操作" width="150" align="center">
|
|
|
<template slot-scope="scope">
|
|
|
<el-button size="mini" @click="handleChoose(scope.rowIndex, scope.row)">选择表达式</el-button>
|
|
|
@@ -187,29 +126,17 @@
|
|
|
</u-table>
|
|
|
</div>
|
|
|
<span slot='footer'>
|
|
|
- <el-button type="primary" v-if="itemDataStep == 1" @click="itemDialogSave1">下一步</el-button>
|
|
|
- <el-button type="primary" v-if="itemDataStep == 2" @click="itemDialogSave2">确定</el-button>
|
|
|
- <el-button @click="itemDialogClose">取消</el-button>
|
|
|
+ <el-button type="primary" v-if="itemDataStep == 1" @click="itemDialogSave1">下一步</el-button>
|
|
|
+ <el-button type="primary" v-if="itemDataStep == 2" @click="itemDialogSave2">确定</el-button>
|
|
|
+ <el-button @click="itemDialogClose">取消</el-button>
|
|
|
</span>
|
|
|
</el-dialog>
|
|
|
|
|
|
- <el-dialog
|
|
|
- title="选择表达式"
|
|
|
- width="500px"
|
|
|
- top="10vh"
|
|
|
- center
|
|
|
- v-dialog-drag
|
|
|
- v-if="dialogDataModelVisible"
|
|
|
- :before-close="dialogDataModelClose"
|
|
|
- :visible.sync="dialogDataModelVisible"
|
|
|
- :close-on-click-modal="false"
|
|
|
- :append-to-body="true">
|
|
|
+ <el-dialog title="选择表达式" width="500px" top="10vh" center v-dialog-drag v-if="dialogDataModelVisible"
|
|
|
+ :before-close="dialogDataModelClose" :visible.sync="dialogDataModelVisible" :close-on-click-modal="false"
|
|
|
+ :append-to-body="true">
|
|
|
<el-select v-model="chooseDataModel" filterable clearable placeholder="请选择表达式" style="width: 100%;">
|
|
|
- <el-option
|
|
|
- v-for="(item, index) in this.dataModelList"
|
|
|
- :key="index"
|
|
|
- :label="item.title"
|
|
|
- :value="item.id">
|
|
|
+ <el-option v-for="(item, index) in this.dataModelList" :key="index" :label="item.title" :value="item.id">
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
<div style="width: 100%; text-align: center; margin-top: 20px;">
|
|
|
@@ -231,11 +158,11 @@ import {
|
|
|
traverseVisible
|
|
|
} from "@/utils/cqcy";
|
|
|
import {
|
|
|
- getAllDataModel,
|
|
|
- getAllDataSource, getCompositeScreen, getDriverItemBySouceId,
|
|
|
- getNextAllItem
|
|
|
+ getAllDataModel, getItemGroupById,
|
|
|
+ getAllDataSource, getCompositeScreen, getDriverItemBySouceId,
|
|
|
+ getNextAllItem
|
|
|
} from "@/api/datasource";
|
|
|
-import {v4 as uuidv4} from "uuid";
|
|
|
+import { v4 as uuidv4 } from "uuid";
|
|
|
import PVirtualCheck from "@/components/PVirtualCheck"
|
|
|
|
|
|
export default {
|
|
|
@@ -258,6 +185,8 @@ export default {
|
|
|
isSelectAllItem: false,
|
|
|
chooseDataModel: null,
|
|
|
dataModelList: [],
|
|
|
+ // 树数据
|
|
|
+ treeData: [],
|
|
|
leavesList: [],
|
|
|
leavesListF: [],
|
|
|
leavesChooseList: [],
|
|
|
@@ -276,15 +205,13 @@ export default {
|
|
|
dataSourceId: null,
|
|
|
itemList: []
|
|
|
},
|
|
|
- // 驱动数据返回类型：0 通用 1 WINCC
|
|
|
- hasLeavesFlag: 0,
|
|
|
- DriverItemData: [],
|
|
|
- queryParams: {
|
|
|
- id: null,
|
|
|
- chooseItemStr: "",
|
|
|
- nextItemStr: "",
|
|
|
- needItemStr: [],
|
|
|
- },
|
|
|
+ DriverItemData: [],
|
|
|
+ queryParams: {
|
|
|
+ id: null,
|
|
|
+ chooseItemStr: "",
|
|
|
+ nextItemStr: "",
|
|
|
+ needItemStr: [],
|
|
|
+ },
|
|
|
}
|
|
|
},
|
|
|
props: ['chooseGroup'],
|
|
|
@@ -294,104 +221,153 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
- getDriverItemBySouceId(id) {
|
|
|
- this.queryParams.id = id;
|
|
|
- getDriverItemBySouceId(id).then((res) => {
|
|
|
- console.log(res);
|
|
|
- if (res.code === 200) {
|
|
|
- this.DriverItemData = res.data;
|
|
|
+ getDriverItemBySouceId(id) {
|
|
|
+ this.queryParams.id = id;
|
|
|
+ getDriverItemBySouceId(id).then((res) => {
|
|
|
+ if (res.code === 200) {
|
|
|
+ this.DriverItemData = res.data;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getCompositeScreen() {
|
|
|
+ let params = {};
|
|
|
+ params.id = this.queryParams.id
|
|
|
+ params.chooseItemStr = this.queryParams.chooseItemStr
|
|
|
+ params.needItemStr = JSON.stringify(this.queryParams.needItemStr)
|
|
|
+ const treeArr = this.$refs.itemTree.getCheckedNodes();
|
|
|
+ const treeQ = document.getElementsByClassName('el-tree cy-item-tree el-tree--highlight-current')[0]
|
|
|
+ .getElementsByClassName('el-tree-node__content');
|
|
|
+ let seTreeArr = []
|
|
|
+ if (treeArr.length > 0) {
|
|
|
+ for (let i = 0; i < treeQ.length; i++) {
|
|
|
+ const parentClass = treeQ[i].parentElement.classList;
|
|
|
+ if (parentClass.contains('is-current') && !parentClass.contains('is-hidden')) {
|
|
|
+ // 选择的层级
|
|
|
+ let treechild = treeQ[i].nextElementSibling.getElementsByClassName('el-tree-node__content');
|
|
|
+ for (let j = 0; j < treechild.length; j++) {
|
|
|
+ const clz = treechild[j].parentElement.classList;
|
|
|
+ if (clz.contains('is-checked') && !clz.contains('is-hidden')) {
|
|
|
+ seTreeArr.push(treechild[j].textContent)
|
|
|
}
|
|
|
- });
|
|
|
- },
|
|
|
- query() {
|
|
|
- this.queryParams.nextItemStr = this.filterItemData;
|
|
|
-
|
|
|
- let params = this.queryParams;
|
|
|
- params.needItemStr = JSON.stringify(this.queryParams.needItemStr.length > 0 ? this.queryParams.needItemStr : [])
|
|
|
- const treeArr = this.$refs.itemTree.getCheckedNodes();
|
|
|
- const treeQ = document.getElementsByClassName('el-tree cy-item-tree el-tree--highlight-current')[0]
|
|
|
- .getElementsByClassName('el-tree-node__content');
|
|
|
- let seTreeArr = []
|
|
|
- if (treeArr.length > 0) {
|
|
|
- for (let i = 0; i < treeQ.length; i++) {
|
|
|
- const parentClass = treeQ[i].parentElement.classList;
|
|
|
- if (parentClass.contains('is-current') && !parentClass.contains('is-hidden')) {
|
|
|
- // 选择的层级
|
|
|
- let treechild = treeQ[i].nextElementSibling.getElementsByClassName('el-tree-node__content');
|
|
|
- for (let j = 0; j < treechild.length; j++) {
|
|
|
- const clz = treechild[j].parentElement.classList;
|
|
|
- if (clz.contains('is-checked') && !clz.contains('is-hidden')) {
|
|
|
- seTreeArr.push(treechild[j].textContent)
|
|
|
- }
|
|
|
- }
|
|
|
- break;
|
|
|
- }
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ params.nextItemStr = JSON.stringify(seTreeArr)
|
|
|
+ if (!seTreeArr || seTreeArr.length == 0) {
|
|
|
+ this.$message({
|
|
|
+ message: '节点选择为空',
|
|
|
+ type: 'warning'
|
|
|
+ });
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (!this.queryParams.needItemStr || this.queryParams.needItemStr.length == 0) {
|
|
|
+ this.$message({
|
|
|
+ message: '复合筛选属性不能为空',
|
|
|
+ type: 'warning'
|
|
|
+ });
|
|
|
+ return
|
|
|
+ }
|
|
|
+ const loading = showLoadingTime(this, "筛选中，请稍候···", 60000);
|
|
|
+ getCompositeScreen(params).then((res) => {
|
|
|
+ if (res.code === 200) {
|
|
|
+ let treeData = this.chooseItemDataListByTree ? this.chooseItemDataListByTree : [];
|
|
|
+ if (res.data && res.data.length > 0) {
|
|
|
+ let lodArr = [];
|
|
|
+ for (let j = 0; j < res.data.length; j++) {
|
|
|
+ lodArr.push(res.data[j].label ? res.data[j].label : res.data[j].itemName);
|
|
|
+ }
|
|
|
+ let status = false;
|
|
|
+ let idArr = {}
|
|
|
+ for (let i = 0; i < treeData.length; i++) {
|
|
|
+ if (lodArr.indexOf(treeData[i].label) !== -1) {
|
|
|
+ idArr[lodArr.indexOf(treeData[i].label)] = '1'
|
|
|
+ }
|
|
|
+ }
|
|
|
+ for (let j = 0; j < res.data.length; j++) {
|
|
|
+ if (!idArr[j]) {
|
|
|
+ treeData.push(res.data[j])
|
|
|
+ } else {
|
|
|
+ status = true;
|
|
|
}
|
|
|
+ }
|
|
|
+ if (status) {
|
|
|
+ this.$message({
|
|
|
+ message: '请注意，选择的数据项中含有重复的项',
|
|
|
+ type: 'warning'
|
|
|
+ });
|
|
|
+ }
|
|
|
}
|
|
|
- params.nextItemStr = JSON.stringify(seTreeArr)
|
|
|
- getCompositeScreen(params).then((res) => {
|
|
|
- console.log(this.chooseItemDataListByTree);
|
|
|
- if (res.code === 200) {
|
|
|
- let treeData = this.chooseItemDataListByTree ? this.chooseItemDataListByTree : [];
|
|
|
- if (res.data && res.data.length > 0) {
|
|
|
- let lodArr = [];
|
|
|
- for (let j = 0; j < res.data.length; j++) {
|
|
|
- lodArr.push(res.data[j].label ? res.data[j].label : res.data[j].itemName);
|
|
|
- }
|
|
|
- console.log(lodArr)
|
|
|
- let status = false;
|
|
|
- let idArr = {}
|
|
|
- for (let i = 0; i < treeData.length; i++) {
|
|
|
- if (lodArr.indexOf(treeData[i].label) !== -1) {
|
|
|
- idArr[lodArr.indexOf(treeData[i].label)] = '1'
|
|
|
- }
|
|
|
- }
|
|
|
- console.log(idArr)
|
|
|
- for (let j = 0; j < res.data.length; j++) {
|
|
|
- if (!idArr[j]) {
|
|
|
- treeData.push(res.data[j])
|
|
|
- } else {
|
|
|
- status = true;
|
|
|
- }
|
|
|
- }
|
|
|
- console.log(treeData)
|
|
|
- if (status) {
|
|
|
- this.$message({
|
|
|
- message: '请注意，选择的数据项中含有重复的项',
|
|
|
- type: 'warning'
|
|
|
- });
|
|
|
- }
|
|
|
- }
|
|
|
|
|
|
-
|
|
|
- this.handleCheckAllChange(false);
|
|
|
- this.$nextTick(() => {
|
|
|
- this.chooseItemDataListByTree = treeData;
|
|
|
- this.isSelectAllItem = false;
|
|
|
- this.isSelectAllItemData = false;
|
|
|
- this.leavesChooseList = [];
|
|
|
- this.queryParams.needItemStr = [];
|
|
|
- this.$refs.itemTree.setCheckedKeys([]);
|
|
|
- this.$refs.itemTree.setCheckedNodes([]);
|
|
|
- // this.$refs.chooseItemTree.setCheckedNodes([])
|
|
|
- console.log(this.chooseItemDataListByTree);
|
|
|
- });
|
|
|
- if (!res.data || res.data.length === 0) {
|
|
|
- this.$message({
|
|
|
- message: '没有筛选出符合条件的数据项，请重新筛选',
|
|
|
- type: 'warning'
|
|
|
- });
|
|
|
- }
|
|
|
- }
|
|
|
+ this.handleCheckAllChange(false);
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.chooseItemDataListByTree = treeData;
|
|
|
+ this.isSelectAllItem = false;
|
|
|
+ this.isSelectAllItemData = false;
|
|
|
+ this.leavesChooseList = [];
|
|
|
+ this.$refs.itemTree.setCheckedKeys([]);
|
|
|
+ this.$refs.itemTree.setCheckedNodes([]);
|
|
|
+ // this.$refs.chooseItemTree.setCheckedNodes([])
|
|
|
});
|
|
|
- },
|
|
|
+ if (!res.data || res.data.length === 0) {
|
|
|
+ this.$message({
|
|
|
+ message: '没有筛选出符合条件的数据项，请重新筛选',
|
|
|
+ type: 'warning'
|
|
|
+ });
|
|
|
+ }
|
|
|
+ loading.close()
|
|
|
+ }
|
|
|
+ }).catch((e) => {
|
|
|
+ loading.close()
|
|
|
+ showAlertWin(this, null, e);
|
|
|
+ });
|
|
|
+ },
|
|
|
/** 显示弹窗 */
|
|
|
show() {
|
|
|
this.groupBasicForm.dataSourceId = this.chooseGroup.dataSourceId
|
|
|
this.getDataSourceList()
|
|
|
+ const loading = showLoading(this, "加载中，请稍候···");
|
|
|
+ this.isSelectAllItem = false;
|
|
|
+ this.dataLineListSelections = [];
|
|
|
+ this.leavesList = [];
|
|
|
+ this.leavesChooseList = [];
|
|
|
+ this.itemDataStep = 1;
|
|
|
+ this.tempItemList = JSON.parse(JSON.stringify(this.groupBasicForm.itemList))
|
|
|
+ this.getNextAllItem(this.chooseGroup.dataSourceId, null, (data) => {
|
|
|
+ //加载树
|
|
|
+ this.treeData = data.children
|
|
|
+ //加载虚拟列表，叶节点
|
|
|
+ let leaves = data.leaves
|
|
|
+ this.leavesList = leaves
|
|
|
+ this.leavesListF = leaves
|
|
|
+ let arr = [];
|
|
|
+ //将原来的数据项加载到，右侧作为已选择的
|
|
|
+ for (let i = 0; i < this.tempItemList.length; i++) {
|
|
|
+ let temp = {
|
|
|
+ nodeIdentifier: null,
|
|
|
+ dataType: null,
|
|
|
+ label: this.tempItemList[i].itemName,
|
|
|
+ nodeIndex: this.tempItemList[i].nodeIndex,
|
|
|
+ itemName: this.tempItemList[i].itemName,
|
|
|
+ itemReadName: this.tempItemList[i].itemReadName,
|
|
|
+ dataModelId: this.tempItemList[i].dataModelId,
|
|
|
+ value: this.tempItemList[i].itemReadName,
|
|
|
+ checked: false,
|
|
|
+ };
|
|
|
+ arr.push(temp)
|
|
|
+ }
|
|
|
+ this.chooseItemDataListByTree = arr
|
|
|
+ this.dataItemDialogTitle = "选择数据项";
|
|
|
+ this.dataItemDialogVisible = true;
|
|
|
+
|
|
|
+ //获取数据源的驱动数据项信息
|
|
|
+ this.getDriverItemBySouceId(this.chooseGroup.dataSourceId)
|
|
|
+ loading.close();
|
|
|
+ })
|
|
|
},
|
|
|
/** 自定义排序 */
|
|
|
- sortChange({prop, order}) {
|
|
|
+ sortChange({ prop, order }) {
|
|
|
this.chooseItemDataList.sort(customCompare(prop, order))
|
|
|
},
|
|
|
/** 动态搜索事件 */
|
|
|
@@ -511,100 +487,71 @@ export default {
|
|
|
})
|
|
|
this.leavesList = filterList
|
|
|
},
|
|
|
- /** 懒加载数据组数据项查询 */
|
|
|
- loadGroupDataItemNode(node, resolve) {
|
|
|
- if (node.level === 0) {
|
|
|
- // setTimeout(() => {
|
|
|
- this.getDataItemByDataSource()
|
|
|
- // }, 200)
|
|
|
- // console.log(this.itemDataListByTree)
|
|
|
- // return resolve(this.itemDataListByTree)
|
|
|
- }
|
|
|
- let itemNames = []
|
|
|
- extractDataItemValues(node, itemNames)
|
|
|
- let itemName = itemNames.reverse().join('!@')
|
|
|
- let dataSourceId = this.chooseGroup.dataSourceId
|
|
|
- this.queryParams.chooseItemStr = itemName;
|
|
|
- if (node.childNodes && node.childNodes.length > 0) {
|
|
|
- return;
|
|
|
- }
|
|
|
-
|
|
|
- getNextAllItem(dataSourceId, itemName).then(res => {
|
|
|
- if (!res.data) {
|
|
|
- resolve([])
|
|
|
- return
|
|
|
- }
|
|
|
- let datas = res.data.label
|
|
|
- let leaves = res.data.leaves
|
|
|
- let leaveList = []
|
|
|
- if (leaves && leaves.length > 0) {
|
|
|
- leaves.forEach((t) => {
|
|
|
- t.label = t.itemName
|
|
|
- t.value = t.itemReadName
|
|
|
- t.checked = false
|
|
|
- leaveList.push(t)
|
|
|
- })
|
|
|
- }
|
|
|
- this.filterItemText = ''
|
|
|
- this.leavesList = leaveList
|
|
|
- this.leavesListF = JSON.parse(JSON.stringify(this.leavesList))
|
|
|
- console.log(11, this.leavesList)
|
|
|
- let dataList = []
|
|
|
+ /** 获取树节点的下级信息 */
|
|
|
+ getNextAllItem(dataSourceId, itemName, callback) {
|
|
|
+ getNextAllItem(dataSourceId, itemName).then((res) => {
|
|
|
+ let data = {}
|
|
|
+ this.filterLeavesText = "";
|
|
|
+ let datas = res.data.label;
|
|
|
+ let leaves = res.data.leaves;
|
|
|
+ // 模拟数据
|
|
|
+ let dataList = [];
|
|
|
if (datas && datas.length > 0) {
|
|
|
datas.forEach((t) => {
|
|
|
dataList.push({
|
|
|
- 'dataSourceId': dataSourceId,
|
|
|
- 'label': t.itemName,
|
|
|
- 'leaf': false,
|
|
|
- 'children': []
|
|
|
- })
|
|
|
- })
|
|
|
+ dataSourceId: dataSourceId,
|
|
|
+ label: t.itemName,
|
|
|
+ leaf: false,
|
|
|
+ children: [],
|
|
|
+ });
|
|
|
+ });
|
|
|
}
|
|
|
- this.getDriverItemBySouceId(dataSourceId);
|
|
|
- resolve(dataList)
|
|
|
- }).catch((e) => {
|
|
|
- resolve([])
|
|
|
- showAlertWin(this, null, e)
|
|
|
+ let leavesList = [];
|
|
|
+ if (leaves && leaves.length > 0) {
|
|
|
+ leaves.forEach((t) => {
|
|
|
+ t.label = t.itemName;
|
|
|
+ t.value = t.itemReadName;
|
|
|
+ t.checked = false;
|
|
|
+ leavesList.push(t);
|
|
|
+ });
|
|
|
+ }
|
|
|
+ data.children = dataList
|
|
|
+ data.leaves = leavesList
|
|
|
+ callback(data);
|
|
|
})
|
|
|
},
|
|
|
/** 数据项点击事件 */
|
|
|
- handleItemNodeClick(data, n, target) {
|
|
|
- let node = this.$refs.itemTree.getNode(n)
|
|
|
+ handleItemNodeClick(d, n, t) {
|
|
|
+ let itemNames = [];
|
|
|
+ extractDataItemValues(n, itemNames);
|
|
|
+ let itemName = itemNames.reverse().join("!@");
|
|
|
+ this.queryParams.chooseItemStr = itemName;
|
|
|
+ const loading = showLoading(this, "加载中，请稍候···");
|
|
|
+ if ((!d.children || d.children.length == 0) && (!d.leaves || d.leaves.length == 0)) {
|
|
|
+ this.getNextAllItem(this.groupBasicForm.dataSourceId, itemName, (data) => {
|
|
|
+ //加载树
|
|
|
+ d.children = data.children
|
|
|
+ let leaves = data.leaves
|
|
|
+ d.leaves = leaves
|
|
|
+ //加载虚拟列表，叶节点
|
|
|
+ this.leavesList = leaves
|
|
|
+ this.leavesListF = leaves
|
|
|
+ loading.close();
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ if (d.leaves) {
|
|
|
+ let leaves = d.leaves
|
|
|
+ this.leavesList = leaves
|
|
|
+ this.leavesListF = leaves
|
|
|
+ }
|
|
|
+ loading.close();
|
|
|
+ }
|
|
|
+ let node = this.$refs.itemTree.getNode(n);
|
|
|
if (!node) {
|
|
|
- this.isSelectAllItemData = false
|
|
|
- node.loaded = false
|
|
|
- node.expand()
|
|
|
+ this.isSelectAllItemData = false;
|
|
|
+ node.loaded = false;
|
|
|
+ node.expand();
|
|
|
}
|
|
|
- // if (this.hasLeavesFlag !== 1) return
|
|
|
- // this.isSelectAllItemData = false
|
|
|
- // const loading = showLoading(this, '加载中，请稍候···')
|
|
|
- // let itemNames = []
|
|
|
- // extractDataItemValues(node, itemNames)
|
|
|
- // let itemName = itemNames.reverse().join('!@')
|
|
|
- // let dataSourceId = node.data.dataSourceId
|
|
|
- // getNextAllItem(dataSourceId, itemName).then(res => {
|
|
|
- // loading.close()
|
|
|
- // let data = res.data
|
|
|
- //
|
|
|
- // let leaves = []
|
|
|
- // if (data.leaves && data.leaves.length > 0) {
|
|
|
- // data.leaves.forEach((t) => {
|
|
|
- // t.label = t.itemName
|
|
|
- // t.value = t.itemReadName
|
|
|
- // t.checked = false
|
|
|
- // leaves.push(t)
|
|
|
- // })
|
|
|
- // }
|
|
|
- // this.filterItemText = ''
|
|
|
- // this.leavesList = leaves
|
|
|
- // console.log(22, this.leavesList)
|
|
|
- // this.leavesListF = JSON.parse(JSON.stringify(this.leavesList))
|
|
|
- // }).catch((e) => {
|
|
|
- // loading.close()
|
|
|
- // this.leavesList = []
|
|
|
- // this.leavesListF = JSON.parse(JSON.stringify(this.leavesList))
|
|
|
- // showAlertWin(this, null, e)
|
|
|
- // })
|
|
|
},
|
|
|
/** 根据数据源选择数据项 */
|
|
|
getDataItemByDataSource() {
|
|
|
@@ -623,10 +570,10 @@ export default {
|
|
|
if (this.tempItemList && this.tempItemList.length > 0) {
|
|
|
this.chooseItemDataListByTree = this.tempItemList
|
|
|
}
|
|
|
- this.$nextTick(() => {
|
|
|
- // 区分驱动返回数据类型
|
|
|
- this.hasLeavesFlag = 1
|
|
|
- })
|
|
|
+ this.$nextTick(() => {
|
|
|
+ // 区分驱动返回数据类型
|
|
|
+ this.hasLeavesFlag = 1
|
|
|
+ })
|
|
|
// const loading = showLoading(this, '加载中，请稍候···')
|
|
|
// getNextAllItem(id, null).then(res => {
|
|
|
// loading.close()
|
|
|
@@ -679,87 +626,63 @@ export default {
|
|
|
/** 添加数据项 */
|
|
|
addCheckNodesBtnEvent() {
|
|
|
// 根据当前选择节点拼接为：XXXX.XXXX.XXX
|
|
|
- let chooseChannelNameList = []
|
|
|
- // WinCC数据项处理
|
|
|
- if (this.hasLeavesFlag === 1) {
|
|
|
- if (this.leavesChooseList.length == 0) {
|
|
|
- showAlertMsgWin(this, null, '请选择数据项！')
|
|
|
- return
|
|
|
- }
|
|
|
- for (let i = 0; i < this.leavesChooseList.length; i++) {
|
|
|
- let temp = {
|
|
|
- 'id': uuidv4(),
|
|
|
- 'nodeIdentifier': null,
|
|
|
- 'dataType': null,
|
|
|
- 'label': this.leavesChooseList[i].fullPath,
|
|
|
- 'nodeIndex': this.leavesChooseList[i].nodeIndex,
|
|
|
- 'itemName': this.leavesChooseList[i].itemName,
|
|
|
- 'itemReadName': this.leavesChooseList[i].itemReadName,
|
|
|
- 'value': this.leavesChooseList[i].itemReadName,
|
|
|
- 'checked': false
|
|
|
- }
|
|
|
- chooseChannelNameList.push(temp)
|
|
|
- }
|
|
|
- }
|
|
|
- // 通用数据项处理
|
|
|
- else {
|
|
|
- let checkedNodes = this.$refs.itemTree.getCheckedNodes(false, true)
|
|
|
- if (checkedNodes.length == 0) {
|
|
|
- showAlertMsgWin(this, null, '请选择数据项！')
|
|
|
- return
|
|
|
- }
|
|
|
- for (let i in checkedNodes) {
|
|
|
- let checkedNode = checkedNodes[i]
|
|
|
- if (!checkedNode.isLeaf) {
|
|
|
- continue
|
|
|
- }
|
|
|
- const nodeId = checkedNode.$treeNodeId;
|
|
|
- let channelName = this.treeFindPath(this.itemDataListByTree, data => data.$treeNodeId === nodeId, "label")
|
|
|
- let temp = {
|
|
|
- 'id': uuidv4(),
|
|
|
- 'label': channelName.join('.'),
|
|
|
- 'nodeIdentifier': checkedNode.nodeIdentifier,
|
|
|
- 'nodeIndex': checkedNode.nodeIndex,
|
|
|
- 'dataType': checkedNode.dataType,
|
|
|
- 'itemReadName': checkedNode.itemReadName,
|
|
|
- 'value': checkedNode.itemReadName,
|
|
|
- 'checked': false
|
|
|
- }
|
|
|
- chooseChannelNameList.push(temp)
|
|
|
- }
|
|
|
+ let chooseChannelNameList = [];
|
|
|
+ if (this.leavesChooseList.length == 0) {
|
|
|
+ showAlertMsgWin(this, null, "请选择数据项！");
|
|
|
+ return;
|
|
|
}
|
|
|
- if (chooseChannelNameList.length == 0) {
|
|
|
- showAlertMsgWin(this, null, '请选择子数据项！')
|
|
|
- return
|
|
|
+ for (let i = 0; i < this.leavesChooseList.length; i++) {
|
|
|
+ let temp = {
|
|
|
+ id: uuidv4(),
|
|
|
+ nodeIdentifier: null,
|
|
|
+ dataType: null,
|
|
|
+ label: this.leavesChooseList[i].fullPath,
|
|
|
+ nodeIndex: this.leavesChooseList[i].nodeIndex,
|
|
|
+ itemName: this.leavesChooseList[i].itemName,
|
|
|
+ itemReadName: this.leavesChooseList[i].itemReadName,
|
|
|
+ value: this.leavesChooseList[i].itemReadName,
|
|
|
+ checked: false,
|
|
|
+ };
|
|
|
+ chooseChannelNameList.push(temp);
|
|
|
}
|
|
|
// 去重
|
|
|
- let arr = JSON.parse(JSON.stringify(this.chooseItemDataListByTree))
|
|
|
+ let arr = JSON.parse(JSON.stringify(this.chooseItemDataListByTree));
|
|
|
if (arr.length == 0) {
|
|
|
- arr = chooseChannelNameList
|
|
|
+ arr = chooseChannelNameList;
|
|
|
} else {
|
|
|
+ let status = false;
|
|
|
for (let i in chooseChannelNameList) {
|
|
|
- let flag = false
|
|
|
+ let flag = false;
|
|
|
for (let j in arr) {
|
|
|
- let tName = arr[j].label ? arr[j].label : arr[j].itemName
|
|
|
+ let tName = arr[j].label ? arr[j].label : arr[j].itemName;
|
|
|
if (chooseChannelNameList[i].label == tName) {
|
|
|
- flag = true
|
|
|
- break
|
|
|
+ flag = true;
|
|
|
+ if (!status) {
|
|
|
+ status = true;
|
|
|
+ }
|
|
|
+ break;
|
|
|
}
|
|
|
}
|
|
|
if (!flag) {
|
|
|
- arr.push(chooseChannelNameList[i])
|
|
|
+ arr.push(chooseChannelNameList[i]);
|
|
|
}
|
|
|
}
|
|
|
+ if (status) {
|
|
|
+ this.$message({
|
|
|
+ message: '请注意，选择的数据项中含有重复的项',
|
|
|
+ type: 'warning'
|
|
|
+ });
|
|
|
+ }
|
|
|
}
|
|
|
- this.handleCheckAllChange(false)
|
|
|
+ this.handleCheckAllChange(false);
|
|
|
this.$nextTick(() => {
|
|
|
- this.chooseItemDataListByTree = arr
|
|
|
- this.leavesChooseList = []
|
|
|
- this.isSelectAllItem = false
|
|
|
- this.isSelectAllItemData = false
|
|
|
- this.$refs.itemTree.setCheckedKeys([])
|
|
|
+ this.chooseItemDataListByTree = arr;
|
|
|
+ this.isSelectAllItem = false;
|
|
|
+ this.isSelectAllItemData = false;
|
|
|
+ this.leavesChooseList = [];
|
|
|
+ this.$refs.itemTree.setCheckedKeys([]);
|
|
|
// this.$refs.chooseItemTree.setCheckedNodes([])
|
|
|
- })
|
|
|
+ });
|
|
|
},
|
|
|
/** 移除数据项 */
|
|
|
removeCheckNodesBtnEvent() {
|
|
|
@@ -779,7 +702,7 @@ export default {
|
|
|
if (!_temp || _temp.length == 0) {
|
|
|
return
|
|
|
}
|
|
|
- for (let i = _temp.length - 1; i >= 0; i --) {
|
|
|
+ for (let i = _temp.length - 1; i >= 0; i--) {
|
|
|
if (_temp[i].checked) {
|
|
|
this.chooseItemDataListByTree.splice(i, 1)
|
|
|
}
|
|
|
@@ -830,6 +753,7 @@ export default {
|
|
|
},
|
|
|
/** 选择数据项弹出层保存事件：第二步 */
|
|
|
itemDialogSave2() {
|
|
|
+ this.treeData=[]
|
|
|
this.filterChooseItemText = ''
|
|
|
this.chooseItemChangeEvent()
|
|
|
this.itemDataStep = 1
|
|
|
@@ -867,8 +791,8 @@ export default {
|
|
|
}
|
|
|
for (let i = 0; i < dataModelList.length; i++) {
|
|
|
dataModelList[i].title = dataModelList[i].remark
|
|
|
- ? ('【' + dataModelList[i].remark + '】' + dataModelList[i].operationRule)
|
|
|
- : dataModelList[i].operationRule
|
|
|
+ ? ('【' + dataModelList[i].remark + '】' + dataModelList[i].operationRule)
|
|
|
+ : dataModelList[i].operationRule
|
|
|
this.dataModelList.push(dataModelList[i])
|
|
|
}
|
|
|
this.$nextTick(() => {
|
|
|
@@ -955,6 +879,7 @@ export default {
|
|
|
this.chooseItemDataListByTree = this.tempItemList
|
|
|
this.groupBasicForm.itemList = this.tempItemList
|
|
|
}
|
|
|
+ this.treeData=[]
|
|
|
this.filterChooseItemText = ''
|
|
|
this.filterItemData = ''
|
|
|
this.itemDataListByTree = []
|
|
|
@@ -976,8 +901,8 @@ export default {
|
|
|
</script>
|
|
|
|
|
|
<style scoped>
|
|
|
-.el-tree--highlight-current .el-tree-node.is-current > .el-tree-node__content {
|
|
|
- background-color: #90b9e1;
|
|
|
- color: white;
|
|
|
+.el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content {
|
|
|
+ background-color: #90b9e1;
|
|
|
+ color: white;
|
|
|
}
|
|
|
</style>
|
zhoupeng