|
@@ -7,115 +7,258 @@
|
|
|
<el-tabs type="border-card" @tab-click="clickTabs" class="tabs-h" tab-position="bottom">
|
|
|
<el-tab-pane>
|
|
|
<span slot="label">
|
|
|
- <i class="el-icon-date"></i> 我的行程
|
|
|
- </span>
|
|
|
- <js-mind-component ref="jsmind1"></js-mind-component>
|
|
|
+ 从物理世界角度检查
|
|
|
+ </span>
|
|
|
+ <js-mind-component ref="jsmind" @openNode="openNode"></js-mind-component>
|
|
|
</el-tab-pane>
|
|
|
- <el-tab-pane class="h100" label="消息中心">
|
|
|
- <js-mind-component ref="jsmind2"></js-mind-component>
|
|
|
+ <el-tab-pane class="h100" label="从原始点位表角度检查">
|
|
|
+ <js-mind-component ref="jsmind1" @openNode="openNode"></js-mind-component>
|
|
|
</el-tab-pane>
|
|
|
</el-tabs>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
+ import {
|
|
|
+ mapGetters,
|
|
|
+ mapActions
|
|
|
+ } from "vuex";
|
|
|
import jsMindComponent from "components/common/jsmind"
|
|
|
+ import {
|
|
|
+ platformSysJsMind,
|
|
|
+ platformEqJsMind,
|
|
|
+ platformIdentJsMind,
|
|
|
+ platformInfoJsMind,
|
|
|
+ platformPointJsMind,
|
|
|
+ pointSytemJsMind,
|
|
|
+ pointPostJsMind,
|
|
|
+ pointInfoJsMind,
|
|
|
+ pointTypeJsMind,
|
|
|
+ } from "fetch/point_http"
|
|
|
export default {
|
|
|
name: "steps4",
|
|
|
data() {
|
|
|
- return {}
|
|
|
+ return {
|
|
|
+ jsMind: "",
|
|
|
+ activeIndex: 0,
|
|
|
+ mindArr: []
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapGetters("project", [
|
|
|
+ "projectId",
|
|
|
+ "datasourceId",
|
|
|
+ "protocolType",
|
|
|
+ "dataName"
|
|
|
+ ])
|
|
|
},
|
|
|
created() {},
|
|
|
- mounted() {},
|
|
|
+ mounted() {
|
|
|
+ this.clickTabs({
|
|
|
+ index: this.activeIndex
|
|
|
+ })
|
|
|
+ },
|
|
|
methods: {
|
|
|
- clickTabs(val) {
|
|
|
- console.log(this.$refs, val)
|
|
|
- var mind = {
|
|
|
- /* 元数据,定义思维导图的名称、作者、版本等信息 */
|
|
|
- meta: {
|
|
|
- name: "jsMind-demo-tree",
|
|
|
- author: "hizzgdev@163.com",
|
|
|
- version: "0.2"
|
|
|
- },
|
|
|
- /* 数据格式声明 */
|
|
|
- format: "node_tree",
|
|
|
- /* 数据内容 */
|
|
|
- data: {
|
|
|
- id: "root",
|
|
|
- topic: "jsMind",
|
|
|
- children: [{
|
|
|
- id: "easy",
|
|
|
- topic: "Easy",
|
|
|
- direction: "left",
|
|
|
- expanded: false,
|
|
|
- children: [{
|
|
|
- id: "easy1",
|
|
|
- topic: "Easy to show"
|
|
|
- },
|
|
|
- {
|
|
|
- id: "easy2",
|
|
|
- topic: "Easy to edit"
|
|
|
- },
|
|
|
- {
|
|
|
- id: "easy3",
|
|
|
- topic: "Easy to store"
|
|
|
- },
|
|
|
- {
|
|
|
- id: "easy4",
|
|
|
- topic: "Easy to embed"
|
|
|
- }
|
|
|
- ]
|
|
|
- },
|
|
|
- {
|
|
|
- id: "open",
|
|
|
- topic: "Open Source",
|
|
|
- direction: "right",
|
|
|
- expanded: true,
|
|
|
- children: [{
|
|
|
- id: "open1",
|
|
|
- topic: "on GitHub"
|
|
|
- },
|
|
|
- {
|
|
|
- id: "open2",
|
|
|
- topic: "BSD License"
|
|
|
- }
|
|
|
- ]
|
|
|
- },
|
|
|
- {
|
|
|
- id: "powerful",
|
|
|
- topic: "Powerful",
|
|
|
- direction: "right",
|
|
|
- children: [{
|
|
|
- id: "powerful1",
|
|
|
- topic: "Base on Javascript"
|
|
|
- },
|
|
|
- {
|
|
|
- id: "powerful2",
|
|
|
- topic: "Base on HTML5"
|
|
|
- },
|
|
|
- {
|
|
|
- id: "powerful3",
|
|
|
- topic: "Depends on you"
|
|
|
- }
|
|
|
- ]
|
|
|
- },
|
|
|
- {
|
|
|
- id: "other",
|
|
|
- topic: "test node",
|
|
|
- direction: "left",
|
|
|
- children: [{
|
|
|
- id: "other1",
|
|
|
- topic: "I'm from local variable"
|
|
|
- },
|
|
|
- {
|
|
|
- id: "other2",
|
|
|
- topic: "I can do everything"
|
|
|
- }
|
|
|
- ]
|
|
|
+ //节点选中事件
|
|
|
+ async openNode(node) {
|
|
|
+ //次级列表children,自定义id ownId,请求参数,请求函数ajaxFun,显示子集的文案text,子集的data
|
|
|
+ let children, ownId,param,ajaxFun,text,nodeOwnData;
|
|
|
+ this.jsMind.options.editable = true
|
|
|
+ console.log(node.data)
|
|
|
+ //删除已有的假节点
|
|
|
+ this.removeNode(node, this.jsMind)
|
|
|
+ if (!!node.data && node.data.pointType == "system") {
|
|
|
+ //系统级
|
|
|
+ param = {
|
|
|
+ DataSourceId: this.datasourceId,
|
|
|
+ PhysicalSystem: node.data.name
|
|
|
+ }
|
|
|
+ ajaxFun = this.activeIndex == 0 ? platformEqJsMind : pointTypeJsMind
|
|
|
+ console.log(ajaxFun)
|
|
|
+ children = await this.getList(param, ajaxFun)
|
|
|
+ console.log(children)
|
|
|
+ children.map(item => {
|
|
|
+ text = item.EquipmentType || `${item.Description}(${item.Address})`
|
|
|
+ nodeOwnData = {
|
|
|
+ pointType: "eq",
|
|
|
+ name: item.EquipmentType || item.Description,
|
|
|
+ systemName: node.data.name
|
|
|
+ }
|
|
|
+ ownId = this.createRandomId()
|
|
|
+ this.jsMind.add_node(node, ownId, text , nodeOwnData)
|
|
|
+ this.addNodeDefault(ownId)
|
|
|
+ })
|
|
|
+ }
|
|
|
+ if (!!node.data && node.data.pointType == "eq") {
|
|
|
+ //标识级
|
|
|
+ param = {
|
|
|
+ DataSourceId: this.datasourceId,
|
|
|
+ EquipmentType: node.data.name,
|
|
|
+ PhysicalSystem: node.data.systemName
|
|
|
+ }
|
|
|
+ ajaxFun = this.activeIndex == 0 ? platformIdentJsMind : pointPostJsMind
|
|
|
+ children = await this.getList(param, ajaxFun)
|
|
|
+ if (!children) {
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ console.log(children)
|
|
|
+ children.map(item => {
|
|
|
+ text = this.activeIndex == 0 ? item.DataQuality + item.EquipmentMark : `${item.Description}(${item.Address}):${item.Data.Data}-${item.Data.Unit}-${item.Data.Time}`
|
|
|
+ nodeOwnData = {
|
|
|
+ pointType: "ident",
|
|
|
+ name: this.activeIndex == 0 ? item.EquipmentMark : item.Description,
|
|
|
+ systemName: node.data.systemName,
|
|
|
+ EquipmentType: node.data.name
|
|
|
}
|
|
|
- ]
|
|
|
+ console.log(text,nodeOwnData)
|
|
|
+ ownId = this.createRandomId()
|
|
|
+ this.jsMind.add_node(node, ownId, text, nodeOwnData)
|
|
|
+ this.addNodeDefault(ownId)
|
|
|
+ })
|
|
|
+ }
|
|
|
+ if (!!node.data && node.data.pointType == "ident") {
|
|
|
+ //信息级
|
|
|
+ param = {
|
|
|
+ DataSourceId: this.datasourceId,
|
|
|
+ EquipmentType: node.data.EquipmentType,
|
|
|
+ PhysicalSystem: node.data.systemName,
|
|
|
+ [ this.activeIndex == 0 ? "EquipmentMark" : "Description"]: node.data.name
|
|
|
+ }
|
|
|
+ ajaxFun = this.activeIndex == 0 ? platformInfoJsMind : pointInfoJsMind
|
|
|
+ children = await this.getList(param, ajaxFun)
|
|
|
+ if (!children) {
|
|
|
+ return false
|
|
|
}
|
|
|
- };
|
|
|
- let jsMind1 = this.$refs.jsmind1.initData({}, mind)
|
|
|
+ console.log(children)
|
|
|
+ children.map(item => {
|
|
|
+ ownId = this.createRandomId()
|
|
|
+ text = `${item.InfomationPoint}(${item.MeterFunc}):${item.Data.Data}-${item.Data.Unit}-${item.Data.Time}`
|
|
|
+ nodeOwnData = {
|
|
|
+ pointType: "point",
|
|
|
+ InfomationPoint: item.InfomationPoint,
|
|
|
+ EquipmentMark: node.data.name,
|
|
|
+ systemName: node.data.systemName,
|
|
|
+ EquipmentType: node.data.EquipmentType
|
|
|
+ }
|
|
|
+ this.jsMind.add_node(node, ownId, text, nodeOwnData)
|
|
|
+ if(this.activeIndex == 0){
|
|
|
+ console.log(111)
|
|
|
+ this.addNodeDefault(ownId)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ if (!!node.data && node.data.pointType == "point") {
|
|
|
+ //信息级
|
|
|
+ children = await this.getList({
|
|
|
+ DataSourceId: this.datasourceId,
|
|
|
+ EquipmentType: node.data.EquipmentType,
|
|
|
+ PhysicalSystem: node.data.systemName,
|
|
|
+ EquipmentMark: node.data.EquipmentMark,
|
|
|
+ InfomationPoint: node.data.InfomationPoint
|
|
|
+ }, platformPointJsMind)
|
|
|
+ if (!children) {
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ console.log(children)
|
|
|
+ children.map(item => {
|
|
|
+ ownId = this.createRandomId()
|
|
|
+ this.jsMind.add_node(node, ownId, `${item.Description}(${item.Address}):${item.Data.Data}-${item.Data.Unit}-${item.Data.Time}`, {
|
|
|
+ pointType: "point",
|
|
|
+ InfomationPoint: item.InfomationPoint,
|
|
|
+ EquipmentMark: node.data.name,
|
|
|
+ systemName: node.data.systemName,
|
|
|
+ EquipmentType: node.data.EquipmentType
|
|
|
+ })
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //统一添加默认级数
|
|
|
+ addNodeDefault(ownId) {
|
|
|
+ //给下一级添加默认的级数
|
|
|
+ this.jsMind.add_node(ownId, this.createRandomId(), "")
|
|
|
+ //收起该节点下的子节点
|
|
|
+ this.jsMind.collapse_node(ownId)
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 删除某个节点下所有的节点
|
|
|
+ * @param {该节点} node
|
|
|
+ * @param {jsmind实例} jsmind
|
|
|
+ */
|
|
|
+ removeNode(node, jsmind) {
|
|
|
+ if(!!node.children){
|
|
|
+ node.children.map(item => {
|
|
|
+ this.jsMind.remove_node(item)
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //获取接口封装
|
|
|
+ getList(param, fun) {
|
|
|
+ return new Promise((resolve, reject) => {
|
|
|
+ fun(
|
|
|
+ param,
|
|
|
+ res => {
|
|
|
+ console.log(res)
|
|
|
+ resolve(res.Content)
|
|
|
+ }
|
|
|
+ )
|
|
|
+ })
|
|
|
+ },
|
|
|
+ clickTabs(val) {
|
|
|
+ this.activeIndex = val.index
|
|
|
+ var data = {
|
|
|
+ id: "root",
|
|
|
+ topic: this.dataName,
|
|
|
+ children: []
|
|
|
+ },
|
|
|
+ mind = {
|
|
|
+ /* 元数据,定义思维导图的名称、作者、版本等信息 */
|
|
|
+ meta: {
|
|
|
+ name: "jsMind-demo-tree",
|
|
|
+ author: "sagacloud",
|
|
|
+ version: "0.2"
|
|
|
+ },
|
|
|
+ /* 数据格式声明 */
|
|
|
+ format: "node_tree",
|
|
|
+ /* 数据内容 */
|
|
|
+ data: data
|
|
|
+ },
|
|
|
+ id,func;
|
|
|
+ func = this.activeIndex == 0 ? platformSysJsMind : pointSytemJsMind
|
|
|
+ func({
|
|
|
+ DataSourceId: this.datasourceId
|
|
|
+ }, res => {
|
|
|
+ data.children = res.Content.map(item => {
|
|
|
+ id = this.createRandomId();
|
|
|
+ return {
|
|
|
+ id: id,
|
|
|
+ topic: `<div>${item.SpecialtySystem}(${item.PointCount})</div>`,
|
|
|
+ expanded: false,
|
|
|
+ pointType: "system",
|
|
|
+ name: item.SpecialtySystem,
|
|
|
+ children: [{
|
|
|
+ id: this.createRandomId(),
|
|
|
+ topic: "",
|
|
|
+ }]
|
|
|
+ }
|
|
|
+ })
|
|
|
+ console.log(data, "data")
|
|
|
+ this.$nextTick(_ => {
|
|
|
+ if(!!this.mindArr[this.activeIndex]){
|
|
|
+ this.jsMind = this.mindArr[this.activeIndex]
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ console.log(val.index, this.$refs.jsmind,this.$refs.jsmind1)
|
|
|
+ if(this.activeIndex == 0){
|
|
|
+ this.jsMind = this.$refs.jsmind.initData({}, mind)
|
|
|
+ }else{
|
|
|
+ this.jsMind = this.$refs.jsmind1.initData({}, mind)
|
|
|
+ }
|
|
|
+ this.mindArr[this.activeIndex] = this.jsMind
|
|
|
+ this.jsMind.options.editable = false
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ createRandomId() {
|
|
|
+ return (Math.random() * 10000000).toString(16).substr(0, 4) + '-' + (new Date()).getTime() + '-' + Math.random().toString().substr(2, 5);
|
|
|
}
|
|
|
},
|
|
|
components: {
|