图谱可视化

src/api/graph/entity.js

@@ -519,7 +519,7 @@ function getRelationEnt(
 function getChart(data) {
 	return request({
 		method: 'post',
-		url: `/show/graph`,
+		url: `/knowledge/statisticalMap/show/graph`,
 		data: data,
 		headers: {
 			'Content-Type': 'application/json;charset=UTF-8'

src/api/graph/relationClass.js

@@ -194,8 +194,8 @@ function deleteEntityRelation(relIds, isModel) {
 //新的getAllRelationClass函数
 function getAllRelationClass() {
 	return request({
-		method: 'post',
-		url: `/relcls/getall`
+		method: 'get',
+		url: `/knowledge/classRelation/relcls/getall`
 	})
 }
 

src/api/graph/statisticalMap.js

@@ -8,8 +8,8 @@ import request from '@/utils/request'
 function getEntityListByStr(str) {
     return request({
         method: 'get',
-        url: '/show/entlist',
-        data: {
+        url: '/knowledge/entity/show/entlist',
+        params: {
             name: str
         }
     })
@@ -130,7 +130,7 @@ function getRelationAttrsByRelationId(id) {
 function getGraphEntClsTree(id) {
     return request({
         method: 'get',
-        url: '/statistic/entclslist',
+        url: '/knowledge/statisticalMap/statistic/entclslist',
         path: {
             id: id
         }

src/assets/knowledge/config/config.js

@@ -164,36 +164,36 @@ window.global = {
 			// 		},
 			// 	],
 			// },
-			// {
-			// 	code: 'graph_visual',
-			// 	icon: 'dot-chart',
-			// 	name: '图谱可视化',
-			// 	link: '/',
-			// 	children: [
-			// 		{
-			// 			code: 'entcls_visual',
-			// 			name: '实体类可视化',
-			// 			link: '/sta/entity_class_view',
-			// 		},
-            //         // {
-			// 		// 	code: 'ent_visual_v1',
-			// 		// 	name:
-			// 		// 		window.USER_ROLE_LANGUAGE[window.USER_ROLE]
-			// 		// 			.ENT_VIEW,
-			// 		// 	link: '/sta_v1',
-			// 		// },
-			// 		{
-			// 			code: 'ent_visual',
-			// 			name: '实体可视化',
-			// 			link: '/sta',
-			// 		},
-            //         {
-			// 			code: 'ent_contrast',
-			// 			name: '实体对比',
-			// 			link: '/sta/contrast',
-			// 		},
-			// 	],
-			// },
+			{
+				code: 'graph_visual',
+				icon: 'dot-chart',
+				name: '图谱可视化',
+				link: '/',
+				children: [
+					{
+						code: 'entcls_visual',
+						name: '实体类可视化',
+						link: '/sta/entity_class_view',
+					},
+                    // {
+					// 	code: 'ent_visual_v1',
+					// 	name:
+					// 		window.USER_ROLE_LANGUAGE[window.USER_ROLE]
+					// 			.ENT_VIEW,
+					// 	link: '/sta_v1',
+					// },
+					{
+						code: 'ent_visual',
+						name: '实体可视化',
+						link: '/sta',
+					},
+                    // {
+					// 	code: 'ent_contrast',
+					// 	name: '实体对比',
+					// 	link: '/sta/contrast',
+					// },
+				],
+			},
 			// {
 			// 	code: 'analyse',
 			// 	icon: 'deployment-unit',

src/router/index.js

@@ -91,9 +91,8 @@ export const constantRoutes = [
     ]
   },
   // 知识图谱路由
-  ...Knowledge
-
-]
+  ...Knowledge,
+  ]
 
 // 动态路由，基于用户权限动态去加载
 export const dynamicRoutes = [

src/router/knowledge/index.js

@@ -19,6 +19,7 @@ import ECM_RelationEditor from '@/views/knowledge/graphClass/relationEditor.vue'
 import ECM_RelationAttrEditor from '@/views/knowledge/graphClass/relationAttrEditor.vue' //管理器 -> 实体类 -> 关系 -> 关系属性列表
 // import EM_ECM_TagEditor from '@/views/manager/common/tagEditor-bak.vue'
 
+import StatisticalMap from '@/router/knowledge/statisticalMap'
 
 import BlankPage from '@/views/knowledge/common/blank.vue' // 空白页面
 
@@ -163,6 +164,7 @@ export default [
         hidden: true,
         component: () => import('@/views/knowledge/graphEntity/attrModelEditor.vue')
       },
+      ...StatisticalMap,
     ]
   }
 ]

src/router/knowledge/statisticalMap.js

@@ -0,0 +1,188 @@
+const version = 'base' // 版本控制
+
+// import roadComputedPage from '@/views/statistical/roadComputed.vue' // 路径分析
+// import entityClassViewPage from '@/views/statistical/entityClassView.vue' // 实体类可视化图谱
+// import StatisticalGraphPage from '@/views/statistical/statisticalGraph.vue' // 图谱数据统计
+// import entClsStatistical from '@/views/statistical/recordStatistical/entClsStatistical.vue' // 图谱数据统计 -> 实体类统计->左侧->实体类树
+// import entClsStatisticalDetail from '@/views/statistical/recordStatistical/entClsStatisticalDetail.vue' // 图谱数据统计 -> 实体类统计->右侧->关系统计（主模块）
+// import entClsRelStatistical from '@/views/statistical/recordStatistical/entClsRelStatistical.vue' // 图谱数据统计 -> 实体类统计->右侧->关系统计图表
+// import entClsAttrStatistical from '@/views/statistical/recordStatistical/entClsAttrStatistical.vue' // 图谱数据统计 -> 实体类统计->右侧->属性统计图表
+
+// import relationClsStatisticalList from '@/views/statistical/recordStatistical/relationClsStatisticalList.vue' // 图谱数据统计->左侧->关系类统计列表
+// import relClsStatisticalDetail from '@/views/statistical/recordStatistical/relClsStatisticalDetail.vue' // 图谱数据统计->右侧->关系类统计详情
+
+// import BlankPage from '@/views/common/blank.vue' // 空白页面
+export default [
+	/**
+	 * statistical
+	 */
+    //  {
+	// 	path: '/sta_v1',
+	// 	name: 'analyse.statistical',
+	// 	meta: {
+	// 		code: 'ent_visual',
+	// 	},
+	// 	component: () => {
+	// 		if (version === 'base') {
+	// 			return import('@/views/statistical/statisticalMap_base.vue')
+	// 		} else if (version === 'bf') {
+	// 			return import('@/views/statistical/statisticalMap_bf.vue')
+	// 		}
+	// 	}, //图谱统计
+	// },
+    {
+		path: '/sta',
+		name: 'analyse.statistical',
+		hidden: true,
+		meta: {
+			code: 'ent_visual',
+		},
+		component: () => import('@/views/knowledge/statistical/statisticalMap_v1.vue')//图谱统计
+	},
+	// {
+	// 	path: '/sta/road_computed',
+	// 	name: 'analyse.road_computed',
+	// 	meta: {
+	// 		code: 'path_calculation',
+	// 	},
+	// 	component: () => import('@/views/statistical/roadComputed.vue'), // 路径分析
+	// },
+	// {
+	// 	path: '/sta/influence',
+	// 	name: 'influence',
+	// 	meta: {
+	// 		code: 'influence',
+	// 	},
+	// 	component: () => import('@/views/statistical/influence.vue'), // 影响力分析
+	// },
+	{
+		path: '/sta/entity_class_view',
+		name: 'analyse.entity_class_view',
+		hidden: true,
+		meta: {
+			code: 'entcls_visual',
+		},
+		component: () => import('@/views/knowledge/statistical/entityClassView.vue'), // 实体类可视化图谱
+	},
+    // {
+	// 	path: '/sta/contrast',
+	// 	name: 'sta/contrast',
+	// 	hidden: true,
+	// 	meta: {
+	// 		code: 'entcls_visual',
+	// 	},
+	// 	component: () => import('@/views/statistical/contrast.vue'), // 实体类对比
+	// },
+	/**
+	 * 图谱数据统计总模块
+	 */
+	// {
+	// 	path: '/sta/data',
+	// 	name: 'statistic.data',
+	// 	meta: {
+	// 		code: 'analyse',
+	// 	},
+	// 	component: StatisticalGraphPage,
+	// 	children: [
+	// 		/**
+	// 		 * 图谱数据统计 -> 空白页
+	// 		 */
+	// 		{
+	// 			path: 'entcls',
+	// 			name: 'statistic.data.entcls',
+	// 			meta: {
+	// 				msg: '请选中' + TEXT.ENT_CLS,
+	// 				active: 'entcls',
+	// 				code: 'graph_sta_cal',
+	// 			},
+	// 			components: {
+	// 				sidebar: entClsStatistical,
+	// 				main: BlankPage,
+	// 			},
+	// 		},
+	// 		/**
+	// 		 * 图谱数据统计 -> 实体类统计
+	// 		 */
+	// 		{
+	// 			path: 'entcls/:entClsID',
+	// 			meta: {
+	// 				active: 'entcls',
+	// 				code: 'graph_sta_cal',
+	// 			},
+	// 			components: {
+	// 				sidebar: entClsStatistical,
+	// 				main: entClsStatisticalDetail,
+	// 			},
+	// 			children: [
+	// 				/**
+	// 				 * 图谱数据统计 -> 实体类统计 -> 关系统计
+	// 				 */
+	// 				{
+	// 					path: '',
+	// 					name: 'statistic.data.entcls.relSta',
+	// 					meta: {
+	// 						active: 'entcls',
+	// 						isLink: 'relSta',
+	// 						code: 'graph_sta_cal',
+	// 					},
+	// 					component: entClsRelStatistical,
+	// 				},
+	// 				/**
+	// 				 * 图谱数据统计 -> 实体类统计 -> 属性统计
+	// 				 */
+	// 				{
+	// 					path: 'attrSta',
+	// 					name: 'statistic.data.entcls.attrSta',
+	// 					meta: {
+	// 						active: 'entcls',
+	// 						isLink: 'attrSta',
+	// 						code: 'graph_sta_cal',
+	// 					},
+	// 					component: entClsAttrStatistical,
+	// 				},
+	// 			],
+	// 		},
+	// 		/**
+	// 		 * 图谱数据统计 -> 关系类统计
+	// 		 */
+	// 		// {
+	// 		//   path: 'relcls',
+	// 		//   name: 'statistic.data.relcls',
+	// 		//   meta: {
+	// 		//     msg: '请选中关系类',
+	// 		//     active: 'relcls'
+	// 		//   },
+	// 		//   components: {
+	// 		//     sidebar: relationClsStatisticalList,
+	// 		//     main: BlankPage
+	// 		//   }
+	// 		// },
+	// 		/**
+	// 		 * 图谱数据统计 -> 关系类统计 -> 关系统计类详情
+	// 		 */
+	// 		// {
+	// 		//   path: 'relcls/:relClsId',
+	// 		//   name: 'statistic.data.relcls.detail',
+	// 		//   meta: {
+	// 		//     active: 'relcls'
+	// 		//   },
+	// 		//   components: {
+	// 		//     sidebar: relationClsStatisticalList,
+	// 		//     main: relClsStatisticalDetail
+	// 		//   }
+	// 		// },
+	// 		{
+	// 			path: 'relcls',
+	// 			name: 'statistic.data.relcls.detail',
+	// 			meta: {
+	// 				active: 'relcls',
+	// 				code: 'analyse',
+	// 			},
+	// 			components: {
+	// 				sidebar: relationClsStatisticalList,
+	// 				main: relClsStatisticalDetail,
+	// 			},
+	// 		},
+	// 	],
+	// },
+]

src/views/knowledge/common/chart.vue

@@ -596,27 +596,35 @@ function linkStyle(link) {
 
 // 格式化成zoomchart需要的nodes
 function getNodes(nodes) {
-	nodes.forEach((node, index) => {
-		if (node.entID) node.id = node.entID
-		if (node.label === undefined) node.label = node.entName
-		if (!node_colors[node.entClsID]) {
-			node_colors[node.entClsID] = colors[index % nodes.length]
-		}
-	})
-	return nodes
+	if(nodes){
+		nodes.forEach((node, index) => {
+			if (node.entID) node.id = node.entID
+			if (node.label === undefined) node.label = node.entName
+			if (!node_colors[node.entClsID]) {
+				node_colors[node.entClsID] = colors[index % nodes.length]
+			}
+		})
+		return nodes
+	} else {
+		return []
+	}
 }
 
 // 格式化成zoomchart需要的links
 function getLinks(links) {
-	links.forEach((link, index) => {
-		if (link.relID) link.id = link.relID
-		if (link.from === undefined) link.from = link.startEntID
-		if (link.to === undefined) link.to = link.endEntID
-		if (!link_colors[link.relClsID]) {
-			link_colors[link.relClsID] = colors[index % links.length]
-		}
-	})
-	return links
+	if(links){
+		links.forEach((link, index) => {
+			if (link.relID) link.id = link.relID
+			if (link.from === undefined) link.from = link.startEntID
+			if (link.to === undefined) link.to = link.endEntID
+			if (!link_colors[link.relClsID]) {
+				link_colors[link.relClsID] = colors[index % links.length]
+			}
+		})
+		return links
+	} else {
+		return []
+	}
 }
 
 // 生成随机颜色

src/views/knowledge/common/entClsDetails.vue

@@ -0,0 +1,63 @@
+<template>
+    <a-card :title="title" class="entCls">
+        <a href="javascript:;" @click="openEntClsDetail(info.entClsID)" slot="extra">详情</a>
+        <ul class="chart-tooltip">
+            <li v-if="info.entClsName" class="infos">
+                <p>实体类名称：<span>{{info.entClsName}}</span></p>
+            </li>
+            <li v-if="info.entClsMemo" class="infos">
+                <p>实体类描述：<span>{{info.entClsMemo}}</span></p>
+            </li>
+            <template v-for="attrs in attrList">
+                <li :key="attrs" v-if="attrs.attrClsName" class="attrs-list">
+                    <p>
+                        <span v-if="attrs.attrClsName">{{attrs.attrClsName}}：{{attrs.entAttrValueVO
+                          ? attrs.entAttrValueVO.attrValue
+                          : ''}} </span>
+                        <span v-if="attrs.attrUnit"> {{attrs.attrUnit}}</span>
+                    </p>
+                </li>
+            </template>
+        </ul>
+    </a-card>
+</template>
+
+<script>
+import { getEntityClass } from '@/api/graph/entityClass'
+
+  export default {
+    props: ['id'],
+    data () {
+      return {
+        title: null,
+        info: {},
+        attrList: []
+      }
+    },
+    created () {
+      const vm = this
+      getEntityClass(vm.id).then((response) => {
+        vm.$set(vm, 'info', response)
+        vm.$set(vm, 'title', response.entClsName)
+        if (response.entClsAllowAttrType.indexOf('ELEM') > -1) {
+          api.statisticalMap.getAttrClsListByEntClsId('ELEM', vm.id).then((_response) => {
+            vm.attrList = _response
+          })
+        }
+      })
+    },
+    methods: {
+      openEntClsDetail (id) { // 跳转实体类详情
+        const baseUrl = this.$getBaseUrl()
+        window.open(baseUrl+'/mng/class/' + id + '/')
+      }
+    }
+  }
+
+</script>
+
+<style>
+    .entCls div.ant-card-extra{
+        padding:9px 0px
+    }
+</style>

src/views/knowledge/common/fuzzySearch.vue

@@ -0,0 +1,117 @@
+<template>
+
+	<!-- @select="handleChange" -->
+	<a-select
+		showSearch
+		:value="value"
+		:defaultValue="value"
+		placeholder="请输入关键词"
+		style="width: 200px"
+		:maxTagTextLength="30"
+		:defaultActiveFirstOption="false"
+		:showArrow="false"
+		:filterOption="false"
+		@search="handleSearch"
+		:notFoundContent="fetching ? undefined : notFoundContent"
+        @keyup.13.native="doSearch"
+	>
+		<a-spin v-if="fetching" slot="notFoundContent" size="small" />
+		<a-select-option
+			v-for="(d, $index) in searchResult"
+			:value="d.entId"
+			:key="$index"
+            @click="reSearch"
+		>
+			<!-- <ellipsis :length="50" tooltip> -->
+				{{ d.entName }}
+			<!-- </ellipsis> -->
+		</a-select-option>
+	</a-select>
+</template>
+
+<script>
+import { getEntityListByStr } from '@/api/graph/statisticalMap'
+// import Ellipsis from '@/components/Ellipsis'
+let timeout
+export default {
+	components: {
+		// Ellipsis,
+	},
+	props: ['moduleName', 'urlName', 'keyId'],
+	data() {
+		return {
+			value: '',
+			fetching: false,
+			searchResult: [],
+			notFoundContent: '无返回结果',
+		}
+	},
+	methods: {
+		/*
+		 * 输入框输入时执行的方法
+		 * @params value 输入的字符串
+		 * */
+		handleSearch(value) {
+			const vm = this
+			vm.fetching = true
+			if (timeout) {
+				clearTimeout(timeout)
+				timeout = null
+			}
+			function getResult() {
+				if (value) {
+					value = value.replace(/\'/g, '')
+					// api[vm.moduleName][vm.urlName](value).then((data) => {
+					// 	vm.fetching = false
+					// 	vm.searchResult = data
+					// })
+					getEntityListByStr(value).then((resp) => {
+					  vm.fetching = false
+					  vm.searchResult = resp.data
+					})
+				}
+			}
+			timeout = setTimeout(getResult, 600) // 延迟搜索
+		},
+        reSearch(value){
+            this.handleChange(value.key)
+        },
+		/*
+		 * 搜索框列表选中时执行的方法
+		 * @params value 选中的项为{}
+		 * */
+		handleChange(value) {
+			const vm = this
+			let tar
+			this.searchResult.forEach((v, i) => {
+				// v.entID === value ? tar = v : tar
+				v[vm.keyId] === value ? (tar = v) : tar
+			})
+			this.value = value
+			this.$emit('selected', tar)
+		},
+        doSearch(e){
+            const vm = this
+            let label = e.target.value;
+            this.value = ''
+			this.$emit('enterSearch', label)
+        },
+		/*
+		 * 清空选中项
+		 * */
+		clearSelected() {
+			this.value = ''
+			this.searchResult = []
+		},
+		filterOption(input, option) {
+			return (
+				option.componentOptions.children[0].text
+					.toLowerCase()
+					.indexOf(input.toLowerCase()) >= 0
+			)
+		},
+	},
+}
+</script>
+
+<style></style>

src/views/knowledge/graphEntity/manager.vue.bak

@@ -1,415 +0,0 @@
-<template>
-  <div style="height: 100%">
-    <div
-      class="panel"
-      style="padding:0;height: 50px;margin-bottom: 5px;line-height: 50px;"
-    >
-      <a-form
-        style="display: inline-block;margin-right: 5px;margin-left: 10px;"
-        v-if="$route.path.indexOf('entity_v2') > -1"
-      >
-        <a-form-item>
-          <a-input
-            placeholder="请输入实体名称"
-            v-model="searchValue"
-            style="width: 280px;margin-right: 10px"
-          />
-          <button class="ant-btn ant-btn-primary mr-5" @click="handleSearch">
-            查询实体名称
-          </button>
-          <button class="ant-btn ant-btn-primary" @click="clearSearch">
-            清空查询
-          </button>
-        </a-form-item>
-      </a-form>
-      <a-row style="display: inline-block">
-        <a-button
-          style="margin-right: 5px;margin-left: 10px;"
-          type="primary"
-          @click="entClsImport"
-          v-if="editable && OWL_IMPORT"
-        >
-          <a-icon type="upload" />实体类导入
-        </a-button>
-        <!-- <a-button style="margin-right: 5px" type="primary" @click="entClsExportModal" v-if="editable && OWL_EXPORT">
-          <a-icon type="export" />实体类导出
-        </a-button> -->
-        <a-button
-          style="margin-right: 5px"
-          type="primary"
-          v-if="editable && ENTCLS_GRAPH_VIEW"
-          @click="entClsChart"
-        >
-          <a-icon type="dot-chart" />
-          实体类可视化
-        </a-button>
-        <a-button
-          style="margin-right: 5px"
-          type="primary"
-          @click="entImportModal"
-          v-if="!editable && BF_ENT_IMPORT"
-        >
-          <a-icon type="upload" />集成访问服务导入
-        </a-button>
-        <a-button
-          type="primary"
-          @click="entExportModal"
-          v-if="!editable && BF_ENT_EXPORT"
-        >
-          <a-icon type="export" />集成访问服务导出
-        </a-button>
-      </a-row>
-    </div>
-    <div
-      class="flex-row"
-      :style="{
-        height:
-          $route.path.indexOf('entity_v2') > -1 ? 'calc(100% - 60px)' : '100%',
-      }"
-    >
-      <div id="leftPanel" class="flex-col" style="overflow-y: hidden">
-        <div class="flex1 flex-col panel">
-          <b class="panel-header">
-            <a-icon type="deployment-unit" />&nbsp;实体类
-          </b>
-          <a-spin
-            tip="Loading..."
-            :spinning="spinning"
-            class="select-input flex1"
-          >
-            <ent-cls-list
-              :searchResult="searchResult"
-              :searchValue="searchValue"
-              @emitId="getEntClsId"
-              :activeId="$route.params.classId"
-              v-if="
-                $route.path.indexOf('entity') > -1 && searchResult.length > 0
-              "
-            ></ent-cls-list>
-          </a-spin>
-          <z-tree
-            class="select-input flex1"
-            :editable="editable"
-            style="margin-top:10px;"
-            v-if="searchResult.length == 0 && spinning == false"
-            @nodeSelected="entityClassNodeSelected"
-            @getAllRootList="entClsRootList"
-          ></z-tree>
-          <!--<keep-alive include="ent-cls-ztree">-->
-          <!--<router-view class="select-input flex1" name="treeList" :editable="editable"-->
-          <!--@nodeSelected="entityClassNodeSelected" @getAllRootList="entClsRootList"-->
-          <!--:key="treeKey1"/>-->
-          <!--</keep-alive>-->
-        </div>
-        <router-view
-          v-if="$route.path.indexOf('entity_v2') === -1"
-          class="flex1 panel"
-          name="entityList"
-          :key="treeKey"
-        />
-      </div>
-      <router-view
-        id="rightPanel"
-        name="main"
-        class="flex1 panel flex-col"
-        :key="key"
-        :seaValue="searchValue"
-        :activeId="$route.params.classId"
-      />
-    </div>
-  </div>
-</template>
-
-<script>
-import ClassTree from "@/views/knowledge/graphClass/entityClassTree";
-import zTree from "@/views/knowledge/graphClass/entityClassZtree";
-import entClsList from "@/views/knowledge/graphClass/entClsList";
-
-import { searchEntClsByEntName } from "@/api/graph/entity"
-import { getEntityClass } from "@/api/graph/entityClass"
-
-const isTemplateVersion = true;
-export default {
-  name: "manager",
-  components: {
-    ClassTree,
-    zTree,
-    entClsList,
-  },
-  data() {
-    return {
-      // 功能权限控制
-      OWL_IMPORT: true,
-      OWL_EXPORT: true,
-      ENTCLS_GRAPH_VIEW: true,
-      BF_ENT_IMPORT: true,
-      BF_ENT_EXPORT: true,
-
-      baseUrl: window.global.baseUrl(),
-      searchValue: "", // 搜索的实体名称字符串
-      searchResult: [],
-      spinning: false,
-      rootEntClsList: [], // 根节点实体类列表
-      editable: true, // 判断左侧树是否显示操作按钮
-    };
-  },
-  events: {
-    /**
-     * 新建实体类成功,打开新建的实体类
-     * @param classId 实体类id
-     */
-    ["entityClass:nodeCreated"](classId) {
-      this.entityClassNodeSelected({
-        entClsID: classId,
-      });
-      // this.$router.push({name: 'ECM_item', params: {classId}})
-    },
-    /**
-     * 删除实体类成功,关闭打开的实体类
-     * @param classId 实体类id
-     */
-    ["entityClass:nodeDestroyed"](classId) {
-      if (this.$route.params.classId === classId) {
-        this.$router.push({ name: "ECM_home" });
-      }
-    },
-    /**
-     * 新建实体成功,打开新建的实体
-     * @param entityId 实体类id
-     */
-    ["entity:nodeCreated"](entityId) {
-      this.$router.push({ name: "e_base", params: { entityId } });
-    },
-    /**
-     * 删除实体成功,关闭打开的实体
-     * @param entityId 实体类id
-     */
-    ["entity:nodeDestroyed"](entityId) {
-      if (this.$route.params.entityId === entityId) {
-        this.$router.push({ name: "class_entity" });
-      }
-    },
-    /**
-     * 新建实体成功,打开新建的实体类
-     * @param relationId 关系类id
-     */
-    ["relationClass:nodeCreated"](relationId) {
-      this.$router.push({ name: "relation_edit", params: { relationId } });
-    },
-    /**
-     * 删除关系类成功,关闭打开的关系类
-     * @param relationId 关系类id
-     */
-    ["relationClass:nodeDestroyed"](relationId) {
-      if (this.$route.params.relationId === relationId) {
-        this.$router.push({ name: "relation" });
-      }
-    },
-    /**
-     * 清空搜索，让左侧树恢复
-     */
-    ["entityClass:clearSearch"]() {
-      this.searchValue = "";
-      this.searchResult = [];
-      this.spinning = false
-    },
-  },
-  mounted() {
-    // 获取用户功能权限
-    // if (this.$const.authorityControl) {
-    //   this.OWL_IMPORT = !!this.authMap["OWL_IMPORT"];
-    //   this.OWL_EXPORT = !!this.authMap["OWL_EXPORT"];
-    //   this.ENTCLS_GRAPH_VIEW = !!this.authMap["ENTCLS_GRAPH_VIEW"];
-    //   this.BF_ENT_IMPORT = !!this.authMap["BF_ENT_IMPORT"];
-    //   this.BF_ENT_EXPORT = !!this.authMap["BF_ENT_EXPORT"];
-    // }
-    const searchValue = this.$route.query.searchValue;
-    if (typeof searchValue !== "undefined") {
-      this.searchValue = searchValue
-      this.handleSearch()
-    }
-  },
-  methods: {
-    getEntClsId(id) {
-      const vm = this;
-      if (vm.$route.path.indexOf("entity_v2") > -1) {
-        vm.$router.push({
-          name: "class_entity_v2",
-          params: { classId: id },
-          query: {
-            searchValue: vm.searchValue,
-          },
-        });
-      } else {
-        vm.$router.push({
-          name: "class_entity",
-          params: { classId: id, entClsName: vm.searchValue },
-        });
-      }
-    },
-    // 清空搜索
-    clearSearch() {
-      this.searchValue = "";
-      this.searchResult = [];
-      this.$router.push({ path: "/mng/class/unknow/entity_v2" });
-    },
-    // 搜索
-    handleSearch() {
-      if (this.searchValue === "") {
-        this.$message.error("请输入要搜索的实体名称");
-        return;
-      }
-      this.spinning = true;
-      // this.$router.push({path: '/mng/class/unknow/entity_v2'})
-      searchEntClsByEntName(this.searchValue).then((res) => {
-        let item = { entClsID: "uknow", entClsName: "全部" };
-        res.unshift(item);
-        this.searchResult = res;
-        this.spinning = false;
-      });
-    },
-    // 要导出的根节点实体类列表
-    entClsRootList(list) {
-      this.rootEntClsList = list;
-    },
-    entityClassNodeSelected(node) {
-      if (this.$route.path.indexOf("entity") === -1) {
-        // 实体类大标题下跳转
-        getEntityClass(node.entClsID).then((data) => {
-          if (
-            data.entClsAllowAttrType &&
-            data.entClsAllowAttrType.includes("ELEM")
-          ) {
-            this.$router.push({
-              name: "base",
-              params: { classId: node.entClsID },
-            }); // 有基础属性跳到基础属性
-          } else {
-            this.$router.push({
-              name: "relation",
-              params: { classId: node.entClsID },
-            }); // 否则调到关系属性
-          }
-        });
-      } else {
-        // 实体大标题下跳转
-        if (this.$route.path.indexOf("entity_v2") > -1) {
-          if (isTemplateVersion) {
-            // 如果是带实体模板的版本
-            this.$router.push({
-              name: "class_entity_v2",
-              params: { classId: node.entClsID },
-              query: { clsName: node.name },
-            });
-          } else {
-            this.$router.push({
-              name: "class_entity_v2",
-              params: { classId: node.entClsID },
-            });
-          }
-        } else {
-          this.$router.push({
-            name: "class_entity",
-            params: { classId: node.entClsID },
-          });
-        }
-      }
-    },
-    /**
-     * 导入模态框
-     */
-    entClsImport() {
-      this.$open("entClsImportModal", {}, function() {
-        // 刷新左侧树
-        this.$router.push("/mng/class");
-      });
-    },
-    entClsChart() {
-      this.$router.push("/sta/entity_class_view");
-    },
-    /**
-     * 导出模态框
-     */
-    entClsExportModal() {
-      this.$open(
-        "entClsExportModal",
-        {
-          rootEntClsList: this.rootEntClsList, // 根节点实体类列表
-        },
-        function() {}
-      );
-    },
-    // 实体导入
-    entImportModal() {
-      this.$open("uploadZipServiceModal", {});
-    },
-    // 实体导出
-    entExportModal() {
-      this.$open("entClsServiceExportModal", {});
-    },
-  },
-
-  beforeCreate() {
-    if (this.$route.name === "manager") {
-      this.$router.push("/mng/class");
-    }
-  },
-  beforeRouteUpdate(to, from, next) {
-    const path = to.path;
-    if (path.indexOf("entity") > -1) {
-      this.editable = false;
-    } else {
-      this.editable = true;
-      this.searchResult.length = 0;
-      this.searchValue = "";
-      this.spinning = false;
-    }
-    next();
-  },
-  beforeRouteEnter(to, from, next) {
-    next((vm) => {
-      const path = vm.$route.path;
-      if (path.indexOf("entity") > -1) {
-        vm.editable = false;
-      } else {
-        vm.editable = true;
-      }
-    });
-  },
-  computed: {
-    treeKey1() {
-      var key =
-        this.$route.path + this.$route.params ? this.$route.params.classId : "";
-      return key;
-    },
-    treeKey() {
-      var key =
-        this.$route.path + this.$route.params ? this.$route.params.classId : "";
-      return key;
-    },
-    key() {
-      var key =
-        this.$route.path + this.$route.params
-          ? this.$route.params.classId + this.$route.params.entityId
-          : "";
-      return key;
-    },
-  },
-};
-</script>
-
-<style scoped>
-.rela-box {
-  display: block;
-  width: 230px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-#leftPanel {
-  height: 100%;
-  min-width: 300px;
-  overflow: auto;
-}
-</style>

src/views/knowledge/statistical/entityClassView.vue

@@ -0,0 +1,469 @@
+<template>
+    <div class="flex-row"
+         style="height: 100%">
+        <div id="leftPanel"
+             class="flex-col road"
+             v-if="showLeftBar">
+            <div class="flex1 flex-col panel"
+                 style="height:0">
+                <b class="panel-header">
+                    <a-icon type="deployment-unit"/>
+                    显示实体类
+                </b>
+                <a-spin :spinning="loadingTree" style="max-height: 500px;" class="auto-overflow flex1">
+                    <a-checkbox v-model="checkAllEntcls" @change="onCheckAllChange"> 全选 </a-checkbox>
+                    <a-tree checkable
+                            :defaultSelectedKeys="selectTreeNodeIdList"
+                            v-model="checkedKeys"
+                            @select="onSelect"
+                            @check="onCheckEntCls"
+                            :treeData="treeData"
+                            :selectedKeys.sync="selectTreeNodeIdList"
+                            :expandedKeys.sync="expandedKeys"
+                            :autoExpandParent="autoExpandParent"
+                            class="entity-class-tree ">
+                    </a-tree>
+                </a-spin>
+            </div>
+            <div class="flex1 flex-col panel" style="height:0">
+                <b class="panel-header">
+                    <a-icon type="deployment-unit"/>
+                    选择显示关系类
+                </b>
+                <a-spin :spinning="loadingChecked" class="auto-overflow" style="padding: 0 10px; margin: 5px -10px;">
+                    <a-checkbox-group id="mycheck"
+                                      :options="allRelClsNameList"
+                                      v-model="checkedRelClsNameList"
+                                      @change="onChangeRelClsCheckBox">
+                    </a-checkbox-group>
+                </a-spin>
+            </div>
+        </div>
+        <a-spin :spinning="loadingChecked" class="flex1 panel flex-col" style="height: 100%">
+            <chart-comp ref="chart"
+                        @="getInfoTooltip"
+                        :isShowContextMenu="true"
+                        @reloadChart="reloadChart"
+                        :nodes="nodes"
+                        :links="links"
+                        :enable="true"
+                        :isShowChart="true"></chart-comp>
+        </a-spin>
+
+        <entity-cls-details-tooltip class="chart_tooltip"
+                                    :id="tooltip.entClsID"
+                                    :key="tooltip.entClsID"
+                                    v-if="tooltip.entClsID"
+                                    style="position: absolute;z-index: 1;border-radius: 3px"
+                                    :style="{'left': tooltip.x, 'top': tooltip.y}"></entity-cls-details-tooltip>
+        <link-details-tooltip class="chart_tooltip"
+                              :id="tooltip.relClsID"
+                              :key="tooltip.relClsID"
+                              :entCls="relClsName"
+                              v-if="tooltip.relClsID"
+                              style="position: absolute;z-index: 1;border-radius: 3px"
+                              :style="{'left': tooltip.x, 'top': tooltip.y}"></link-details-tooltip>
+    </div>
+
+</template>
+
+<script>
+  import chartComp from '@/views/knowledge/common/chart'
+  import entityClsDetailsTooltip from '@/views/knowledge/common/entClsDetails.vue'
+  import linkDetailsTooltip from '@/views/knowledge/common/linkDetails.vue'
+
+  import { getAllEntityClass } from '@/api/graph/entityClass'
+  import { getAllRelationClass } from '@/api/graph/relationClass'
+  import { getGraphEntClsTree } from '@/api/graph/statisticalMap'
+  
+
+  // 获取路径参数
+  function getQueryVariable(variable) {
+    let url = window.location.hash
+    let index = url.indexOf('?')
+    var query = url.substring(index + 1, url.length)
+    var vars = query.split('&')
+    for (var i = 0; i < vars.length; i++) {
+      var pair = vars[i].split('=')
+      if (pair[0] == variable) {
+        return pair[1]
+      }
+    }
+    return ''
+  }
+  const gData = [] // 左侧实体类树
+
+  const dataList = []
+  // 根据树生成一个列表
+  const generateList = (data) => {
+    for (let i = 0; i < data.length; i++) {
+      const node = data[i]
+      const key = node.key
+      dataList.push({key, title: node.entClsName, entClsName: node.entClsName})
+      if (node.children) {
+        generateList(node.children, node.key)
+      }
+    }
+  }
+  //  得到需要展开的父节点key
+  const getParentKey = (key, tree) => {
+    let parentKey
+    for (let i = 0; i < tree.length; i++) {
+      const node = tree[i]
+      if (node.children) {
+        if (node.children.some(item => item.key === key)) {
+          parentKey = node.key
+        } else {
+          const tp = getParentKey(key, node.children)
+          if (tp) {
+            parentKey = tp
+          }
+        }
+      }
+    }
+    return parentKey
+  }
+  // 遍历一个树节点 找寻所有的子id
+  const getIdsList = (root) => {
+    let ids = []
+    if (root.entClsID) ids.push(root.entClsID)
+    if (root.children && root.children.length) {
+      for (let i = 0; i < root.children.length; i++) {
+        ids = ids.concat(getIdsList(root.children[i]))
+      }
+    }
+    return ids
+  }
+  export default {
+    components: {chartComp, entityClsDetailsTooltip, linkDetailsTooltip},
+    data() {
+      return {
+        loadingTree: false,
+        loadingChecked: false,
+        checkAllEntcls: true,
+        nodes: null,
+        links: null,
+        tooltip: {entClsID: false, relClsID: false},
+        relClsName: '',
+        expandedKeys: [], // 要展开的节点
+        searchValue: '', // 搜索的实体类名字
+        autoExpandParent: true,
+        gData,
+        selectTreeNodeIdList: [],
+        checkedKeys: [], // 默认全部选中
+        relClsList: [], // 关系类列表
+        allRelClsNameList: [],// 所有的关系类名列表
+        checkedRelClsNameList: [], // 去重的关系类名列表
+        allEntClassCache: [], // 初始页面缓存所有的实体类
+        allLinksCache: [],  // 初始页面缓存所有的路径信息
+        filEntClass: undefined, // 选择树处理后的实体类
+        filLinks: undefined, // 处理后的路径信息links
+        showLeftBar: true //是否显示左侧可选框
+      }
+    },
+    computed: {
+      /**
+       * 默认初始全部选中的关系类
+       **/
+      checkedRelCls() {
+        var checkedIdList = []
+        this.relClsList.forEach((v, i) => {
+          if (v.checked === undefined || v.checked === true) {
+            checkedIdList.push(v.value)
+          }
+        })
+        return checkedIdList
+      },
+      /**
+       * 实际绑定在树上的变量,根据rootId可能有不同
+       **/
+      treeData() {
+        var returnData = []
+        if (this.rootId) {
+          // 搜索根节点
+          this.$utils.tree.walk(this.gData, (node) => {
+            if (node.entClsID === this.rootId) {
+              returnData = [node]
+              return false
+            }
+          })
+        } else {
+          returnData = this.gData
+        }
+        // 如果有搜索字符串
+        var searchStr = this.searchValue
+        if (searchStr) {
+          // 向上遍历到所有要展开的父节点
+          const expandedKeys = dataList.map((item) => {
+            if (item.title.indexOf(searchStr) > -1) {
+              return getParentKey(item.key, returnData)  // 返回要展开的父节点keys
+            }
+            return null
+          }).filter((item, i, self) => item && self.indexOf(item) === i)
+          // 设定展开
+          Object.assign(this, {
+            expandedKeys,
+            autoExpandParent: true
+          })
+          // 遍历整个树
+          var showParentNodeList = []
+          this.$utils.tree.walk(returnData, (node, index, way) => {
+            if (node.entClsName.indexOf(searchStr) > -1) {
+              node.style = ''
+              showParentNodeList = showParentNodeList.concat(way)
+            } else {
+              node.style = 'display:none'
+            }
+          })
+          for (var i = 0; i < showParentNodeList.length; i++) {
+            showParentNodeList[i].style = ''
+          }
+        } else {
+          // 没有搜索串,遍历清空display:none
+          this.$utils.tree.walk(returnData, (node) => {
+            node.style = ''
+          })
+        }
+        return returnData
+      }
+    },
+    created() {
+      this.showLeftBar = getQueryVariable('showLeftBar') === 'false' ? false : true;
+      let clsId = getQueryVariable('clsId')
+      this.refreshEntityClassList(clsId)
+      /**
+       * 请求数据，获取所有实体类的信息，然后根据pid组装出实体类之间的关系
+       * */
+      this.loadingChecked = true
+      Promise.all([getAllEntityClass(true), getAllRelationClass()]).then((resp) => {
+        let links = []
+        resp[0].data.forEach((v) => {
+          v.id = v.entClsID
+          v.label = v.entClsName
+          if (v.pid !== null) {
+            let fromId = v.pid, toId = v.entClsID
+            const item = {
+              id: fromId + '_' + toId
+            }
+            item.from = v.pid
+            item.to = v.entClsID
+            item.classType = 'dashed'
+            links.push(item)
+          }
+        })
+        var relClassNameTempMap = {}
+        resp[1].data.forEach((v) => {
+          const item = {
+            label: v.relClsName,
+            value: v.relClsID,
+            checked: true
+          }
+          v.from = v.startID
+          v.to = v.endID
+          v.id = v.relClsID
+          v.label = v.relClsName
+          this.relClsList.push(item)
+          relClassNameTempMap[v.relClsName] = true
+        })
+        //去掉重复关系类名
+        for (let name in relClassNameTempMap) {
+          this.allRelClsNameList.push({
+            label: name,
+            value: name
+          })
+          this.checkedRelClsNameList.push(name)
+        }
+        links = links.concat(resp[1])
+        this.allEntClassCache = resp[0]
+        this.filLinks = this.allLinksCache = links
+
+        if (clsId) { // 路径中存在实体类id
+          this.onCheckEntCls(this.checkedKeys)
+        } else {
+          this.drawChart(resp[0].data, links)
+        }
+        this.loadingChecked = false
+      })
+    },
+    methods: {
+      reloadChart(nodes, links) {
+        this.drawChart(nodes, links)
+      },
+      /**
+       * 画图
+       * @params nodes: 处理好的实体数据, link: 处理好的关系数据
+       * */
+      drawChart(nodes, links) {
+        this.nodes = nodes
+        this.links = links
+        this.$refs.chart.destroyChart() // 先清空chart实例，再绘图
+        this.$refs.chart.reDraw(undefined, nodes, links)
+      },
+      /**
+       * 获取实体或关系的悬浮框
+       * @params event:zoomchart返回的event，args：zoomchart返回的变量，包含了当前点击的实体或关系的数据
+       * */
+      getInfoTooltip(event, args) {
+        const vm = this
+        this.$set(this.tooltip, 'x', event.pageX + 'px')
+        this.$set(this.tooltip, 'y', event.pageY + 'px')
+        if (args.clickNode) {
+          vm.tooltip.entClsID = args.clickNode.data.entClsID
+          vm.tooltip.relClsID = false
+        } else if (args.clickLink) {
+          vm.tooltip.entClsID = false
+          vm.tooltip.relClsID = args.clickLink.data.relClsID
+          vm.relClsName = args.clickLink.data.relClsName
+        } else {
+          vm.tooltip.entClsID = false
+          vm.tooltip.relClsID = false
+        }
+      },
+      // 全选
+      onCheckAllChange() {
+        const allEntCls = []
+        this.allEntClassCache.map(v => {
+          allEntCls.push(v.entClsID)
+        })
+        this.onCheckEntCls(this.checkAllEntcls ? allEntCls : [])
+        this.checkedKeys = this.checkAllEntcls ? allEntCls : []
+      },
+      onSelect(keys, node) {
+        let entClsID = node.node.dataRef.entClsID
+        this.expandedKeys = keys // 选中展开的key
+      },
+      /**
+       * 改变实体类
+       */
+      onCheckEntCls(checkedKeys) {
+        // 过滤缓存中的实体类 得到新的实体类
+        let entClass = this.allEntClassCache.filter((v, i) => {
+          return checkedKeys.includes(v.entClsID)
+        })
+        // 过滤缓存中的实体类 保存到data中，用于过滤
+        this.filEntClass = entClass
+        // 过滤缓存中的路径信息 得到新的路径
+        let links = this.allLinksCache.filter((v, i) => {
+          if (v.classType === 'dashed') {
+            return checkedKeys.includes(v.from) && checkedKeys.includes(v.to)
+          } else if (v.relClsID) {
+            return checkedKeys.includes(v.from) && checkedKeys.includes(v.to)
+          }
+        })
+        const relClassNameTempMap = {},
+          allRelClsNameList = [],
+          checkedRelClsNameList = []
+        // 重新计算关系类列表 去掉重名计算
+        links.forEach((v) => {
+          if (v.relClsName) {
+            relClassNameTempMap[v.relClsName] = true;
+          }
+        })
+        for (let name in relClassNameTempMap) {
+          allRelClsNameList.push({
+            label: name,
+            value: name
+          })
+          checkedRelClsNameList.push(name)
+        }
+        this.allRelClsNameList = allRelClsNameList
+        this.checkedRelClsNameList = checkedRelClsNameList
+        // 改变关系类checkbox
+        // 缓存到data中，方便计算路径信息
+        this.filLinks = links
+		//  过滤掉，节点不存在的边
+        const chatLinks = links.filter((link) => {
+          return checkedKeys.includes(link.from) && checkedKeys.includes(link.to)
+        })
+        // 重画chart
+        this.drawChart(JSON.parse(JSON.stringify(entClass)), chatLinks)
+      },
+      /**
+       * 进入页面刷新实体类树
+       */
+      refreshEntityClassList(clsId) {
+        this.loadingTree = true
+        getGraphEntClsTree().then((data) => {
+          for (let i = 0; i < data.length; i++) {
+            data[i]['key'] = data[i]['entClsID']
+            data[i]['title'] = data[i]['entClsName']
+            data[i]['scopedSlots'] = {title: 'custom'}
+            if (!data[i]['pid']) {
+              this.checkedKeys.push(data[i]['entClsID'])
+            }
+          }
+          // 此处传固定的option
+          const option = {
+            idName: 'entClsID',
+            pidName: 'pid',
+            childName: 'children',
+            returnList: []
+          }
+          let treeData = this.$utils.tree.listToTree(data, option) // 数组转成树
+          if (clsId) {  // 如果路径中存在实体类id
+            for (let z = 0; z < treeData.length; z++) {
+              if (treeData[z]['entClsID'] === clsId) {
+                this.checkedKeys = getIdsList(treeData[z])
+              }
+            }
+          }
+          this.gData = treeData
+          generateList(treeData)  // 生成个列表
+          const vm = this
+          // 遍历树找到父节点下面的所有子节点
+          this.$utils.tree.walk(treeData, function (node, index, way) {
+            var id = clsId  // 路由中的id
+            var myWay = []  // 需要找到的展开节点key
+            if (node.key === id) {
+              for (let i = 0; i < way.length; i++) {
+                myWay.push(way[i]['key'])
+              }
+              vm.expandedKeys = myWay
+              return false
+            }
+          })
+          this.loadingTree = false
+        })
+      },
+      /**
+       *改变关系类checkbox
+       */
+      onChangeRelClsCheckBox(checkedValues) {
+        let entClass, links
+        if (this.filEntClass !== undefined) {
+          entClass = this.filEntClass
+        } else {
+          entClass = this.allEntClassCache
+        }
+        links = this.filLinks.filter((v, i) => {
+          if (v.classType === 'dashed') {
+            return true
+          } else if (v.relClsID) {
+            return checkedValues.includes(v.relClsName)
+          }
+        })
+        //  过滤掉，节点不存在的边
+        const chartLinks = links.filter((link) => {
+          return !!entClass.find(ent => (ent.id === link.from || ent.id === link.to))
+        })
+        // 重绘echart
+        this.drawChart(entClass, chartLinks)
+      }
+    },
+    watch: {},
+    mounted() {
+
+    }
+  }
+</script>
+
+<style>
+    /*覆盖样式加的id*/
+    #mycheck.ant-checkbox-group {
+        max-width: none;
+    }
+
+    .ant-spin-container {
+        height: 100%;
+    }
+</style>

src/views/knowledge/statistical/statisticalMap_v1.vue

@@ -0,0 +1,714 @@
+<template>
+	<div
+		class="container flex-col"
+		style="height: 100%;background-color: #ffffff"
+	>
+		<div class="container-header">
+			<!-- 左侧开始 -->
+			<a-breadcrumb style="margin-bottom: 10px">
+				<a-breadcrumb-item>
+					<router-link to="/sta">
+						关联关系信息浏览
+					</router-link>
+				</a-breadcrumb-item>
+				<a-breadcrumb-item>关联关系信息浏览统计</a-breadcrumb-item>
+			</a-breadcrumb>
+
+			<div>
+				<fuzzy-search
+					@selected="selectedEntity"
+                    @enterSearch="enterSearch"
+					key-id="entId"
+					module-name="statisticalMap"
+					url-name="getEntityListByStr"
+					ref="fuzzySearch"
+				></fuzzy-search>
+				<!-- 左侧结束 -->
+
+				<!-- 右侧-开始 -->
+				<a-button
+					title="选择一个实体后，方可展开"
+					type="default"
+					style="float: right"
+					@click="openRightMenu"
+					:disabled="isOpenRightMenu"
+					>筛选
+				</a-button>
+
+				<!-- 右侧-显示选项 -->
+				<a-dropdown style="float: right;margin-right: 5px;">
+					<a-button
+						class="ant-dropdown-link"
+						@click="(e) => e.preventDefault()"
+					>
+						显示选项<a-icon type="down" />
+					</a-button>
+					<a-menu slot="overlay">
+						<a-menu-item>
+                            <a-switch checked-children="图谱形态-默认" un-checked-children="图谱形态-渐变" default-checked @click="colorChange"/>
+						</a-menu-item>
+						<a-menu-item>
+                            <a-switch checked-children="拓扑形态-中心点" un-checked-children="拓扑形态-追加" default-checked @click="topChange"/>
+						</a-menu-item>
+						<a-menu-item>
+							<a-switch
+								v-model="showRelKey"
+								checked-children="关系类名称"
+								un-checked-children="关系名称"
+								@change="onChange"
+							/>
+						</a-menu-item>
+						<a-menu-item>
+							<a href="javascript:;" @click="hideIcon">{{
+								isShowIcon ? '隐藏图标' : '显示图标'
+							}}</a>
+						</a-menu-item>
+						<a-menu-item>
+							<a href="javascript:;" @click="downloadJson"
+								>下载图数据</a
+							>
+						</a-menu-item>
+                        <a-menu-item>
+                            <a href="javascript:;" @click="exportDataToConsole">
+                            导出数据到控制台</a
+							>
+                        </a-menu-item>
+					</a-menu>
+				</a-dropdown>
+
+				<!-- 右侧-搜索历史 -->
+				<a-badge
+					:count="searchHistoryList.length"
+					:numberStyle="{ backgroundColor: '#52c41a' }"
+					style="float: right; margin-right: 5px;"
+				>
+					<a-dropdown placement="bottomLeft">
+						<a-button>搜索历史<a-icon type="down"/></a-button>
+						<a-menu slot="overlay" v-if="searchHistoryList.length">
+							<a-menu-item
+								v-for="menu in searchHistoryList"
+								:key="menu.entId"
+							>
+								<a @click="redrawChart(menu.entId)">{{
+									menu.entName
+								}}</a>
+							</a-menu-item>
+							<a-menu-item v-if="searchHistoryList.length > 0">
+								<a @click="clearHistory">清除搜索历史</a>
+							</a-menu-item>
+						</a-menu>
+					</a-dropdown>
+				</a-badge>
+
+				<!-- 右侧-结束 -->
+			</div>
+		</div>
+		<a-spin :spinning="spinning" style="height: 100%">
+			<chart-comp
+				ref="chart"
+				@changeRoot="redrawChart"
+				@c_click="getInfoTooltip"
+				:isShowChart="true"
+				:enable="true"
+				@reloadChart="reloadChart"
+				:showRelKey="showRelKey"
+				:nodes="nodes"
+				:links="links"
+				:isEntChart="isEntChart"
+				:contextMenu="['delete']"
+				:isShowContextMenu="true"
+				@delete="delNode"
+			></chart-comp>
+		</a-spin>
+		<entity-details-tooltip
+			class="chart_tooltip"
+			ref="entityRef"
+			:id="tooltip.entId"
+			:key="tooltip.entId"
+			v-if="tooltip.entId"
+			style="position: absolute;z-index: 1;border-radius: 3px"
+			:style="{ left: tooltip.x, top: tooltip.y }"
+		></entity-details-tooltip>
+
+		<!--v-show="tooltip.linkShow"-->
+		<link-details-tooltip
+			class="chart_tooltip"
+			:id="tooltip.relID"
+			:key="tooltip.relID"
+			v-if="tooltip.relID"
+			style="position: absolute;z-index: 1;border-radius: 3px"
+			:style="{ left: tooltip.x, top: tooltip.y }"
+		>
+		</link-details-tooltip>
+	</div>
+</template>
+
+<script>
+import entityDetailsTooltip from '@/views/knowledge/common/entityDetails'
+import linkDetailsTooltip from '@/views/knowledge/common/linkDetails'
+import chartComp from '@/views/knowledge/common/chart'
+import fuzzySearch from '@/views/knowledge/common/fuzzySearch'
+import eventBus from '@/plugins/knowledge/eventBus'
+
+import { getChart } from '@/api/graph/entity'
+
+// 获取路径参数
+function getQueryVariable(variable) {
+	let url = window.location.hash
+	let index = url.indexOf('?')
+	var query = url.substring(index + 1, url.length)
+	var vars = query.split('&')
+	for (var i = 0; i < vars.length; i++) {
+		var pair = vars[i].split('=')
+		if (pair[0] == variable) {
+			return pair[1]
+		}
+	}
+	return ''
+}
+
+let directionsList = [
+	{ label: '出度', value: 'OUT', checked: true },
+	{ label: '入度', value: 'IN', checked: true },
+]
+export default {
+	components: {
+		fuzzySearch,
+		entityDetailsTooltip,
+		linkDetailsTooltip,
+		chartComp,
+	},
+	data() {
+		return {
+			spinning: false,
+			nodes: [],
+			links: [],
+			searchHistoryList: [], // 存储历史记录
+			historyCache: [], // 存储历史ID记录的
+			entityClassList: [], // 实体类列表
+			linkClassList: [], // 关系类列表
+			isOpenRightMenu: true,
+			rootId: null, // 当前图谱的根节点
+			tooltip: { entId: false, relID: false }, // 点击的实体或关系的悬浮层
+			entityClassCache: undefined,
+			linkClassCache: undefined,
+			degreeCache: 1,
+			directionCache: undefined,
+			directionsList,
+			showRelKey: true, // 图谱显示关系类还是关系名称
+			json: null,
+			isEntChart: false,
+			isShowIcon: true,
+            delEntIdsCache: undefined,
+			delEntIds: [],
+
+            chartType: true,//图表类型，center中心、add附加
+
+            entName: '',
+            ruleList: {}
+		}
+	},
+	mounted() {
+        this.rootId = getQueryVariable('entId')
+        this.entName = decodeURI(getQueryVariable('entName'))
+        
+		if (this.entName) {
+			this.$refs.fuzzySearch.value = this.entName
+			this.isOpenRightMenu = false
+		}
+		if (this.rootId || (!this.rootId && !!this.entName)) {
+			this.spinning = true
+			this.getEntityList(
+				this.rootId,
+				this.degreeCache,
+				this.entName
+			).then((resp) => {
+				let data = resp.data
+				this.getJson(data)
+				this.$refs.chart.drawChart(
+					this.rootId,
+					data.entListVO,
+					data.relListVO
+				)
+				this.nodes = data.entListVO
+				this.links = data.relListVO
+				this.entityClassList = data.entClsListVO
+				this.linkClassList = data.relClsListVO
+				this.spinning = false
+			})
+		}
+		const vm = this
+		eventBus.eventBus.$on('graph:exportData', function() {
+			vm.$refs.chart.exportChartData()
+		})
+	},
+	destroyed() {
+		eventBus.eventBus.$off('graph:exportData')
+	},
+	methods: {
+        //以什么颜色显示zoomchart，默认橙色/颜色深浅渐变
+        colorChange(){
+            this.isEntChart=!this.isEntChart;
+            this.redrawChart(this.rootId);
+        },
+        //拓扑-中心、追加
+        topChange(){
+            this.chartType=!this.chartType
+        },
+		/**
+		 * 根据ID获取实力列表和关系列表
+		 * @params id: 实体ID _string，
+		 * @params degree： 度数（跳） _string，
+         * delEntIds: 排除
+         * direction：未知
+         * entId：根节点id
+         * entName：根节点名称
+         * relClsIDs： 未知
+         * limitNum：默认3
+         * isModel: 默认false
+         * entConditionQueries： 高级筛选
+		 * */
+		getEntityList(id,degree,name) {
+            let entConditionQueries = []
+            if(!!this.ruleList && JSON.stringify(this.ruleList)!='{}'){
+                for(let k in this.ruleList){
+                    let item={}
+                    item.entClsID = k;
+                    // item.entName = decodeURI(getQueryVariable('entName'));
+                    let arr = this.ruleList[k]
+                    let attrFilters = []
+                    arr.forEach((v,i) => {
+                        let innerItem = {
+                            attrClsId: v.attrClsId,
+                            attrValue: v.attrValue,
+                            conditionType: v.conditionType,
+                            operatorType: v.operatorType,
+                            valueType: v.valueType
+                        }
+                        attrFilters.push(innerItem)
+                    })
+                    item['attrFilters']=attrFilters
+                    entConditionQueries.push(item)
+                }
+            }
+            
+            let direction = ''
+            if(!!this.directionCache && this.directionCache.split(',').length==2){
+                direction = 'BOTH'
+            }else{
+                direction = this.directionCache;
+            }
+            
+            
+            let data = {
+                degree: this.degreeCache,
+                delEntIds: this.getDelEntIdsString(),
+                direction: direction,
+                entId: id,
+                entName: name,
+                relClsIDs: this.linkClassCache,
+                limitNum: 3,
+                isModel: false,
+                entConditionQueries: entConditionQueries
+            }
+
+			// 根据搜索记录获取实力列表，以及实体类、关系类列表
+			return getChart(data)
+		},
+        enterSearch(value){
+            history.pushState(
+				{},
+				'',
+				`#/sta?entName=${value}`
+			)
+            this.entName = value;
+            this.getEntityList(undefined,this.degreeCache,value,this.entName).then(
+				(data) => {
+					this.getJson(data)
+					this.isOpenRightMenu = false
+					this.entityClassList = data.entClsListVO
+					this.linkClassList = data.relClsListVO
+					this.nodes = data.entListVO
+					this.links = data.relListVO
+					this.rootId = undefined
+					this.$refs.chart.drawChart(
+						undefined,
+						data.entListVO,
+						data.relListVO
+					)
+					this.spinning = false
+				}
+			)
+        },
+		/**
+		 * 模糊搜索选中一个后执行的方法
+		 * @params selected，模糊搜索选中的项
+		 * */
+		selectedEntity(selected) {
+			// 更改路径不刷新页面
+			history.pushState(
+				{},
+				'',
+				`#/sta?entId=${selected.entId}&entName=${selected.entName}`
+			)
+            this.entName = selected.entName;
+			if (this.historyCache.indexOf(selected.entId) === -1) {
+				this.searchHistoryList.push(selected)
+				this.historyCache.push(selected.entId)
+			}
+			this.spinning = true
+			this.getEntityList(selected.entId, this.degreeCache,this.entName).then(
+				(data) => {
+					this.getJson(data)
+					this.isOpenRightMenu = false
+					this.entityClassList = data.entClsListVO
+					this.linkClassList = data.relClsListVO
+					this.nodes = data.entListVO
+					this.links = data.relListVO
+					this.rootId = selected.entId
+					this.$refs.chart.drawChart(
+						selected.entId,
+						data.entListVO,
+						data.relListVO
+					)
+					this.spinning = false
+				}
+			)
+		},
+		/**
+		 * 清空历史记录
+		 * */
+		clearHistory() {
+			this.searchHistoryList = []
+			this.historyCache = []
+		},
+		/**
+		 * 调用右侧菜单，传入实体类列表_entityClassList、关系类列表_relationClassList
+		 * */
+		openRightMenu() {
+			if (this.entityClassCache !== undefined) {
+				this.entityClassList.forEach((v) => {
+					if (this.entityClassCache.indexOf(v.entClsID) > -1) {
+						v.checked = true
+					} else {
+						v.checked = false
+					}
+				})
+			}
+			if (this.linkClassCache !== undefined) {
+				this.linkClassList.forEach((v) => {
+					if (this.linkClassCache.indexOf(v.relClsID) > -1) {
+						v.checked = true
+					} else {
+						v.checked = false
+					}
+				})
+			}
+			if (this.directionCache !== undefined) {
+				this.directionsList.forEach((v) => {
+					if (this.directionCache.indexOf(v.value) > -1) {
+						v.checked = true
+					} else {
+						v.checked = false
+					}
+				})
+			}
+            
+			this.$open(
+				'rightMenuDrawer',
+				{
+					entityClassList: this.entityClassList,
+					linkClassList: this.linkClassList,
+					degreeCache: this.degreeCache,
+					directionList: this.directionsList,
+                    ruleList: this.ruleList,
+                    delEntityList: this.delEntIds
+				},
+				function(response) {
+					if (response !== false) {
+						this.spinning = true
+						let _data = response.data ? response.data : {}
+						this.entityClassCache = _data.entityIds  //参数
+						this.linkClassCache = _data.linkIds  //参数
+						this.degreeCache = _data.degree      //参数
+						this.directionCache = _data.direction//方向参数
+                        this.ruleList = _data.ruleList       //高级筛选
+                        let entConditionQueries = []         //高级筛选-参数
+                        let delEntIds = _data.delEntityIds   //被删除的id-参数
+
+                        this.delEntIds = _data.delEntList
+                        //高级筛选参数拼接
+                        if(!!this.ruleList && JSON.stringify(this.ruleList)!='{}'){
+                            for(let k in this.ruleList){
+                                let item={}
+                                item.entClsID = k;
+                                // item.entName = decodeURI(getQueryVariable('entName'));
+                                let arr = this.ruleList[k]
+                                let attrFilters = []
+                                arr.forEach((v,i) => {
+                                    let innerItem = {
+                                        attrClsId: v.attrClsId,
+                                        attrValue: v.attrValue,
+                                        conditionType: v.conditionType,
+                                        operatorType: v.operatorType,
+                                        valueType: v.valueType
+                                    }
+                                    attrFilters.push(innerItem)
+                                })
+                                item['attrFilters']=attrFilters
+                                entConditionQueries.push(item)
+                            }
+                        }else{
+                            if(!this.entityClassCache){
+                                entConditionQueries=[]
+                            }else{
+                                this.entityClassCache.split(',').forEach(item => {
+                                    let innerItem = {
+                                        entClsID: item,
+                                        attrFilters: []
+                                    }
+                                    entConditionQueries.push(innerItem)
+                                })
+                            }
+                        }
+
+                        //方向参数拼接，如果为 in，out，则为both
+                        let direction = ''
+                        if(!!this.directionCache && this.directionCache.split(',').length==2){
+                            direction = 'BOTH'
+                        }else{
+                            direction = this.directionCache;
+                        }
+
+                        //高级搜索-----所有参数拼接
+                        let data = {
+                            degree: this.degreeCache,
+                            delEntIds: delEntIds,
+                            direction: direction,
+                            entId: this.rootId,
+                            entName: this.entName,
+                            relClsIDs: this.linkClassCache,
+                            limitNum: 3,
+                            isModel: false,
+                            entConditionQueries: entConditionQueries
+                        }
+                    
+                        getChart(data).then(__data => {
+                            this.getJson(__data)
+							this.tooltip.entityShow = false
+							this.tooltip.linkShow = false
+							this.entityClassList = __data.entClsListVO
+							this.linkClassList = __data.relClsListVO
+							this.nodes = __data.entListVO
+							this.links = __data.relListVO
+							this.directionsList.forEach((v) => {
+								v.checked = true
+							})
+							this.$refs.chart.reDraw(
+								this.rootId,
+								__data.entListVO,
+								__data.relListVO
+							)
+							this.spinning = false
+                        })
+					}
+				}
+			)
+		},
+		reloadChart(nodes, links) {
+			const id = getQueryVariable('entId')
+			this.$refs.chart.drawChart(id, nodes, links)
+		},
+		/**
+		 * 点击搜索历史重新绘图
+		 * @params id 选中的实力的ID
+		 * */
+		redrawChart(id) {
+			this.spinning = true
+            if(this.chartType){
+                this.getEntityList(id, this.degreeCache,this.entName).then((data) => {
+                    this.rootId = id
+                    this.tooltip.entId = false
+                    this.tooltip.relID = false
+                    this.$refs.fuzzySearch.clearSelected()
+                    this.entityClassList = data.entClsListVO
+                    this.linkClassList = data.relClsListVO
+                    this.nodes = data.entListVO
+                    this.links = data.relListVO
+                    this.$refs.chart.reDraw(id, data.entListVO, data.relListVO)        
+                    this.spinning = false
+                })
+            }else{
+                //add
+                if(id!=this.rootId){//中心点变更
+                    this.getEntityList(id, this.degreeCache,this.entName).then((data) => {
+                        let nodes = data.entListVO
+                        let links = data.relListVO
+                        let addNodes = nodes.filter(item =>{
+                            return !this.nodes.some(c => {
+                                return c.entId===item.entId
+                            })
+                        })
+                        let addLinks = links.filter(item =>{
+                            return !this.links.some(c => {
+                                return c.relID===item.relID
+                            })
+                        })
+
+                        this.nodes = [...this.nodes,...addNodes]
+                        this.links = [...this.links,...addLinks]
+
+                        this.$refs.chart.addDraw(id, addNodes, addLinks)
+                        this.spinning = false
+                    })
+                }else{
+                    //中心点不变
+                    this.$refs.chart.reDraw(id, this.nodes, this.links)      
+                    this.spinning = false  
+                }  
+            }
+		},
+		/**
+		 * 获取实体或关系的悬浮框
+		 * @params event:zoomchart返回的event，args：zoomchart返回的变量，包含了当前点击的实体或关系的数据
+		 * */
+		getInfoTooltip(event, args) {
+			const vm = this
+			this.$set(this.tooltip, 'x', event.pageX + 'px')
+			this.$set(this.tooltip, 'y', event.pageY + 'px')
+			if (args.clickNode) {
+				vm.tooltip.entId = args.clickNode.data.entId
+				vm.tooltip.relID = false
+			} else if (args.clickLink) {
+				vm.tooltip.entId = false
+				vm.tooltip.relID = args.clickLink.data.relID
+			} else {
+				vm.tooltip.entId = false
+				vm.tooltip.relID = false
+			}
+		},
+		/**
+		 * 切换图谱显示关系的名字，然后重绘图谱
+		 * */
+		onChange() {
+			this.spinning = true
+			this.getEntityList(
+				this.rootId,
+				this.degreeCache,
+                this.entName,
+				// this.entityClassCache,
+				// this.linkClassCache,
+				// this.directionCache
+			).then((__data) => {
+				this.tooltip.entityShow = false
+				this.tooltip.linkShow = false
+				this.entityClassList = __data.entClsListVO
+				this.linkClassList = __data.relClsListVO
+				this.nodes = __data.entListVO
+				this.links = __data.relListVO
+				this.directionsList.forEach((v) => {
+					v.checked = true
+				})
+				this.$refs.chart.reDraw(
+					this.rootId,
+					__data.entListVO,
+					__data.relListVO
+				)
+				this.spinning = false
+			})
+		},
+		downloadJson() {
+			if (JSON.stringify(this.json) == 'null') {
+				this.$message.error('请选择关系类/实体类名称')
+				return false
+			}
+			let datastr =
+				'data:text/json;charset=utf-8,' +
+				encodeURIComponent(JSON.stringify(this.json, null, '\t'))
+			let downloadAnchorNode = document.createElement('a')
+			downloadAnchorNode.setAttribute('href', datastr)
+			downloadAnchorNode.setAttribute('download', '可视化.json')
+			downloadAnchorNode.click()
+			downloadAnchorNode.remove()
+		},
+		getJson(data) {
+			const vm = this
+			vm.json = {}
+			vm.json['vertex'] = []
+			vm.json['edge'] = []
+			for (let i in data) {
+				if (i === 'entListVO') {
+					data[i].forEach(function(item) {
+						let data = {}
+						data['id'] = item.entId
+						data['name'] = item.entName
+						data['ent-cls-name'] = item.entClsName
+						data['ent-cls-id'] = item.entClsID
+
+						vm.json['vertex'].push(data)
+					})
+				}
+				if (i === 'relListVO') {
+					data[i].forEach(function(item) {
+						let path = {}
+						path['start-id'] = item.startEntID
+						path['end-id'] = item.endEntID
+						path['rel-cls-name'] = item.relClsName
+						path['rel-cls-id'] = item.relClsID
+
+						vm.json['edge'].push(path)
+					})
+				}
+			}
+		},
+		hideIcon() {
+			//隐藏图标
+			this.isShowIcon = !this.isShowIcon
+			this.$refs.chart.switchOPen()
+		},
+        getDelEntIdsString () {
+            var res = []  
+            this.delEntIds.forEach((v) => {
+                res.push(v.id)
+            })           
+            return res.join(',')
+        },
+		// 选中一个图谱节点后的回调,排除
+		delNode(item) {
+			if (item[0].id == this.rootId) {
+				this.$message.info('中心点不能删除')
+				return
+			}
+            if(this.delEntIds.length>0){
+                this.delEntIds.forEach((v,i) => {
+                    if(v.id!==item[0].id){
+                        this.delEntIds.push(item[0])
+                    }
+                })
+            }else{
+                this.delEntIds.push(item[0])
+            }
+			
+			this.getEntityList(
+					this.rootId,
+					this.degreeCache,
+                    this.entName
+				)
+				.then((res) => {
+					this.entityClassList = res.entClsListVO
+					this.linkClassList = res.relClsListVO
+					this.$refs.chart.reDraw(
+						this.rootId,
+						res.entListVO,
+						res.relListVO
+					)
+				})
+		},
+        exportDataToConsole() {
+			eventBus.eventBus.$emit('graph:exportData')
+		},
+	},
+}
+</script>
+
+<style></style>

src/views/temporary/class/addEntityClassModal.vue.bak

@@ -1,142 +0,0 @@
-<template>
-  <a-modal
-    title="新增属性类"
-    :visible="show"
-    :mask-closable="false"
-    @ok="handleOk"
-    @cancel="handleClose"
-  >
-
-    <a-form :form="form">
-      <a-form-item label="名称：" v-bind="formItemLayout">
-        <a-input
-          v-decorator="formRules.name"
-        />
-      </a-form-item>
-      <a-form-item v-if="type !== 'NONE'" label="单位：" v-bind="formItemLayout">
-        <a-input
-          v-decorator="formRules.unit"
-        />
-      </a-form-item>
-      <a-form-item label="数据类型" v-bind="formItemLayout">
-        <a-select v-decorator="formRules.valueType">
-          <a-select-option v-for="(value,key) in attrClsType" :key="key" :value="key">{{ value }}</a-select-option>
-        </a-select>
-      </a-form-item>
-      <a-form-item v-if="type === 'CIDX'" label="描述：" v-bind="formItemLayout">
-        <a-textarea
-          v-decorator="formRules.desc"
-        />
-      </a-form-item>
-    </a-form>
-
-  </a-modal>
-</template>
-
-<script>
-const api = require('@/api')
-const formItemLayout = {
-  labelCol: {
-    xs: { span: 24 },
-    sm: { span: 6 }
-  },
-  wrapperCol: {
-    xs: { span: 24 },
-    sm: { span: 16 }
-  }
-}
-const FormRulesDefine = {
-  name: [ // 用作标识，我们统一写成和表单提交字段一样
-    'name', // 表单提交的字段
-    {
-      rules: [{ required: true, message: '属性名称需要填写', whitespace: true }]
-    }
-  ],
-  unit: [ // 用作标识，我们统一写成和表单提交字段一样
-    'unit', // 表单提交的字段
-    {
-      rules: [{ required: false, message: '属性单位需要填写', whitespace: false }]
-    }
-  ],
-  desc: [ // 用作标识，我们统一写成和表单提交字段一样
-    'desc', // 表单提交的字段
-    {
-      rules: [{ required: false, message: '属性描述需要填写', whitespace: false }]
-    }
-  ],
-  valueType: [
-    'valueType', // 表单提交的字段
-    {
-      initialValue: 'TEXT'
-    }
-  ]
-}
-const FormRulesMap = {
-  // 基本
-  'ELEM': { name: FormRulesDefine.name, unit: FormRulesDefine.unit, valueType: FormRulesDefine.valueType },
-  // 无类型
-  'NONE': { name: FormRulesDefine.name, unit: FormRulesDefine.unit, valueType: FormRulesDefine.valueType },
-  // 能力
-  'CIDX': { name: FormRulesDefine.name, unit: FormRulesDefine.unit, desc: FormRulesDefine.desc, valueType: FormRulesDefine.valueType }
-}
-export default {
-  name: 'AddEntityClass',
-  props: ['param', 'type'],
-  data() {
-    return {
-      attrClsType: this.$const.attrClsType,
-      formItemLayout,
-      form: this.$form.createForm(this),
-      show: true
-    }
-  },
-  computed: {
-    formRules() {
-      return FormRulesMap[this.type]
-    }
-  },
-  methods: {
-    async getFormData() {
-      var result = await this.$formValidateFields('form') // form的字符串
-      // 在这里对form返回数据进行处理
-      return result
-    },
-    async handleOk(e) {
-      var result = await this.getFormData() // this是当前组件的this,  'form'此表单的名称，一定要是字符串
-      var data = {
-        attrClsName: result.name,
-        attrUnit: result.unit,
-        attrType: this.type,
-        attrClsMemo: result.desc,
-        entClsID: this.param,
-        valueType: result.valueType
-      }
-      if (data.attrUnit == null || data.attrUnit == undefined) {
-        data.attrUnit = ''
-      }
-      if (data.attrClsMemo == null || data.attrClsMemo == undefined) {
-        data.attrClsMemo = ''
-      }
-
-      data.attrClsName = data.attrClsName ? data.attrClsName.trim() : ''
-      data.attrUnit = data.attrUnit ? data.attrUnit.trim() : ''
-      data.attrClsMemo = data.attrClsMemo ? data.attrClsMemo.trim() : ''
-      // 新增属性类
-      api.attrClass.addAttrClass(data).then((result) => {
-        if (result !== false) {
-          // this.$trigger("entityClass:nodeCreated", result)
-          this.$close(result)
-        }
-      })
-    },
-
-    handleClose(e) {
-      this.$close(false)
-    }
-  }
-}
-</script>
-
-<style scoped>
-
-</style>

src/views/temporary/class/addRootEntityClassModal.vue.bak

@@ -1,172 +0,0 @@
-<!-- 添加根实体类 -->
-<template>
-  <a-modal
-    :title="'添加根节点' + TEXT.ENT_CLS"
-    :visible="show"
-    :mask-closable="false"
-    @ok="handleOk"
-    @cancel="handleClose"
-  >
-    <div style="display: flex">
-      <div style="width:130px;">
-        <div style="width:100px;height:100px;overflow:hidden;border:1px solid #ddd">
-          <img v-if="headImg" style="width:100px;height:100px;" :src="headImg" alt="头像">
-        </div>
-        <label
-          class="btn btn-orange"
-          for="uploads"
-          style="display:inline-block;width: 100px;padding: 0;text-align: center;line-height: 28px;border:1px solid #ccc;margin-top: 20px;"
-        >选择图片</label>
-        <input
-          id="uploads"
-          type="file"
-          :value="imgFile"
-          style="position:absolute; clip:rect(0 0 0 0);display: none"
-          accept="image/png, image/jpeg, image/gif, image/jpg"
-          @change="uploadImg($event, 1)"
-        >
-      </div>
-      <a-form :form="form" style="flex: 1">
-        <a-form-item label="名称">
-          <a-input v-decorator="formRules.entityClass" :placeholder="'请输入' + TEXT.ENT_CLS +'名'" />
-        </a-form-item>
-        <a-form-item label="描述">
-          <a-input v-decorator="formRules.entClsMemo" type="textarea" />
-        </a-form-item>
-        <a-form-item label="背景颜色">
-          <a-color-picker v-decorator="formRules.backGroundColor" @fromChild="getColor" />
-          <!-- <a-color-picker :color="color" v-decorator="formRules.backGroundColor" /> -->
-        </a-form-item>
-      </a-form>
-    </div>
-  </a-modal>
-</template>
-
-<script>
-import AColorPicker from '@/components/common/colorPicker'
-const api = require('@/api/index')
-const TEXT = window.USER_ROLE_LANGUAGE[window.USER_ROLE]
-const formRules = { // 所有验证规则
-  entityClass: [ // 用作标识，我们统一写成和表单提交字段一样
-    'entityClass', // 表单提交的字段
-    {
-      rules: [{ required: true, message: '此选项必填', whitespace: true }]
-    }
-  ],
-  entClsMemo: [ // 用作标识，我们统一写成和表单提交字段一样
-    'entClsMemo', // 表单提交的字段
-    {
-      rules: [{ required: false }]
-    }
-  ],
-  backGroundColor: [ // 用作标识，我们统一写成和表单提交字段一样
-    'backGroundColor', // 表单提交的字段
-    {
-      rules: [{ required: false }]
-    }
-  ]
-}
-export default {
-  name: 'AddRootEntityClassModal',
-  components: {
-    AColorPicker
-  },
-  data() {
-    return {
-      TEXT,
-      fileName: '', // 本机文件地址
-      headImg: '',
-      imgFile: '',
-      show: true,
-      form: this.$form.createForm(this),
-      formRules,
-      color: ''
-    }
-  },
-  created() {},
-  destroyed() {
-  },
-  methods: {
-    getColor(color) {
-      this.color = color
-    },
-    // 选择本地图片
-    uploadImg(e, num) {
-      var max_size = 80// 80k
-      var _this = this
-      // 上传图片
-      var file = e.target.files[0]
-      _this.fileName = file.name
-      var size = file.size
-      if (size > max_size * 1024) {
-        this.$message.warning('建议上传图标不要超过20KB')
-      }
-      if (!/\.(gif|jpg|jpeg|png|bmp|GIF|JPG|PNG|JPEG|BMP)$/.test(e.target.value)) {
-        alert('图片类型必须是.gif,jpeg,jpg,png,bmp中的一种')
-        return false
-      }
-      var reader = new FileReader()
-      reader.onload = (e) => {
-        let data
-        data = e.target.result
-        this.$open('cropperImgModal', {
-          paramImgUrl: data
-        }, function(data) {
-          this.headImg = data.data
-        })
-      }
-      // 转化为base64
-      reader.readAsDataURL(file)
-      // 转化为blob
-      // reader.readAsArrayBuffer(file)
-    },
-    async getFormData() {
-      var result = await this.$formValidateFields('form') // form的字符串
-      // 在这里对form返回数据进行处理
-      return result
-    },
-    async handleOk(e) {
-      const vm = this
-      const result = await this.getFormData() // this是当前组件的this,  'form'此表单的名称，一定要是字符串
-      const uniqueMatchList = this.$checkSpecialChar(result.entityClass)
-      if (uniqueMatchList.length > 0) {
-        this.$message.error(`实体类名称不能包含特殊字符【${uniqueMatchList.join('、')}】！`)
-        return false
-      }
-      const data = {
-        entClsMemo: result.entClsMemo ? encodeURI(result.entClsMemo.trim()) : '',
-        entClsName: result.entityClass.trim(),
-        entClsType: 'NONE',
-        entClsIcon: encodeURIComponent(this.headImg), // base64转一下，不然会把+ 替换成 空格
-        pid: '',
-        backGroundColor: vm.color
-      }
-      api.entityClass.addEntityClass(data).then((data) => {
-        // 添加成功
-        if (data !== false) {
-          vm.$message.success('添加根节点' + TEXT.ENT_CLS + '成功')
-          this.$trigger('entityClass:nodeCreated', data)
-          vm.$close({
-            msg: result
-          })
-        }
-      })
-    },
-    handleClose(e) {
-      this.$close(false)
-    }
-  }
-}
-</script>
-
-<style scoped>
-    .wid-800 {
-        width: 800px !important;
-    }
-</style>
-<style>
-   .m-colorPicker .colorBtn{
-    width: 33px !important;
-    height: 32px !important;
-     }
-</style>

src/views/temporary/class/attrEditor.vue.bak

@@ -1,661 +0,0 @@
-<!-- 实体类-基础属性 -->
-<template>
-  <div class="flex-col">
-    <a-spin :spinning="spinning">
-      <div>
-        <a-button
-          v-if="type === 'CIDX' || ENTCLS_ELEM_NEW_BTN"
-          class="openAddRelationSty"
-          @click="openModel()"
-        >新增属性类</a-button>
-        <a-button
-          v-if="
-            (type === 'ELEM' && ENTCLS_ELEM_ADD_BTN) ||
-              (type === 'MIME' && ENTCLS_MIME_ADD_BTN)
-          "
-          class="openAddRelationSty"
-          style="margin-left:10px;"
-          @click="checkAttrClass()"
-        >添加属性
-        </a-button>
-        <a-button
-          v-if="type === 'NONE'"
-          class="openAddRelationSty"
-          style="margin-left:10px;"
-          @click="handleMerage"
-        >合并</a-button>
-      </div>
-      <div ref="tableWrapper" class="flex1 flex-col">
-        <a-table
-          :pagination="false"
-          class="flex1"
-          row-key="attrClsID"
-          :columns="columns"
-          :data-source="data"
-          :row-selection="rowSelection"
-          size="small"
-          bordered
-        >
-          <!--可编辑（'attrClsName','attrUnit'）-->
-          <template
-            v-for="col in ['attrClsName', 'attrUnit', 'attrClsMemo']"
-            :slot="col"
-            slot-scope="text, record"
-          >
-            <div :key="col">
-              <a-input
-                v-if="record.editable"
-                style="margin: -5px 0"
-                :value="text"
-                @change="
-                  (e) => handleChange(e.target.value, record.attrClsID, col)
-                "
-              />
-              <template v-else>
-                <div :title="text">{{ text | ellipsis(10) }}</div>
-              </template>
-            </div>
-          </template>
-          <template slot="attrValueType" slot-scope="text">
-            <!--<a-select v-if="record.editable" style="width:100%"-->
-            <!--v-model="text"-->
-            <!--@change="e => handleChange(text, record.attrClsID, 'attrValueType')">-->
-            <!--<a-select-option :value="key" v-for="(value,key) in attrClsType" :key="key">{{value}}-->
-            <!--</a-select-option>-->
-            <!--</a-select>-->
-            <template>
-              {{ attrClsType[text] }}
-            </template>
-          </template>
-          <template slot="noneOperation" slot-scope="text, record">
-            <a-popconfirm
-              title="删除待审属性？"
-              ok-text="Yes"
-              cancel-text="No"
-              @confirm="deleteAttr(record.attrClsID)"
-              @cancel="deleteCancel"
-            >
-              <a-button size="small" class="cancel-sty"><a>删除</a></a-button>
-            </a-popconfirm>
-            <a-button
-              size="small"
-              class="cancel-sty"
-              @click="transferMerage(record.attrClsID)"
-            ><a>迁移</a>
-            </a-button>
-            <a-button
-              size="small"
-              class="cancel-sty"
-              @click="adjustAttrModal(record)"
-            ><a>调整</a></a-button>
-          </template>
-          <!--备注-->
-          <template slot="attrClsBz" slot-scope="text">
-            <a-tooltip placement="top">
-              <template slot="title">
-                <span>{{ text }}</span>
-              </template>
-              {{ text | ellipsis(5) }}
-            </a-tooltip>
-          </template>
-          <!--设置必填-->
-          <template slot="isBT" slot-scope="text, record">
-            <a-checkbox disabled :checked="record.notNull" />
-          </template>
-          <template slot="domain" slot-scope="text, record">
-            <!--{{text}}-->
-            <!--{{record}}-->
-            <div v-if="record.attrValueType === 'TEXT'">
-              {{ text | filterTest }}
-            </div>
-            <div
-              v-if="
-                record.attrValueType === 'LONG' ||
-                  record.attrValueType === 'DOUBLE'
-              "
-            >
-              <span>{{ text | filterMinValue }}</span>
-              <span>{{ text | filterMaxValue }}</span>
-            </div>
-          </template>
-
-          <!--操作按钮-->
-          <template slot="operation" slot-scope="text, record">
-            <div v-if="record.isEdit === 'T'" class="editable-row-operations">
-              <span>
-                <a-button
-                  v-if="type === 'ELEM'"
-                  size="small"
-                  @click="updates(record)"
-                ><a>批量更新</a></a-button>
-                <a-button v-if="isShowTag" size="small"><a>运行</a></a-button>
-                <a-button
-                  v-if="isShowTag"
-                  class="cancel-sty"
-                  size="small"
-                  @click="openCheckTargetModal(record.attrClsID)"
-                ><a>选择指标</a></a-button>
-                <a-button
-                  v-if="ENTCLS_ELEM_EDIT_BTN || ENTCLS_MIME_EDIT_BTN"
-                  class="cancel-sty"
-                  size="small"
-                ><a @click="editAttrClass(record)">编辑</a></a-button>
-                <a-popconfirm
-                  title="删除基本属性？"
-                  ok-text="确认"
-                  cancel-text="取消"
-                  @confirm="deleteAttr(record.attrClsID)"
-                  @cancel="deleteCancel"
-                >
-                  <a-button size="small" class="cancel-sty"><a>删除</a></a-button>
-                </a-popconfirm>
-              </span>
-            </div>
-          </template>
-        </a-table>
-      </div>
-    </a-spin>
-  </div>
-  <!--</a-col>-->
-  <!--</a-row>-->
-</template>
-
-<script>
-const api = require('@/api')
-const version = window.global.const.version
-const data = []
-// 表头定义
-const columnDefine = {
-  attrClsName: {
-    title: '名称',
-    dataIndex: 'attrClsName',
-    width: '20%',
-    align: 'center',
-    scopedSlots: { customRender: 'attrClsName' }
-  },
-  attrUnit: {
-    title: '单位',
-    dataIndex: 'attrUnit',
-    width: '10%',
-    align: 'center',
-    scopedSlots: { customRender: 'attrUnit' }
-  },
-  attrValueType: {
-    title: '数据类型',
-    dataIndex: 'attrValueType',
-    width: '10%',
-    align: 'center',
-    scopedSlots: { customRender: 'attrValueType' }
-  },
-  domain: {
-    title: '值范围',
-    dataIndex: 'domain',
-    width: '15%',
-    align: 'center',
-    scopedSlots: { customRender: 'domain' }
-  },
-  applyNum: {
-    title: '使用个数',
-    dataIndex: 'entUseCount',
-    width: '10%',
-    align: 'center',
-    scopedSlots: { customRender: 'entUseCount' }
-  },
-  isBT: {
-    title: '是否必填',
-    dataIndex: 'isBT',
-    width: '8%',
-    align: 'center',
-    scopedSlots: { customRender: 'isBT' }
-  },
-  noneOperation: {
-    // 待审下的操作
-    title: '操作',
-    dataIndex: 'operation',
-    width: '30%',
-    align: 'center',
-    scopedSlots: { customRender: 'noneOperation' }
-  },
-  operation: {
-    title: '操作',
-    dataIndex: 'operation',
-    width: '30%',
-    align: 'center',
-    scopedSlots: { customRender: 'operation' }
-  },
-  attrClsMemo: {
-    title: '描述',
-    dataIndex: 'attrClsMemo',
-    width: '10%',
-    align: 'center',
-    scopedSlots: { customRender: 'attrClsMemo' }
-  },
-  attrClsBz: {
-    title: '描述',
-    dataIndex: 'attrClsMemo',
-    width: '20%',
-    align: 'center',
-    scopedSlots: { customRender: 'attrClsBz' }
-  }
-}
-const columnMap = {
-  // 基本
-  ELEM: [
-    columnDefine.attrClsName,
-    columnDefine.attrUnit,
-    columnDefine.attrValueType,
-    columnDefine.domain,
-    columnDefine.attrClsMemo,
-    columnDefine.isBT,
-    columnDefine.operation
-  ],
-  // 无类型
-  NONE: [
-    columnDefine.attrClsName,
-    columnDefine.attrUnit,
-    columnDefine.attrValueType,
-    columnDefine.applyNum,
-    columnDefine.attrClsBz,
-    columnDefine.noneOperation
-  ],
-  // 能力
-  CIDX: [
-    columnDefine.attrClsName,
-    columnDefine.attrUnit,
-    columnDefine.attrValueType,
-    columnDefine.domain,
-    columnDefine.attrClsMemo,
-    columnDefine.isBT,
-    columnDefine.operation
-  ],
-  //  多媒体
-  MIME: [
-    columnDefine.attrClsName,
-    columnDefine.attrUnit,
-    columnDefine.domain,
-    columnDefine.attrClsMemo,
-    columnDefine.isBT,
-    columnDefine.operation
-  ]
-}
-export default {
-  name: 'AttrEditor',
-  filters: {
-    filterTest(text) {
-      if (!text) {
-        return ''
-      } else {
-        return JSON.parse(text).domainKey
-      }
-    },
-    filterMinValue(text) {
-      if (!text) {
-        return ''
-      } else {
-        return JSON.parse(text).minValue
-          ? '最小值:' + JSON.parse(text).minValue
-          : ''
-      }
-    },
-    filterMaxValue(text) {
-      if (!text) {
-        return ''
-      } else {
-        return JSON.parse(text).maxValue
-          ? '最大值:' + JSON.parse(text).maxValue
-          : ''
-      }
-    }
-  },
-  data() {
-    this.cacheData = data.map((item) => ({ ...item }))
-    return {
-      // 权限控制
-      ENTCLS_ELEM_ADD_BTN: true,
-      ENTCLS_ELEM_EDIT_BTN: true,
-      ENTCLS_MIME_ADD_BTN: true,
-      ENTCLS_MIME_EDIT_BTN: true,
-      ENTCLS_ELEM_NEW_BTN: true,
-
-      attrClsType: this.$const.attrClsType,
-      id: null,
-      type: '',
-      data: [],
-      tableHeight: {},
-      selectedRows: [], // 选中的待审属性列表
-      selectedRowKeys: [],
-      spinning: false
-    }
-  },
-  computed: {
-    rowSelection() {
-      const vm = this
-      if (this.type === 'NONE') {
-        return {
-          onChange: (selectedRowKeys, selectedRows) => {
-            vm.selectedRows = selectedRows
-            vm.selectedRowKeys = selectedRowKeys
-          },
-          getCheckboxProps: (record) => ({
-            props: {
-              disabled: record.name === 'Disabled User', // Column configuration not to be checked
-              name: record.name
-            }
-          })
-        }
-      } else {
-        return null
-      }
-    },
-    columns() {
-      return columnMap[this.type]
-    },
-    isShowTag() {
-      return this.type === 'CIDX' && version === 'bf'
-    }
-  },
-  mounted() {
-    if (this.$const.authorityControl) {
-      this.ENTCLS_ELEM_ADD_BTN = !!this.authMap['ENTCLS_ELEM_ADD_BTN']
-      this.ENTCLS_ELEM_EDIT_BTN = !!this.authMap['ENTCLS_ELEM_EDIT_BTN']
-      this.ENTCLS_MIME_ADD_BTN = !!this.authMap['ENTCLS_MIME_ADD_BTN']
-      this.ENTCLS_MIME_EDIT_BTN = !!this.authMap['ENTCLS_MIME_EDIT_BTN']
-      this.ENTCLS_ELEM_NEW_BTN = !!this.authMap['ENTCLS_ELEM_NEW_BTN']
-    }
-
-    this.tableHeight = {
-      y:
-        (this.$refs.tableWrapper ? this.$refs.tableWrapper.offsetHeight : 30) -
-        30
-    }
-    var vm = this
-    window.onresize = function() {
-      vm.tableHeight = {
-        y:
-          (vm.$refs.tableWrapper ? vm.$refs.tableWrapper.offsetHeight : 30) -
-          30
-      }
-    }
-  },
-  destoryed() {
-    window.onresize = undefined
-  },
-  created() {
-    // 获取实体类id
-    this.id = this.$route.params.classId
-    // 获取路由type
-    this.type = this.$route.meta.type
-
-    this.getAttrClass()
-  },
-  methods: {
-    // 调整属性
-    adjustAttrModal(item) {
-      this.$open(
-        'adjustAttrModal',
-        {
-          attrClsID: item.attrClsID
-        },
-        function() {
-          this.getAttrClass()
-        }
-      )
-    },
-    // 合并
-    handleMerage() {
-      if (this.selectedRows.length < 2) {
-        this.$message.error('请至少选择俩个待审属性')
-      } else {
-        this.$open(
-          'merageAttrModal',
-          {
-            selectedRows: this.selectedRows,
-            selectedRowKeys: this.selectedRowKeys
-          },
-          function() {
-            this.getAttrClass()
-          }
-        )
-      }
-    },
-    // 迁移方法
-    transferMerage(attrClsID) {
-      this.$open(
-        'transferAttrModal',
-        {
-          attrClsID: attrClsID
-        },
-        function() {
-          this.getAttrClass()
-        }
-      )
-    },
-    onSelectChange() {},
-    // 选择自定义属性类
-    checkAttrClass() {
-      this.$open(
-        'chooseAttrClassModal',
-        {
-          entClsID: this.id,
-          attrType: this.type
-        },
-        function() {
-          this.getAttrClass()
-        }
-      )
-    },
-    // 编辑实体类
-    editAttrClass(param) {
-      this.$open(
-        'addAttrClassModal',
-        {
-          title: '编辑属性类',
-          attrClassParam: param
-        },
-        function() {
-          this.getAttrClass()
-        }
-      )
-    },
-    /**
-     * 操作打开实体类的模态框
-     */
-    openModel() {
-      this.$open(
-        'addAttrClassModal',
-        {
-          title: '新增属性类',
-          entClsID: this.id,
-          type: this.type
-        },
-        function() {
-          this.getAttrClass()
-        }
-      )
-      // if (this.type === 'ELEM') {
-      //   this.$open('addAttrClassModal', {
-      //     title: '新增属性类',
-      //     entClsID: this.id
-      //   }, function () {
-      //     this.getAttrClass()
-      //   })
-      // } else {
-      //   this.$open('AddEntityClass', {
-      //     //模态框的传参
-      //     param: this.id,
-      //     type: this.type
-      //   }, function (data) {
-      //     if (data !== false) {
-      //       this.getAttrClass()
-      //     }
-      //   })
-      // }
-    },
-    /**
-     * 操作打开选择指标模态窗
-     */
-    openCheckTargetModal(attrClsID) {
-      // const selectData = []
-      // this.data.forEach((v, i) => {
-      //   if (v.attrClsID !== attrClsID) {
-      //     selectData.push(v)
-      //   }
-      // })
-      this.$open(
-        'checkTargetModal',
-        {
-          // 模态框的传参
-          entClsId: this.id, // 实体类id
-          attrClsID: attrClsID // 属性类id
-          // selectData: selectData
-        },
-        function(data) {
-          if (data !== false) {
-          }
-        }
-      )
-    },
-    deleteCancel() {
-      // const newData = [...this.data]
-      // const target = newData.filter(item => key === item.attrClsID)[0]
-      // if (target) {
-      //   Object.assign(target, this.cacheData.filter(item => key === item.attrClsID)[0])
-      //   delete target.editable
-      //   this.data = newData
-      // }
-    },
-    // 获取属性类列表通过实体类id
-    getAttrClass() {
-      // if (this.type === 'ELEM' || this.type === 'NONE' || this.type === 'CIDX') {
-      var _vm = this
-      _vm.spinning = true
-      if (this.type === 'NONE') {
-        api.entityClass.getEntClsNoneList(_vm.id).then((result) => {
-          _vm.spinning = false
-          const { attrClsVOList } = result
-          if (attrClsVOList) {
-            if (!attrClsVOList.attrUnit) {
-              attrClsVOList.attrUnit = ''
-            }
-            if (!attrClsVOList.attrClsMemo) {
-              attrClsVOList.attrClsMemo = ''
-            }
-            _vm.data = attrClsVOList
-          }
-        })
-      } else {
-        api.attrClass.getAttrClassById(_vm.id, this.type).then((result) => {
-          _vm.spinning = false
-          if (result) {
-            if (!result.attrUnit) {
-              result.attrUnit = ''
-            }
-            if (!result.attrClsMemo) {
-              result.attrClsMemo = ''
-            }
-            _vm.data = result
-          }
-        })
-      }
-      // }
-    },
-    /**
-     * 表格操作调用
-     * @param value 修改后的值
-     * @param id 修改row的id
-     * @param column 修改内容的对应col
-     */
-    handleChange(value, id, column) {
-      // 获取修改后的整个数组对象
-      const newData = [...this.data]
-      // 通过返回的id获取修改后的这一列的对象
-      var target = newData.filter((item) => id === item.attrClsID)[0]
-      // 如果修改成功，更新data的数组对象
-      if (target) {
-        target[column] = value
-        this.data = newData
-      }
-    },
-
-    // 点击编辑调用编辑函数
-    edit(key) {
-      const newData = [...this.data]
-      this.cacheData = newData.map((item) => ({ ...item }))
-      var target = newData.filter((item) => key === item.attrClsID)[0]
-      // 表格关闭编辑的显示区
-      if (target) {
-        target.editable = true
-        this.data = newData
-      }
-    },
-
-    // 调用编辑之后产生的保存响应，处理保存函数
-    save(key, id) {
-      const newData = [...this.data]
-      // 通过type来接受获取的参数
-      var data = {
-        attrClsID: key.attrClsID,
-        attrClsName: key.attrClsName,
-        attrUnit: key.attrUnit,
-        attrClsMemo: key.attrClsMemo,
-        valueType: key.attrValueType,
-        notNull: key.notNull
-      }
-      if (data.attrClsName === '') {
-        this.$message.error('名称不能为空，重新修改信息')
-      } else {
-        data.attrClsName = data.attrClsName ? data.attrClsName.trim() : ''
-        data.attrUnit = data.attrUnit ? data.attrUnit.trim() : ''
-        data.attrClsMemo = data.attrClsMemo ? data.attrClsMemo.trim() : ''
-        if (data.attrClsName == '') {
-          this.$message.error('属性名传参失败')
-        }
-
-        var target = newData.filter((item) => id === item.attrClsID)[0]
-        api.attrClass.updateAttrClass(data).then((result) => {
-          if (result !== false) {
-            this.getAttrClass()
-            if (result && target) {
-              delete target.editable
-              this.data = newData
-              this.cacheData = newData.map((item) => ({ ...item }))
-            }
-          }
-        })
-      }
-    },
-    // 删除选中的属性类
-    deleteAttr(id) {
-      api.attrClass.delAttrClass(id).then((result) => {
-        this.getAttrClass()
-      })
-    },
-
-    // 调用编辑之后产生的取消响应，处理取消函数
-    cancel(key) {
-      // 获取修改后的整个数组对象
-      const newData = [...this.data]
-      // 通过返回的id获取修改后的这一列的对象
-      var target = newData.filter((item) => key === item.attrClsID)[0]
-      if (target) {
-        // 如果有输入框存在修改内容，对修改内容销毁，关闭修改页面
-        Object.assign(
-          target,
-          this.cacheData.filter((item) => key === item.attrClsID)[0]
-        )
-        delete target.editable
-        this.data = newData
-      }
-    },
-    // 批量更新
-    updates(record) {
-      this.$open('updateAttrClsModal', {
-        record: record,
-        entClsId: this.id
-      })
-    }
-  }
-}
-</script>
-
-<style scoped></style>

src/views/temporary/class/createRelationClassModal.vue.bak

@@ -1,271 +0,0 @@
-<!-- 实体类-关系创建 -->
-<template>
-  <a-modal
-    title="新建一个关系类"
-    :visible="show"
-    :mask-closable="false"
-    @ok="handleOk"
-    @cancel="handleClose"
-  >
-    <h4 class="title">{{ entClsName }}</h4>
-    <div style="margin-bottom: 20px;">
-      <a-radio-group v-model="Originvalue" disabled @change="onChangeOrigin">
-        <a-radio :value="3">作为起点</a-radio>
-        <a-radio :value="4">作为终点</a-radio>
-      </a-radio-group>
-    </div>
-    <h4 class="title">选择或新建关系</h4>
-
-    <a-row :gutter="10">
-      <a-col :span="4">
-        <h4 class="title" style="margin-top:.6em;">背景颜色</h4>
-      </a-col>
-      <a-col :span="15">
-        <a-form :form="form">
-          <a-form-item>
-            <a-color-picker v-decorator="formRules.backGroundColor" @fromChild="getColor" />
-          </a-form-item>
-        </a-form>
-      </a-col>
-    </a-row>
-
-    <div style="margin-bottom: 20px;">
-      <a-radio-group v-model="value" @change="onChange">
-        <a-radio :value="1">复制已有关系</a-radio>
-        <a-radio :value="2">新建关系</a-radio>
-      </a-radio-group>
-    </div>
-    <div v-if="value==1" style="margin-bottom: 20px;">
-      <a-row :gutter="10">
-        <a-col :span="12">
-          <a-button @click="getRelationCls">
-            {{ selectedRelCls ? selectedRelCls : '选择一个关系类名称' }}
-          </a-button>
-        </a-col>
-        <a-col :span="12">
-          <a-select
-            show-search
-            placeholder="选择一个关系类"
-            style="width:200px;"
-            @change="handleSelectRelationClass"
-          >
-            <a-select-option
-              v-for="item in filterRelationList"
-              :key="item.relClsID"
-              :value="item.relClsID"
-            >
-              <a-popover placement="left">
-                <template slot="content">
-                  <div>起点：{{ item.startEntCls&&item.startEntCls.entClsName }}</div>
-                  <div>关系类：{{ item.relClsName }}</div>
-                  <div>终点：{{ item.endEntCls&&item.endEntCls.entClsName }}</div>
-                  <div v-for="(p,i) in attrList" :key="i">属性:{{ p.attrClsName }}</div>
-                </template>
-                <span
-                  @mouseenter="enter(item)"
-                  @mouseleave="leave()"
-                >
-                  {{ item.startEntCls&&item.startEntCls.entClsName }}->{{ item.relClsName }}->{{ item.endEntCls&&item.endEntCls.entClsName }}</span>
-              </a-popover>
-            </a-select-option>
-          </a-select>
-        </a-col>
-      </a-row>
-    </div>
-    <div v-if="value==2">
-      <a-form :form="form">
-        <a-form-item>
-          <a-input v-decorator="formRules.entityClass" placeholder="请输入关系类名" />
-        </a-form-item>
-      </a-form>
-    </div>
-    <h4 class="title">{{ Originvalue===3 ? '选择终点关系类' : '选择起点关系类' }}</h4>
-    <div style="max-height: 420px; overflow: auto;">
-      <!--<class-tree @nodeSelected="entityClassNodeSelected" :editable="false"></class-tree>-->
-      <z-tree :editable="false" @nodeSelected="entityClassNodeSelected" />
-    </div>
-  </a-modal>
-</template>
-
-<script>
-import AColorPicker from '@/components/common/colorPicker'
-import ClassTree from '../../components/manager/entityClass/entityClassTree'
-import zTree from '../../components/manager/entityClass/entityClassZtree'
-
-const api = require('@/api/index')
-const TEXT = window.USER_ROLE_LANGUAGE[window.USER_ROLE]
-const formRules = {
-  // 所有验证规则
-  entityClass: [
-    // 用作标识，我们统一写成和表单提交字段一样
-    'entityClass', // 表单提交的字段
-    {
-      rules: [{ required: true, message: '此选项必填', whitespace: true }]
-    }
-  ]
-  // relationClass: [
-  //   relationClass, // 表单提交的字段
-  //   {
-  //     rules: [{required: false, message: '此选项必填', whitespace: true}]
-  //   }
-  // ]
-}
-export default {
-  name: 'CreateRelationClassModal',
-  components: {
-    AColorPicker,
-    zTree,
-    ClassTree,
-    VNodes: {
-      functional: true,
-      render: (h, ctx) => ctx.props.vnodes
-    }
-  },
-  props: ['pramsId', 'entClsName', 'entClsType'],
-  data() {
-    return {
-      color: '',
-      show: true,
-      form: this.$form.createForm(this),
-      formRules,
-      value: 1,
-      Originvalue: 3,
-      filterRelationList: [], // 已有关系列表
-      EntityClassNode: {}, // 实体类节点信息
-      selectRelationValue: '',
-      timer: null, // 延时器
-      attrMap: {},
-      attrList: [], // 属性list
-      selectedRelCls: ''
-    }
-  },
-  created() {
-    // 判断是起点还是终点
-    if (this.entClsType === 'START') {
-      this.Originvalue = 3 // 起点
-    } else {
-      this.Originvalue = 4 // 终点
-    }
-  },
-  destroyed() {
-  },
-  methods: {
-    getColor(color) {
-      this.color = color
-    },
-    enter(item) {
-      const vm = this
-      if (vm.attrMap.hasOwnProperty(item.relClsID)) { // 判断map中是否存在
-        vm.attrList = vm.attrMap[item.relClsID]
-        clearTimeout(vm.timer)
-      } else {
-        vm.timer = setTimeout(() => {
-          api.relationAttr.getRelationAttr(item.relClsID).then(res => {
-            vm.attrMap[item.relClsID] = res // 缓存
-            vm.attrList = res
-          })
-        }, 10)
-      }
-    },
-    leave() {
-      clearTimeout(this.timer)
-    },
-    /**
-     * // 传出来的实体类节点信息
-     * @param node
-     */
-    entityClassNodeSelected(node) {
-      this.EntityClassNode = node
-    },
-    /**
-     * 选中的已有关系
-     * @param value
-     */
-    handleChange(name) {
-      api.relationClass.getAllRelationClassListByName(name).then(data => {
-        // 参数为空,获取所有的列表
-        this.filterRelationList = data.records
-      })
-    },
-    handleSelectRelationClass(id) {
-      this.selectRelationValue = id
-    },
-    getRelationCls() {
-      this.$open('getRelationClsListModal', {}, function(data) {
-        if (data) {
-          this.selectedRelCls = data
-          api.relationClass.getAllRelationClassListByName(data).then(data => {
-            // 参数为空,获取所有的列表
-            this.filterRelationList = data.records
-          })
-        }
-      })
-    },
-    onChange(e) {
-    },
-    // 选择起点或终点
-    onChangeOrigin(e) {
-    },
-    async getFormData() {
-      var result = await this.$formValidateFields('form') // form的字符串
-      // 在这里对form返回数据进行处理
-      return result
-    },
-    async handleOk(e) {
-      const result = await this.getFormData() // this是当前组件的this,  'form'此表单的名称，一定要是字符串
-      const endID = this.EntityClassNode && this.EntityClassNode.entClsID
-      const relClsID = this.selectRelationValue
-      let entClsType = 'START'
-      if (!endID) {
-        this.$message.error('请选择要建立关系的' + TEXT.ENT_CLS)
-        return
-      }
-      const data = {
-        startID: this.pramsId,
-        endID: endID,
-        backGroundColor: this.color,
-        relClsMemo: this.relClsMemo,
-        relClsName: this.relClsName
-
-      }
-      if (this.Originvalue == 4) {
-        // 传进来的实体类作为终点
-        data['startID'] = endID
-        data['endID'] = this.pramsId
-        entClsType = 'ENT'
-      }
-      if (this.value == 1) {
-        // 已有关系属性
-        data['relClsID'] = relClsID
-      }
-      if (this.value == 2) {
-        // 新建关系
-        data['relClsName'] = result.entityClass
-        const uniqueMatchList = this.$checkSpecialChar(result.entityClass)
-        if (uniqueMatchList.length > 0) {
-          this.$message.error(`关系类名称不能包含特殊字符【${uniqueMatchList.join('、')}】！`)
-          return false
-        }
-      }
-      api.relationClass.addRelationClass(data).then(data => {
-        if (data !== false) {
-          this.$trigger('relationClass:nodeCreated', data)
-          this.$close({
-            id: this.pramsId,
-            entClsType: entClsType
-          })
-        }
-      })
-    },
-    handleClose(e) {
-      this.$close(false)
-    }
-  }
-}
-</script>
-
-<style scoped>
-  .ant-row {
-    margin-bottom: 2px;
- }
-</style>

src/views/temporary/class/entClsList.vue.bak

@@ -1,52 +0,0 @@
-<!-- 实体类 左侧树 -->
-<template>
-  <a-list item-layout="horizontal" :data-source="searchResult">
-    <a-list-item slot="renderItem" slot-scope="item">
-      <a-list-item-meta @click="handleChangeEntityRouter(item)">
-        <p slot="title" :class="activeId === item.entClsID ? 'selected' : ''">
-          <a-tooltip placement="topLeft">
-            <template slot="title">
-              <span>{{ item.entClsName }}</span>
-            </template>
-            <a class="rela-box"> {{ item.entClsName }}</a>
-          </a-tooltip>
-        </p>
-      </a-list-item-meta>
-    </a-list-item>
-  </a-list>
-</template>
-
-<script>
-export default {
-  name: 'EntClsList',
-  props: ['searchResult', 'searchValue', 'activeId'],
-  data() {
-    return {
-      activeID: ''
-    }
-  },
-  watch: {
-    activeID: function() {
-      this.activeId = this.activeID
-    }
-  },
-  mounted() {
-    this.$router.push({
-      name: 'class_entity_v2',
-      params: { classId: 'uknow' },
-      query: {
-        ...this.$route.query,
-        searchValue: this.searchValue
-      }
-    })
-  },
-  methods: {
-    handleChangeEntityRouter(item) {
-      this.activeID = item.entClsID
-      this.$emit('emitId', item.entClsID)
-    }
-  }
-}
-</script>
-
-<style scoped></style>

src/views/temporary/class/entityClass.vue.bak

@@ -1,319 +0,0 @@
-<!-- 实体类 主页 -->
-<template>
-  <div class="container flex-col">
-    <a-spin :spinning="spinning">
-      <div class="container-header">
-        <a-row>
-          <a-breadcrumb class="miao-shu">
-            <a-breadcrumb-item>
-              <span>来源： <span v-if="!breadcrumbList || breadcrumbList.length === 0">/</span> </span>
-            </a-breadcrumb-item>
-            <a-breadcrumb-item
-              v-for="item in breadcrumbList"
-              :key="item.entClsID"
-            >
-              {{ item.entClsName }}
-            </a-breadcrumb-item>
-          </a-breadcrumb>
-        </a-row>
-        <a-row :gutter="10">
-          <a-col :span="2" class="shiti-img">
-            <div v-if="entityClassTreeNode.entClsIcon">
-              <img :src="entityClassTreeNode.entClsIcon" alt="">
-            </div>
-            <div v-else><img src="../../assets/kong-01.png" alt=""></div>
-            <!-- ../../../assets/kong-01.png -->
-          </a-col>
-          <a-col :span="10">
-            <h2 style="margin-top: 0em">
-              <b>{{ entityClassTreeNode.entClsName }}</b>
-            </h2>
-            <span class="miao-shu">
-              {{
-                entityClassTreeNode.entClsMemo
-                  ? entityClassTreeNode.entClsMemo
-                  : "无相关描述"
-              }}</span>
-          </a-col>
-          <a-col :span="12">
-            <a-button v-if="GOTO_NEURAL_BTN" style="margin-right: 10px" @click="gotoFlow">
-              <a-icon type="branches" />
-              编排
-            </a-button>
-            <!--          <a-button style="margin-right: 10px">-->
-            <!--            <a-icon type="play-circle" />-->
-            <!--            运行-->
-            <!--          </a-button>-->
-            <a-button
-              style="margin-right: 10px"
-              @click="goEntity"
-            >
-              <a-icon type="profile" />
-              {{ TEXT.ENT }}列表
-            </a-button>
-            <a-button
-              style="margin-right: 10px"
-              @click="handleEditEntityClassName"
-            >
-              <a-icon type="edit" />
-              基础信息更新
-            </a-button>
-            <a-button
-              v-if="version === 'base'"
-              class="mr-5"
-              @click="goSta"
-            >可视化统计
-            </a-button>
-          </a-col>
-        </a-row>
-      </div>
-      <div style="height: 52px;">
-        <a-tabs v-model="activeKey" type="card" @change="changeTab">
-          <a-tab-pane
-            v-for="item in entClsAllowAttrTypeArr"
-            :key="item"
-            :tab="panes[item].title"
-            :closable="panes[item].closable"
-          />
-        </a-tabs>
-      </div>
-      <router-view
-        :key="$route.meta.type"
-        class="flex1"
-        :ent-cls-name="entityClassTreeNode.entClsName"
-        style="overflow: auto"
-      />
-    </a-spin>
-  </div>
-</template>
-
-<script>
-const api = require('@/api/index')
-const TEXT = window.USER_ROLE_LANGUAGE[window.USER_ROLE]
-const panes = {
-  ELEM: {
-    title: '基础属性',
-    content: 'Content of Tab 1',
-    key: '1',
-    closable: false
-  },
-  MIME: {
-    title: '多媒体属性',
-    content: 'Content of Tab 1',
-    key: '2',
-    closable: false
-  },
-  CIDX: {
-    title: '能力属性',
-    content: 'Content of Tab 1',
-    key: '3',
-    closable: false
-  },
-  NONE: {
-    title: '待审属性',
-    content: 'Content of Tab 1',
-    key: '6',
-    closable: false
-  },
-  GX: {
-    title: '关系属性',
-    content: 'Content of Tab 1',
-    key: '4',
-    closable: false
-  },
-  BQ: {
-    title: '标签属性',
-    content: 'Content of Tab 1',
-    key: '5',
-    closable: false
-  }
-}
-const paneRouteMap = {
-  ELEM: { routeName: 'base' },
-  MIME: { routeName: 'media' },
-  CIDX: { routeName: 'ability' },
-  GX: { routeName: 'relation' },
-  BQ: { routeName: 'tag' },
-  NONE: { routeName: 'notype' }
-}
-const panaActiveKeyMap = {
-  base: 'ELEM',
-  media: 'MIME',
-  ability: 'CIDX',
-  relation: 'GX',
-  tag: 'BQ',
-  notype: 'NONE',
-  relation_edit: 'GX'
-}
-const sortAttr = ['ELEM', 'CIDX', 'MIME', 'NONE', 'GX', 'BQ']
-export default {
-  name: 'EntityClass',
-  data() {
-    return {
-      TEXT,
-      //  权限控制
-      GOTO_NEURAL_BTN: true,
-      // 版本控制
-      version: window.global.const.version,
-
-      panes,
-      paneRouteMap, // 匹配tab路由
-      panaActiveKeyMap,
-      sortAttr, // 属性排序
-      newTabIndex: 0,
-      entityClassTreeNode: {
-        // 选中的实体类节点信息
-        entClsName: '',
-        entClsID: '',
-        entClsIcon: '',
-        backGroundColor: ''
-      },
-      breadcrumbList: [],
-      entClsIsRoot: '', // 实体类是否是顶层
-      mustClsAttrType: ['GX', 'BQ'],
-      entClsAllowAttrTypeArr: [], // 实体类的属性类型
-      spinning: false
-    }
-  },
-  events: {
-    // /**
-    //  * 编辑实体类树的名字
-    //  * @param node 节点信息
-    //  */
-    // ['entityClass:editEntityClassName'](node) {
-    //     this.selectNode = node
-    // }
-  },
-  computed: {
-    activeKey: {
-      get() {
-        return this.panaActiveKeyMap[this.$route.name]
-      },
-      set(val) {
-      }
-    }
-  },
-  created() {
-    this.init()
-  },
-  mounted() {
-    if (this.$const.authorityControl) {
-      this.GOTO_NEURAL_BTN = !!this.authMap['GOTO_NEURAL_BTN']
-    }
-  },
-  methods: {
-    goEntity() {
-      this.$router.push(`/mng/class/${this.entityClassTreeNode.entClsID}/entity_v2?clsName=${this.entityClassTreeNode.entClsName}`)
-    },
-    init() {
-      var classId = this.$route.params.classId
-      const _vm = this
-      _vm.entClsAllowAttrTypeArr = ['GX', 'BQ'] // 设置默认的不可编辑的tab
-      _vm.spinning = true
-      api.entityClass.getEntityClass(classId).then((data) => {
-        _vm.spinning = false
-        _vm.entityClassTreeNode.entClsName = data.entClsName
-        _vm.entityClassTreeNode.entClsID = data.entClsID
-        _vm.entityClassTreeNode.entClsMemo = data.entClsMemo
-        _vm.entityClassTreeNode.entClsIcon = data.entClsIcon
-        _vm.entityClassTreeNode.backGroundColor = data.backGroundColor
-        _vm.breadcrumbList = data.parents
-        var allowAttrType = data.entClsAllowAttrType
-          ? data.entClsAllowAttrType.split(',')
-          : []
-        _vm.entClsAllowAttrTypeArr = allowAttrType.concat(
-          _vm.entClsAllowAttrTypeArr
-        )
-
-        const sortedAttrs = []
-        sortAttr.map(attr => {
-          if (_vm.entClsAllowAttrTypeArr.indexOf(attr) > -1) {
-            sortedAttrs.push(attr)
-          }
-        })
-        // 基础属性在前
-        _vm.entClsAllowAttrTypeArr = sortedAttrs
-        _vm.entClsIsRoot = data.isRoot
-      })
-    },
-    // 编辑实体类树的名字的模态窗
-    handleEditEntityClassName() {
-      this.$open(
-        'editEntityClassTreeNameModal',
-        {
-          entClsName: this.entityClassTreeNode.entClsName,
-          entClsIcon: this.entityClassTreeNode.entClsIcon,
-          entClsID: this.entityClassTreeNode.entClsID,
-          backGroundColor: this.entityClassTreeNode.backGroundColor,
-          entClsAllowAttrTypeArr: this.entClsAllowAttrTypeArr,
-          entClsMemo:
-              this.entityClassTreeNode && this.entityClassTreeNode.entClsMemo,
-          entClsIsRoot: this.entClsIsRoot
-        },
-        function(data) {
-          if (data) {
-            this.init()
-            // 刷新左侧实体类树
-            // this.$trigger('entityClass:entityClassUpdated', data.data)
-            this.$trigger('entityClassZtree:entityClassUpdated', data.data)
-          }
-        }
-      )
-    },
-    changeTab(tab) {
-      this.$router.push({ name: this.paneRouteMap[tab].routeName })
-    },
-    goSta() {
-      window.location.href = `#/sta/entity_class_view?clsId=${this.$route.params.classId}`
-    },
-    gotoFlow() {
-      const classId = this.$route.params.classId
-      api.entityClass.getFlowId(classId).then((res) => {
-        if (res) {
-          window.open(
-            window.global.wisdomAtlasUrl + '/index.html#/edit?flowId=' + res
-          )
-        } else {
-          this.$notification['error']({
-            message: '获取flowId失败！'
-          })
-        }
-      })
-    }
-  }
-}
-</script>
-
-<style scoped>
-    .container {
-        padding: 24px;
-    }
-
-    .container button {
-        float: right;
-    }
-
-    .container b {
-        font-size: 24px;
-    }
-
-    .container-header-bj {
-        /* padding-top: 12px; */
-        line-height: 34px;
-    }
-
-    .avatar-edit {
-        width: 32px;
-        height: 32px;
-        display: inline-block;
-        margin-right: 8px;
-    }
-
-    .avatar-edit img {
-        height: 32px;
-        vertical-align: top;
-        box-shadow: 0 2px 8px #c8ebdf;
-        border: 2px solid #fff;
-        border-radius: 4px;
-    }
-</style>

src/views/temporary/class/entityClassTree.vue.bak

@@ -1,338 +0,0 @@
-<!-- /mng/class 实体类-左侧页面-->
-<template>
-  <div class="flex-col">
-    <a-button
-      v-if="editable"
-      type="primary"
-      block
-      class="entity-class-z"
-      @click="addRootEntityClassModal"
-    >
-      <a-icon type="plus" />
-      新增根{{ TEXT.ENT_CLS }}
-    </a-button>
-    <a-input-search :placeholder="'搜索' + TEXT.ENT_CLS" @change="search" />
-    <a-spin tip="Loading..." class="entity-class-tree auto-overflow flex1" :spinning="spinning">
-      <a-tree
-        ref="entClsTree"
-        :default-selected-keys="selectTreeNodeIdList"
-        :tree-data="treeData"
-        :selected-keys.sync="selectTreeNodeIdList"
-        :expanded-keys.sync="expandedKeys"
-        :auto-expand-parent="autoExpandParent"
-        @select="onSelect"
-      >
-        <template slot="custom" slot-scope="{entClsName,entClsID}">
-          <span v-if="entClsName.indexOf(searchValue) > -1">
-            {{ entClsName.substr(0, entClsName.indexOf(searchValue)) }}
-            <span style="color: #f50">{{ searchValue }}</span>
-            {{ entClsName.substr(entClsName.indexOf(searchValue) + searchValue.length) }}
-          </span>
-          <span v-else>{{ entClsName }}</span>
-          <!--{{entClsID}}-->
-          <span v-if="editable" class="handleButton">
-            <a-icon type="plus-circle" style="margin-right:5px;" @click.stop="addChildEntityClass(entClsID)" />
-            <a-icon type="minus-circle" @click.stop="deleteEntityClass(entClsID)" />
-          </span>
-        </template>
-      </a-tree>
-    </a-spin>
-    <!--<Button @click="test">test</Button>-->
-  </div>
-</template>
-
-<script>
-//  import $ from 'jquery'
-const api = require('@/api/index')
-const TEXT = window.USER_ROLE_LANGUAGE[window.USER_ROLE]
-const gData = [] // 左侧实体类树
-
-const dataList = []
-// 根据树生成一个列表
-const generateList = (data) => {
-  for (let i = 0; i < data.length; i++) {
-    const node = data[i]
-    const key = node.key
-    dataList.push({ key, title: node.entClsName, entClsName: node.entClsName })
-    if (node.children) {
-      generateList(node.children, node.key)
-    }
-  }
-}
-//  得到需要展开的父节点key
-const getParentKey = (key, tree) => {
-  let parentKey
-  for (let i = 0; i < tree.length; i++) {
-    const node = tree[i]
-    if (node.children) {
-      if (node.children.some(item => item.key === key)) {
-        parentKey = node.key
-      } else {
-        const tp = getParentKey(key, node.children)
-        if (tp) {
-          parentKey = tp
-        }
-      }
-    }
-  }
-  return parentKey
-}
-export default {
-  name: 'EntityClassTree',
-  //  editable 是否显示操作按钮  isLink: 是否能进行路由跳转
-  props: {
-    editable: {
-      type: Boolean,
-      default: true
-    },
-    isLink: {
-      type: Boolean,
-      default: true
-    },
-    id: {
-      type: String
-    },
-    activeId: {
-      type: String
-    },
-    rootId: {
-      type: String
-    }
-  },
-  data() {
-    return {
-      TEXT,
-      expandedKeys: [], // 要展开的节点
-      searchValue: '', // 搜索的实体类名字
-      autoExpandParent: true,
-      gData,
-      selectTreeNodeIdList: [],
-      spinning: false
-    }
-  },
-  events: {
-    /**
-       *更新后刷新左侧树
-       * @param msg
-       */
-    'entityClass:entityClassUpdated'(msg) {
-      this.refreshEntityClassList()
-    }
-  },
-  computed: {
-    /**
-       * 实际绑定在树上的变量,根据rootId可能有不同
-       **/
-    treeData() {
-      var returnData = []
-      if (this.rootId) {
-        // 搜索根节点
-        this.$utils.tree.walk(this.gData, (node) => {
-          if (node.entClsID === this.rootId) {
-            returnData = [node]
-            return false
-          }
-        })
-      } else {
-        returnData = this.gData
-      }
-      // 如果有搜索字符串
-      var searchStr = this.searchValue
-      if (searchStr) {
-        // 向上遍历到所有要展开的父节点
-        const expandedKeys = dataList.map((item) => {
-          if (item.title.indexOf(searchStr) > -1) {
-            return getParentKey(item.key, returnData) // 返回要展开的父节点keys
-          }
-          return null
-        }).filter((item, i, self) => item && self.indexOf(item) === i)
-        // 设定展开
-        Object.assign(this, {
-          expandedKeys,
-          autoExpandParent: true
-        })
-        // 遍历整个树
-        var showParentNodeList = []
-        this.$utils.tree.walk(returnData, (node, index, way) => {
-          if (node.entClsName.indexOf(searchStr) > -1) {
-            node.style = ''
-            //   node.style = "background:red"
-            showParentNodeList = showParentNodeList.concat(way)
-          } else {
-            // node.style = "background:blue"
-            node.style = 'display:none'
-          }
-        })
-        for (var i = 0; i < showParentNodeList.length; i++) {
-          // showParentNodeList[i].style = "background:red"
-          showParentNodeList[i].style = ''
-        }
-      } else {
-        // 没有搜索串,遍历清空display:none
-        this.$utils.tree.walk(returnData, (node) => {
-          node.style = ''
-        })
-      }
-      console.log('重新计算树的节点')
-      return returnData
-    }
-  },
-  watch: {
-    activeId() {
-      this.selectTreeNodeIdList = [this.activeId]
-    }
-  },
-  created() {
-    this.refreshEntityClassList()
-    if (this.activeId) this.selectTreeNodeIdList = [this.activeId]
-  },
-  mounted() {
-    if (this.activeId) {
-      var timId = setTimeout(() => {
-        var $li = document.getElementsByClassName('ant-tree-treenode-selected')
-        $li[0].scrollIntoView()
-        clearTimeout(timId)
-      }, 3000)
-    }
-  },
-  methods: {
-    search(e) {
-      var str = e.data
-      if (this.searchTimeoutHandler) {
-        clearTimeout(this.searchTimeoutHandler)
-      }
-      this.searchTimeoutHandler = setTimeout(() => {
-        this.searchValue = str
-        this.searchTimeoutHandler = false
-      }, 800)
-      // debugger
-    },
-    onSelect(keys, node) {
-      // this.selectTreeNodeIdList = [node.key]
-      this.expandedKeys = keys // 选中展开的key
-      // this.autoExpandParent = false  // 选中时设置不展开父节点
-      const entClsID = node.node.dataRef.entClsID
-      this.$emit('nodeSelected', node.node.dataRef) // nodeSelected 往新建关系模态窗里传值
-      // this.$emit('emitEntityClassId', node.node.dataRef.entClassID)
-    },
-    /**
-       * 进入页面刷新实体类树
-       */
-    refreshEntityClassList() {
-      this.spinning = true
-      api.entityClass.getAllEntityClass().then((data) => {
-        var rootEntClsList = []
-        for (let i = 0; i < data.length; i++) {
-          data[i]['key'] = data[i]['entClsID']
-          data[i]['title'] = data[i]['entClsName']
-          data[i]['scopedSlots'] = { title: 'custom' }
-          if (data[i].pid == null || data[i].pid === undefined) {
-            rootEntClsList.push(data[i])
-          }
-        }
-        this.$emit('getAllRootList', rootEntClsList)
-        // 此处传固定的option
-        const option = {
-          idName: 'entClsID',
-          pidName: 'pid',
-          childName: 'children'
-        }
-        const treeData = this.$utils.tree.listToTree(data, option) // 数组转成树
-        console.log('数组拼接成的树', treeData)
-        this.gData = treeData
-        generateList(treeData) // 生成个列表
-        const vm = this
-        // 遍历树找到需要展开的节点
-        this.$utils.tree.walk(treeData, function(node, index, way) {
-          var id = vm.$route && vm.$route.params.classId // 路由中的id
-          var myWay = [] // 需要找到的展开节点key
-          if (node.key === id) {
-            for (let i = 0; i < way.length; i++) {
-              myWay.push(way[i]['key'])
-            }
-            vm.expandedKeys = myWay
-            return false
-          }
-        })
-        // 跳转到展开的节点
-        // var selected = document.getElementsByClassName('ant-tree-treenode-selected')
-        // if(selected.length>0){
-        //   // 跳转
-        //   selected[0].scrollIntoView()
-        // }
-        vm.spinning = false
-      })
-    },
-    /**
-       * 注入:添加根节点实体类模态窗
-       * @param null
-       * @returns {*}
-       */
-    addRootEntityClassModal() {
-      this.$open('addRootEntityClassModal', {}, function() {
-        this.refreshEntityClassList()
-      })
-    },
-    /**
-       * 注入：删除实体类
-       */
-    deleteEntityClass(id) {
-      const vm = this
-      this.$confirm({
-        title: '你确定要删除吗?',
-        content: '删除此' + this.TEXT.ENT_CLS + '会删除下面所有的关系，请慎重！',
-        okText: '确认',
-        cancelText: '取消',
-        onOk() {
-          api.entityClass.delEntityClass(id).then((data) => {
-            if (data !== false) {
-              // 刷新实体类的树
-              vm.refreshEntityClassList()
-              vm.$message.success('删除' + this.TEXT.ENT_CLS + '成功')
-              vm.$trigger('entityClass:nodeDestroyed', id)
-            }
-          })
-        },
-        onCancel() {
-          console.log('取消删除')
-        }
-      })
-    },
-    /**
-       * 添加子实体类
-       * @param null
-       */
-    addChildEntityClass(id) {
-      if (id === undefined) id = ''
-      this.$open('addChildEntityClassModal', {
-        pid: id
-      }, function() {
-        this.refreshEntityClassList()
-      })
-    }
-  }
-}
-</script>
-
-<style>
-    .ant-tree.entity-class-tree {
-        margin: 5px -10px;
-        padding: 0 10px;
-    }
-
-    .entity-class-tree .ant-tree-title:hover .handleButton {
-        visibility: visible;
-    }
-
-    .entity-class-tree .handleButton {
-        visibility: hidden;
-        line-height: 25px;
-        position: relative;
-        left: 5px;
-    }
-
-    .entity-class-z {
-        margin-bottom: 10px;
-    }
-
-</style>

src/views/temporary/class/manager.vue.bak

@@ -1,417 +0,0 @@
-<!-- 实体类-上侧 -->
-<template>
-  <div style="height: 100%">
-    <div
-      class="panel"
-      style="padding:0;height: 50px;margin-bottom: 5px;line-height: 50px;"
-    >
-      <a-form
-        v-if="$route.path.indexOf('entity_v2') > -1"
-        style="display: inline-block;margin-right: 5px;margin-left: 10px;"
-      >
-        <a-form-item>
-          <a-input
-            v-model="searchValue"
-            :placeholder="'请输入' + TEXT.ENT + '名称'"
-            style="width: 280px;margin-right: 10px"
-          />
-          <button class="ant-btn ant-btn-primary mr-5" @click="handleSearch">
-            查询{{ TEXT.ENT }}名称
-          </button>
-          <button class="ant-btn ant-btn-primary" @click="clearSearch">
-            清空查询
-          </button>
-        </a-form-item>
-      </a-form>
-      <a-row style="display: inline-block">
-        <a-button
-          v-if="editable && OWL_IMPORT"
-          style="margin-right: 5px;margin-left: 10px;"
-          type="primary"
-          @click="entClsImport"
-        >
-          <a-icon type="upload" />{{ TEXT.ENT_CLS }}导入
-        </a-button>
-        <!-- <a-button style="margin-right: 5px" type="primary" @click="entClsExportModal" v-if="editable && OWL_EXPORT">
-          <a-icon type="export" />{{TEXT.ENT_CLS}}导出
-        </a-button> -->
-        <a-button
-          v-if="editable && ENTCLS_GRAPH_VIEW"
-          style="margin-right: 5px"
-          type="primary"
-          @click="entClsChart"
-        >
-          <a-icon type="dot-chart" />
-          {{ TEXT.ENT_CLS_VIEW }}
-        </a-button>
-        <a-button
-          v-if="!editable && BF_ENT_IMPORT"
-          style="margin-right: 5px"
-          type="primary"
-          @click="entImportModal"
-        >
-          <a-icon type="upload" />集成访问服务导入
-        </a-button>
-        <a-button
-          v-if="!editable && BF_ENT_EXPORT"
-          type="primary"
-          @click="entExportModal"
-        >
-          <a-icon type="export" />集成访问服务导出
-        </a-button>
-      </a-row>
-    </div>
-    <div
-      class="flex-row"
-      :style="{
-        height:
-          $route.path.indexOf('entity_v2') > -1 ? 'calc(100% - 60px)' : '100%',
-      }"
-    >
-      <div id="leftPanel" class="flex-col" style="overflow-y: hidden">
-        <div class="flex1 flex-col panel">
-          <b class="panel-header">
-            <a-icon type="deployment-unit" />&nbsp;{{ TEXT.ENT_CLS }}
-          </b>
-          <a-spin
-            tip="Loading..."
-            :spinning="spinning"
-            class="select-input flex1"
-          >
-            <ent-cls-list
-              v-if="
-                $route.path.indexOf('entity') > -1 && searchResult.length > 0
-              "
-              :search-result="searchResult"
-              :search-value="searchValue"
-              :active-id="$route.params.classId"
-              @emitId="getEntClsId"
-            />
-          </a-spin>
-          <z-tree
-            v-if="searchResult.length == 0 && spinning == false"
-            class="select-input flex1"
-            :editable="editable"
-            style="margin-top:10px;"
-            @nodeSelected="entityClassNodeSelected"
-            @getAllRootList="entClsRootList"
-          />
-          <!--<keep-alive include="ent-cls-ztree">-->
-          <!--<router-view class="select-input flex1" name="treeList" :editable="editable"-->
-          <!--@nodeSelected="entityClassNodeSelected" @getAllRootList="entClsRootList"-->
-          <!--:key="treeKey1"/>-->
-          <!--</keep-alive>-->
-        </div>
-        <router-view
-          v-if="$route.path.indexOf('entity_v2') === -1"
-          :key="treeKey"
-          class="flex1 panel"
-          name="entityList"
-        />
-      </div>
-      <router-view
-        id="rightPanel"
-        :key="key"
-        name="main"
-        class="flex1 panel flex-col"
-        :sea-value="searchValue"
-        :active-id="$route.params.classId"
-      />
-    </div>
-  </div>
-</template>
-
-<script>
-import ClassTree from '../../components/manager/entityClass/entityClassTree'
-import zTree from '../../components/manager/entityClass/entityClassZtree'
-import entClsList from './entityClass/entClsList'
-
-const api = require('@/api/index')
-const isTemplateVersion = window.global.const.isTemplateVersion
-const TEXT = window.USER_ROLE_LANGUAGE[window.USER_ROLE]
-let timeout
-export default {
-  name: 'Manager',
-  components: {
-    ClassTree,
-    zTree,
-    entClsList
-  },
-  beforeRouteUpdate(to, from, next) {
-    const path = to.path
-    if (path.indexOf('entity') > -1) {
-      this.editable = false
-    } else {
-      this.editable = true
-      this.searchResult.length = 0
-      this.searchValue = ''
-      this.spinning = false
-    }
-    next()
-  },
-  beforeRouteEnter(to, from, next) {
-    next((vm) => {
-      const path = vm.$route.path
-      if (path.indexOf('entity') > -1) {
-        vm.editable = false
-      } else {
-        vm.editable = true
-      }
-    })
-  },
-  data() {
-    return {
-      // 功能权限控制
-      OWL_IMPORT: true,
-      OWL_EXPORT: true,
-      ENTCLS_GRAPH_VIEW: true,
-      BF_ENT_IMPORT: true,
-      BF_ENT_EXPORT: true,
-
-      baseUrl: window.global.baseUrl(),
-      TEXT,
-      searchValue: '', // 搜索的实体名称字符串
-      searchResult: [],
-      spinning: false,
-      rootEntClsList: [], // 根节点实体类列表
-      editable: true // 判断左侧树是否显示操作按钮
-    }
-  },
-  events: {
-    /**
-     * 新建实体类成功,打开新建的实体类
-     * @param classId 实体类id
-     */
-    'entityClass:nodeCreated'(classId) {
-      this.entityClassNodeSelected({
-        entClsID: classId
-      })
-      // this.$router.push({name: 'ECM_item', params: {classId}})
-    },
-    /**
-     * 删除实体类成功,关闭打开的实体类
-     * @param classId 实体类id
-     */
-    'entityClass:nodeDestroyed'(classId) {
-      if (this.$route.params.classId === classId) {
-        this.$router.push({ name: 'ECM_home' })
-      }
-    },
-    /**
-     * 新建实体成功,打开新建的实体
-     * @param entityId 实体类id
-     */
-    'entity:nodeCreated'(entityId) {
-      this.$router.push({ name: 'e_base', params: { entityId }})
-    },
-    /**
-     * 删除实体成功,关闭打开的实体
-     * @param entityId 实体类id
-     */
-    'entity:nodeDestroyed'(entityId) {
-      if (this.$route.params.entityId === entityId) {
-        this.$router.push({ name: 'class_entity' })
-      }
-    },
-    /**
-     * 新建实体成功,打开新建的实体类
-     * @param relationId 关系类id
-     */
-    'relationClass:nodeCreated'(relationId) {
-      this.$router.push({ name: 'relation_edit', params: { relationId }})
-    },
-    /**
-     * 删除关系类成功,关闭打开的关系类
-     * @param relationId 关系类id
-     */
-    'relationClass:nodeDestroyed'(relationId) {
-      if (this.$route.params.relationId === relationId) {
-        this.$router.push({ name: 'relation' })
-      }
-    },
-    /**
-     * 清空搜索，让左侧树恢复
-     */
-    'entityClass:clearSearch'() {
-      this.searchValue = ''
-      this.searchResult = []
-      this.spinning = false
-    }
-  },
-  computed: {
-    treeKey1() {
-      var key =
-        this.$route.path + this.$route.params ? this.$route.params.classId : ''
-      return key
-    },
-    treeKey() {
-      var key =
-        this.$route.path + this.$route.params ? this.$route.params.classId : ''
-      return key
-    },
-    key() {
-      var key =
-        this.$route.path + this.$route.params
-          ? this.$route.params.classId + this.$route.params.entityId
-          : ''
-      return key
-    }
-  },
-  mounted() {
-    // 获取用户功能权限
-    if (this.$const.authorityControl) {
-      this.OWL_IMPORT = !!this.authMap['OWL_IMPORT']
-      this.OWL_EXPORT = !!this.authMap['OWL_EXPORT']
-      this.ENTCLS_GRAPH_VIEW = !!this.authMap['ENTCLS_GRAPH_VIEW']
-      this.BF_ENT_IMPORT = !!this.authMap['BF_ENT_IMPORT']
-      this.BF_ENT_EXPORT = !!this.authMap['BF_ENT_EXPORT']
-    }
-    const searchValue = this.$route.query.searchValue
-    if (typeof searchValue !== 'undefined') {
-      this.searchValue = searchValue
-      this.handleSearch()
-    }
-  },
-
-  beforeCreate() {
-    if (this.$route.name === 'manager') {
-      this.$router.push('/mng/class')
-    }
-  },
-  methods: {
-    getEntClsId(id) {
-      const vm = this
-      if (vm.$route.path.indexOf('entity_v2') > -1) {
-        vm.$router.push({
-          name: 'class_entity_v2',
-          params: { classId: id },
-          query: {
-            searchValue: vm.searchValue
-          }
-        })
-      } else {
-        vm.$router.push({
-          name: 'class_entity',
-          params: { classId: id, entClsName: vm.searchValue }
-        })
-      }
-    },
-    // 清空搜索
-    clearSearch() {
-      this.searchValue = ''
-      this.searchResult = []
-      this.$router.push({ path: '/mng/class/unknow/entity_v2' })
-    },
-    // 搜索
-    handleSearch() {
-      if (this.searchValue === '') {
-        this.$message.error('请输入要搜索的' + this.TEXT.ENT + '名称')
-        return
-      }
-      this.spinning = true
-      // this.$router.push({path: '/mng/class/unknow/entity_v2'})
-      api.entity.searchEntClsByEntName(this.searchValue).then((res) => {
-        const item = { entClsID: 'uknow', entClsName: '全部' }
-        res.unshift(item)
-        this.searchResult = res
-        this.spinning = false
-      })
-    },
-    // 要导出的根节点实体类列表
-    entClsRootList(list) {
-      this.rootEntClsList = list
-    },
-    entityClassNodeSelected(node) {
-      if (this.$route.path.indexOf('entity') === -1) {
-        // 实体类大标题下跳转
-        api.entityClass.getEntityClass(node.entClsID).then((data) => {
-          if (
-            data.entClsAllowAttrType &&
-            data.entClsAllowAttrType.includes('ELEM')
-          ) {
-            this.$router.push({
-              name: 'base',
-              params: { classId: node.entClsID }
-            }) // 有基础属性跳到基础属性
-          } else {
-            this.$router.push({
-              name: 'relation',
-              params: { classId: node.entClsID }
-            }) // 否则调到关系属性
-          }
-        })
-      } else {
-        // 实体大标题下跳转
-        if (this.$route.path.indexOf('entity_v2') > -1) {
-          if (isTemplateVersion) {
-            // 如果是带实体模板的版本
-            this.$router.push({
-              name: 'class_entity_v2',
-              params: { classId: node.entClsID },
-              query: { clsName: node.name }
-            })
-          } else {
-            this.$router.push({
-              name: 'class_entity_v2',
-              params: { classId: node.entClsID }
-            })
-          }
-        } else {
-          this.$router.push({
-            name: 'class_entity',
-            params: { classId: node.entClsID }
-          })
-        }
-      }
-    },
-    /**
-     * 导入模态框
-     */
-    entClsImport() {
-      this.$open('entClsImportModal', {}, function() {
-        // 刷新左侧树
-        this.$router.push('/mng/class')
-      })
-    },
-    entClsChart() {
-      this.$router.push('/sta/entity_class_view')
-    },
-    /**
-     * 导出模态框
-     */
-    entClsExportModal() {
-      this.$open(
-        'entClsExportModal',
-        {
-          rootEntClsList: this.rootEntClsList // 根节点实体类列表
-        },
-        function() {}
-      )
-    },
-    // 实体导入
-    entImportModal() {
-      this.$open('uploadZipServiceModal', {})
-    },
-    // 实体导出
-    entExportModal() {
-      this.$open('entClsServiceExportModal', {})
-    }
-  }
-}
-</script>
-
-<style scoped>
-.rela-box {
-  display: block;
-  width: 230px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-#leftPanel {
-  height: 100%;
-  min-width: 300px;
-  overflow: auto;
-}
-</style>

src/views/temporary/class/relationEditor.vue.bak

@@ -1,203 +0,0 @@
-<!-- 实体类-关系属性 -->
-<template>
-  <div class="flex-row">
-    <div class="flex1" style="padding-right:24px;min-width:340px; ">
-      <!--<h2>relationList</h2>-->
-      <div class="ant-tabs-nav-wrap">
-        <div class="ant-tabs-nav-scroll">
-          <div class="ant-tabs-nav ant-tabs-nav-animated">
-            <div @click="handleTabChange">
-              <div
-                role="tab"
-                accessKey="1"
-                class="ant-tabs-tab"
-                :class="{'ant-tabs-tab-active': accesskey === '1'}"
-              >
-                以此为起点
-              </div>
-              <div
-                role="tab"
-                accessKey="2"
-                class=" ant-tabs-tab"
-                :class="{'ant-tabs-tab-active':accesskey === '2'}"
-              >以此为终点
-              </div>
-            </div>
-            <div
-              id="move"
-              class="ant-tabs-ink-bar ant-tabs-ink-bar-animated"
-              style="display: block; transform: translate3d(0px, 0px, 0px); width: 88px;"
-            />
-          </div>
-        </div>
-      </div>
-      <a-button class="openAddRelationSty" @click="AddRelationClass">添加 </a-button>
-      <a-spin :spinning="spinning">
-        <a-list
-          item-layout="horizontal"
-          :data-source="relationListData"
-          class="flex1"
-          style="max-height: 515px; min-height: 300px; overflow: auto;"
-        >
-          <a-list-item slot="renderItem" slot-scope="item">
-            <a-list-item-meta style="position: relative; padding-right: 70px;" @click="handleChangeEntityRouter(item.relClsID)">
-              <p slot="title" :class="$route.params.relationId===item.relClsID ? 'selected' : '' " style="display: flex;position: relative">
-                <a-tooltip v-if="entClsType === 'START' " placement="topLeft">
-                  <template slot="title">
-                    <span>{{ item.startEntClsName }}->{{ item.relClsName }} ->{{ item.endEntCls&&item.endEntCls.entClsName }}</span>
-                  </template>
-                  <a class="rela-box">{{ item.startEntClsName }}->{{ item.relClsName }} ->{{ item.endEntCls&&item.endEntCls.entClsName }}</a>
-                </a-tooltip>
-                <a-tooltip v-else placement="topLeft">
-                  <template slot="title">
-                    <span>{{ item.endEntCls&&item.endEntCls.entClsName }}->{{ item.relClsName }} ->{{ item.startEntClsName }}</span>
-                  </template>
-                  <a class="rela-box">{{ item.endEntCls&&item.endEntCls.entClsName }}->{{ item.relClsName }} ->{{ item.startEntClsName }}</a>
-                </a-tooltip>
-                <span
-                  class="eddit-box"
-                  @click.stop="handleDelRelationClass(item.relClsID)"
-                >
-                  <a-icon type="minus-circle" /></span>
-                <span class="cancel-box" @click.stop="handleEditRelationClassName(item)">
-                  <a-icon type="edit" /></span>
-              </p>
-            </a-list-item-meta>
-          </a-list-item>
-        </a-list>
-      </a-spin>
-    </div>
-    <router-view :key="key" class="flex2" />
-  </div>
-</template>
-
-<script>
-const api = require('@/api/index')
-const relationListData = []
-var odiv
-export default {
-  name: 'RelationEditor',
-  props: ['entClsName'],
-  data() {
-    return {
-      relationListData,
-      accesskey: '1',
-      entClsType: 'START', // 默认是实体类为起点
-      spinning: false,
-      backGroundColor: ''
-    }
-  },
-  computed: {
-    key: function() {
-      return this.$route.params ? this.$route.params.relationId : ''
-    }
-  },
-  created() {
-    const id = this.$route.params.classId
-    this.refreshRelationClassList(id, this.entClsType)
-  },
-  mounted() {
-    odiv = document.getElementById('move')
-  },
-  methods: {
-    /**
-       * 删除关系类
-       * @param id
-       */
-    handleDelRelationClass(id) {
-      const vm = this
-      this.$confirm({
-        title: '你确定要删除吗?',
-        onOk() {
-          api.relationClass.deleteRelationClass(id).then((data) => {
-            if (data !== false) {
-              vm.$trigger('relationClass:nodeDestroyed', id)
-              vm.refreshRelationClassList(vm.$route.params.classId, vm.entClsType)// 刷新关系类列表
-              vm.$message.success('删除关系类删除成功')
-            }
-          })
-        },
-        onCancel() {
-          console.log('取消删除')
-        }
-      })
-    },
-    /**
-       * 新增关系类
-       * @param id
-       */
-    AddRelationClass() {
-      this.$open('createRelationClassModal', {
-        pramsId: this.$route.params.classId,
-        entClsName: this.entClsName,
-        entClsType: this.entClsType,
-        backGroundColor: this.backGroundColor
-
-      }, function(data) {
-        if (data) {
-          this.$message.success('添加关系类成功')
-          this.refreshRelationClassList(this.$route.params.classId, data.entClsType) // 刷新关系类列表
-        }
-      })
-      console.log('backGroundColor' + '1111')
-    },
-    /**
-       * 实体路由跳转
-       * @param id
-       */
-    handleChangeEntityRouter(id) {
-      this.isActive = id
-      this.$router.push({ name: 'relation_edit', params: { relationId: id }})
-    },
-    /**
-       * 刷新关系类列表
-       * @param id
-       */
-    refreshRelationClassList(id, entClsType) {
-      this.spinning = true
-      api.relationClass.getAllRelationClassList(id, entClsType).then((data) => {
-        this.spinning = false
-        this.relationListData = data
-      })
-    },
-    /**
-       * 修改关系类名称
-       */
-    handleEditRelationClassName(opt) {
-      console.log(opt)
-      this.$open('editRelationClassNameModal', {
-        params: opt
-      }, function(data) {
-        if (data) {
-          this.refreshRelationClassList(this.$route.params.classId, this.entClsType) // 刷新关系类列表
-          this.$message.success('修改关系类名称成功')
-        }
-      })
-    },
-    handleTabChange(e) {
-      switch (e.target.accessKey) {
-        case '1':
-          odiv.style.transform = `translate3d(5px, 0px, 0px)`,
-          this.accesskey = '1'
-          this.entClsType = 'START' // 以此实体类为起点
-          this.refreshRelationClassList(this.$route.params.classId, this.entClsType)
-          break
-        case '2':
-          odiv.style.transform = `translate3d(${140}px, 0px, 0px)`
-          this.accesskey = '2'
-          this.entClsType = 'ENT' // 以此实体类为终点
-          this.refreshRelationClassList(this.$route.params.classId, this.entClsType)
-          break
-      }
-    }
-  }
-}
-</script>
-
-<style scoped>
-    .eddit-box,
-    .cancel-box { position: absolute; top: 0; width: 35px; height: 35px; text-indent: 0; text-align: center; }
-    .cancel-box { right: 0; }
-    .eddit-box { right: 35px; }
-    .rela-box { display: block; width: 235px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-</style>

src/views/temporary/class/tagEditor.vue.bak

@@ -1,130 +0,0 @@
-<!-- 实体类-标签属性 -->
-<template>
-  <div style="min-height: 100px;">
-    <a-spin :spinning="spinning">
-      <template v-for="(tag, index) in tags">
-        <a-tooltip v-if="tag.length > 20" :key="tag" :title="tag">
-          <a-tag :key="tag" :closable="true" :after-close="() => handleClose(tag)">
-            {{ `${tag.slice(0, 20)}...` }}
-          </a-tag>
-        </a-tooltip>
-        <a-tag v-else :key="tag" :closable="true" :after-close="() => handleClose(tag)">
-          {{ tag }}
-        </a-tag>
-      </template>
-      <a-input
-        v-if="inputVisible"
-        ref="input"
-        type="text"
-        size="small"
-        :style="{ width: '78px' }"
-        :value="inputValue"
-        @change="handleInputChange"
-        @blur="handleInputConfirm"
-        @keyup.enter="handleInputConfirm"
-      />
-      <a-tag v-else style="background: #fff; borderStyle: dashed;" @click="showInput">
-        <a-icon type="plus" />
-        新建标签
-      </a-tag>
-    </a-spin>
-  </div>
-</template>
-
-<script>
-const api = require('@/api/index')
-export default {
-  name: 'TagEditor',
-  props: ['entId', 'isModel'],
-  data() {
-    return {
-      vertexId: null,
-      tags: [],
-      inputVisible: false,
-      inputValue: '',
-      spinning: false
-    }
-  },
-  created() {
-    if (this.$route.meta.type && this.$route.meta.type === 'entity') {
-      this.vertexId = this.$route.params.entityId
-    } else {
-      this.vertexId = this.$route.params.classId
-    }
-    // 这里是模板实体中引用当前组件，作为组件而不是一个路由地址的指向，加入的判断
-    if (typeof this.isModel !== 'undefined') {
-      this.vertexId = this.entId
-    }
-    if (this.vertexId) {
-      this.refreshTagList()
-    }
-  },
-  methods: {
-    /**
-       * 刷新tag列表
-       */
-    refreshTagList() {
-      this.spinning = true
-      api.tag.getTagList(this.vertexId, this.isModel).then((data) => {
-        this.spinning = false
-        const tags = []
-        for (var i = 0; i < data.length; i++) {
-          tags.push(data[i].tagName)
-        }
-        this.tags = tags
-      })
-    },
-    /**
-       * 删除标签
-       **/
-    handleClose(removedTag) {
-      api.tag.deleteTag(this.vertexId, removedTag, this.isModel).then((data) => {
-        if (data) {
-          const tags = this.tags.filter(tag => tag !== removedTag)
-          this.tags = tags
-        }
-      })
-    },
-    /**
-       * 点击新建标签按钮
-       * */
-    showInput() {
-      this.inputVisible = true
-      this.$nextTick(function() {
-        this.$refs.input.focus()
-      })
-    },
-    /**
-       * 输入框变化触发
-       * */
-    handleInputChange(e) {
-      this.inputValue = e.target.value
-    },
-    /**
-       * 新建提交
-       */
-    handleInputConfirm() {
-      const inputValue = this.inputValue
-      let tags = this.tags
-      if (inputValue && tags.indexOf(inputValue) === -1) {
-        api.tag.addTag(this.vertexId, inputValue, this.isModel).then((data) => {
-          if (data) {
-            tags = [...tags, inputValue]
-            Object.assign(this, {
-              tags,
-              inputVisible: false,
-              inputValue: ''
-            })
-          }
-        })
-      } else if (inputValue && tags.indexOf(inputValue) > -1) {
-        this.$message.error('不可以有重名标签')
-      }
-    }
-  }
-}
-</script>
-
-<style scoped>
-
-</style>

src/views/temporary/entity/addEntityModal.vue.bak

@@ -1,267 +0,0 @@
-<!-- 实体-新增实体 -->
-<template>
-  <a-modal
-    :title="headTitle"
-    :visible="show"
-    :mask-closable="false"
-    @ok="handleOk"
-    @cancel="handleClose"
-  >
-    <div style="display: flex">
-      <div style="width:130px;">
-        <div style="width:100px;height:100px;overflow:hidden;border:1px solid #ddd">
-          <img v-if="headImg" style="width:100px;height:100px;" :src="headImg" alt="头像">
-        </div>
-        <label
-          class="btn btn-orange"
-          for="uploads"
-          style="display:inline-block;width: 100px;padding: 0;text-align: center;line-height: 28px;border:1px solid #ccc;margin-top: 20px;"
-        >选择图片</label>
-        <input
-          id="uploads"
-          type="file"
-          :value="imgFile"
-          style="position:absolute; clip:rect(0 0 0 0);display: none"
-          accept="image/png, image/jpeg, image/gif, image/jpg"
-          @change="uploadImg($event, 1)"
-        >
-      </div>
-      <a-form :form="form" style="flex: 1">
-        <a-form-item :label="TEXT.ENT + '名称:'">
-          <a-input v-decorator="formRules.name" />
-        </a-form-item>
-        <a-form-item :label="TEXT.ENT + '描述:'">
-          <a-input v-decorator="formRules.memo" type="textarea" />
-        </a-form-item>
-      </a-form>
-    </div>
-    <div v-if="!entityId">
-      <a-table
-        :columns="columns"
-        :data-source="resultList"
-        :pagination="false"
-        size="small"
-        row-key="attrClsID"
-        bordered
-      >
-        <template slot="attrValueType" slot-scope="text">
-          {{ attrClsType[text] }}
-        </template>
-        <template slot="attrValue" slot-scope="text,record">
-          <!--{{record}}-->
-          <editable-cell
-            :record="record"
-            :text="text"
-            :editable="record.edit"
-            @change="onCellChange(record,'attrValue', $event)"
-            @close="closeCell(record)"
-          />
-          <!--<a-input placeholder="请输入属性值" v-model="record.attrValue" style="width: 120px;"/>-->
-        </template>
-      </a-table>
-    </div>
-  </a-modal>
-</template>
-
-<script>
-import EditableCell from '../../views/common/editableCell'
-
-const api = require('@/api')
-const TEXT = window.USER_ROLE_LANGUAGE[window.USER_ROLE]
-const formItemLayout = {
-  labelCol: {
-    xs: { span: 24 },
-    sm: { span: 6 }
-  },
-  wrapperCol: {
-    xs: { span: 24 },
-    sm: { span: 16 }
-  }
-}
-const columns = [
-  {
-    rowClassName: 'name',
-    title: '名称',
-    dataIndex: 'attrClsName',
-    align: 'center'
-  },
-  {
-    title: '数据类型',
-    dataIndex: 'attrValueType',
-    align: 'center',
-    scopedSlots: { customRender: 'attrValueType' }
-  },
-  {
-    title: '单位',
-    dataIndex: 'attrUnit',
-    align: 'center'
-  },
-  {
-    title: '属性值',
-    dataIndex: 'attrValue',
-    width: '30%',
-    scopedSlots: { customRender: 'attrValue' }
-  }
-]
-export default {
-  name: 'AddEntityModal',
-  components: {
-    EditableCell
-  },
-  // paramsId 实体类id  title：标题   entityName: 实体名字  entityId:实体id isLink:改变路由 entClsIcon: 实体图标
-  props: ['paramsId', 'title', 'entityName', 'entityId', 'entityMemo', 'isLink', 'entClsIcon', 'isModel'],
-  data() {
-    return {
-      TEXT,
-      columns,
-      attrClsType: this.$const.attrClsType,
-      resultList: [], // 必填列表
-      fileName: '', // 本机文件地址
-      headImg: '',
-      imgFile: '',
-      formItemLayout,
-      headTitle: '',
-      form: this.$form.createForm(this),
-      show: true,
-      formRules: { // 所有验证规则
-        name: [ // 用作标识，我们统一写成和表单提交字段一样
-          'name', // 表单提交的字段
-          {
-            rules: [{ required: true, message: '此选项必填', whitespace: true }],
-            initialValue: this.entityName
-          }
-        ],
-        memo: [ // 用作标识，我们统一写成和表单提交字段一样
-          'memo', // 表单提交的字段
-          {
-            rules: [{ required: false, message: '可以选择填' }],
-            initialValue: this.entityMemo
-          }
-        ]
-      }
-    }
-  },
-  created() {
-    const vm = this
-    this.headTitle = this.title
-    if (this.paramsId) { // 新增
-      api.attrClass.getAttrClassById2(this.paramsId, 'ELEM').then(function(data) {
-        const resultList = []
-        data.forEach(v => {
-          if (v.notNull) {
-            v.edit = {
-              abled: false
-            }
-            v.attrValue = ''
-            resultList.push(v)
-          }
-        })
-        vm.resultList = resultList
-      })
-    }
-  },
-  mounted() {
-    //  判断是新增还是添加
-    if (this.entityName) {
-      this.headImg = this.entClsIcon
-    }
-  },
-  methods: {
-    // 选择本地图片
-    uploadImg(e, num) {
-      var max_size = 80// 20k
-      var _this = this
-      // 上传图片
-      var file = e.target.files[0]
-      _this.fileName = file.name
-      var size = file.size
-      if (size > max_size * 1024) {
-        this.$message.warning('建议上传图标不要超过80KB')
-      }
-      if (!/\.(gif|jpg|jpeg|png|bmp|GIF|JPG|PNG|JPEG|BMP)$/.test(e.target.value)) {
-        alert('图片类型必须是.gif,jpeg,jpg,png,bmp中的一种')
-        return false
-      }
-      var reader = new FileReader()
-      reader.onload = (e) => {
-        let data
-        data = e.target.result
-        this.$open('cropperImgModal', {
-          paramImgUrl: data
-        }, function(data) {
-          this.headImg = data.data
-        })
-      }
-      // 转化为base64
-      reader.readAsDataURL(file)
-      // 转化为blob
-      // reader.readAsArrayBuffer(file)
-    },
-    async getFormData() {
-      var result = await this.$formValidateFields('form') // form的字符串
-      // 在这里对form返回数据进行处理
-      return result
-    },
-    async handleOk(e) {
-      var result = await this.getFormData() // this是当前组件的this,  'form'此表单的名称，一定要是字符串
-      const entClsID = this.paramsId // 实体类id
-      const entId = this.entityId // 实体id
-      const entName = result.name.trim() // 实体名字
-      const uniqueMatchList = this.$checkSpecialChar(entName)
-      if (uniqueMatchList.length > 0) {
-        this.$message.error(`${this.isModel ? '模板' : '实体'}名称不能包含特殊字符【${uniqueMatchList.join('、')}】！`)
-        return false
-      }
-      if (!result.memo) result.memo = ''
-      const entMemo = result.memo.trim()
-      const entIcon = (this.headImg && this.headImg != 'null') ? encodeURIComponent(this.headImg) : ''
-      const notNullAttrVOList = []
-      this.resultList.forEach(v => {
-        notNullAttrVOList.push({ attrClsID: v.attrClsID, attrValue: v.attrValue })
-      })
-      if (entClsID) {
-        // 新增实体
-        if (notNullAttrVOList.some(v => { return !v.attrValue })) {
-          this.$message.error('属性值必填')
-          return false
-        } else {
-          api.entity.addEntity(entClsID, entName, entMemo, entIcon, notNullAttrVOList, this.isModel).then((data) => {
-            if (data !== false) {
-              if (this.isLink) {
-                this.$trigger('entity:nodeCreated', data)
-              }
-              this.$close(data)
-            }
-          })
-        }
-      }
-      if (entId) {
-        // 修改实体
-        api.entity.updateEntityName(entId, entName, entMemo, entIcon, this.isModel).then((data) => {
-          if (data !== false) {
-            if (this.isLink) {
-              this.$trigger('entity:nodeUpdated', data)
-            }
-            this.$close(data)
-          }
-        })
-      }
-    },
-    // 关闭模态窗
-    handleClose(e) {
-      this.$close(false)
-    },
-    closeCell(record) {
-      record.edit.abled = false
-    },
-    onCellChange(target, data, value) {
-      target.attrValue = value.toString()
-      target.edit.abled = false
-    }
-  }
-}
-</script>
-
-<style scoped>
-
-</style>

src/views/temporary/entity/entityTemplateList.vue.bak

@@ -1,596 +0,0 @@
-<!-- 实体-实体类 -->
-<template>
-  <div class="flex1 flex-col ant-card-dis">
-    <a-spin :spinning="spinning">
-      <div class="container-header">
-        <a-row>
-          <a-breadcrumb class="miao-shu">
-            <a-breadcrumb-item>
-              <span>来源： <span v-if="!breadcrumbList || breadcrumbList.length === 0">/</span> </span>
-            </a-breadcrumb-item>
-            <a-breadcrumb-item
-              v-for="item in breadcrumbList"
-              :key="item.entClsID"
-            >
-              {{ item.entClsName }}
-            </a-breadcrumb-item>
-          </a-breadcrumb>
-        </a-row>
-        <a-row :gutter="10">
-          <a-col :span="2" class="shiti-img">
-            <div v-if="entityClassTreeNode.entClsIcon">
-              <img :src="entityClassTreeNode.entClsIcon" alt="">
-            </div>
-            <div v-else><img src="../../../assets/kong-01.png" alt=""></div>
-          </a-col>
-          <a-col :span="22">
-            <h2 style="margin-top: 0em">
-              <b>{{ entityClassTreeNode.entClsName }}</b>
-            </h2>
-            <span class="miao-shu">
-              {{
-                entityClassTreeNode.entClsMemo
-                  ? entityClassTreeNode.entClsMemo
-                  : "无相关描述"
-              }}</span>
-          </a-col>
-        </a-row>
-      </div>
-      <div class="flex1 flex-col">
-        <a-divider />
-        <div style="margin-bottom:20px">
-          <button
-            v-if="entityClassId !== 'uknow' && ADD_ENT_MODE_BTN"
-            style="margin-right: 5px;"
-            class="ant-btn ant-btn-primary"
-            @click="handleAddEntity(true)"
-          >
-            <a-icon type="plus" />
-            新增模板
-          </button>
-          <button
-            v-if="entityClassId !== 'uknow'"
-            class="ant-btn ant-btn-primary"
-            style="margin-right: 5px;"
-            @click="handleAddEntity"
-          >
-            <a-icon type="plus" />
-            新增{{ TEXT.ENT }}
-          </button>
-          <button
-            v-if="entityClassId !== 'uknow' && GOTO_ENTCLS"
-            class="ant-btn ant-btn-default"
-            @click="goEntCls"
-          >
-            <a-icon type="profile" />
-            {{ TEXT.ENT_CLS }}信息
-          </button>
-        </div>
-        <a-tabs type="card" default-active-key="entity" @change="tabChange">
-          <a-tab-pane v-if="ENT_MODE_LIST" key="model">
-            <span slot="tab"> <a-icon type="home" /> 模板 </span>
-          </a-tab-pane>
-          <a-tab-pane key="entity">
-            <span slot="tab"> <a-icon type="home" /> {{ TEXT.ENT }} </span>
-          </a-tab-pane>
-        </a-tabs>
-        <a-row>
-          <a-select v-model="searchType" style="width: 120px">
-            <a-select-option value="name">
-              名称
-            </a-select-option>
-            <a-select-option value="id">
-              大ID
-            </a-select-option>
-          </a-select>
-          <a-input
-            v-model="searchEntStr"
-            style="width: 300px;margin-left: 5px"
-            @keyup.enter="searchEntByName"
-          />
-          <a-button
-            type="primary"
-            style="margin-left: 5px"
-            @click="searchEntByName"
-          >搜索
-          </a-button>
-        </a-row>
-        <a-row :gutter="16" style="min-height: 500px;">
-          <a-col
-            v-for="(item, $index) in entList"
-            :key="item.entID"
-            class="ant-card-body-flex no-arrow ent-content-card"
-            :pagination="pagination"
-            :span="8"
-            @click.stop="goDetail(item.entID, item)"
-          >
-            <a-popover
-              :title="`图谱预览：${item.entName}`"
-              :placement="'right'"
-              :destroy-tooltip-on-hide="true"
-              :get-popup-container="getPopupContainer"
-              @visibleChange="drawChart($event, item.entID, isModel)"
-            >
-              <template
-                slot="content"
-                style="min-width: 400px; min-height: 150px"
-              >
-                <chart-comp
-                  :ref="`chart_${item.entID}`"
-                  style="background: #f1f1f1;"
-                  :min-wid="400"
-                  :min-hie="200"
-                  :is-show-context-menu="false"
-                  :is-show-chart="true"
-                  :is-road="false"
-                />
-              </template>
-              <a-card hoverable>
-                <a-card-meta>
-                  <template slot="title">
-                    <span :style="{ color: !item.entName ? '#f5222d' : '' }">
-                      {{ item.entName ? item.entName : "无名称" }}
-                    </span>
-                  </template>
-                  <!-- <template slot="description">
-                                      <span>
-                                        {{ item.entMemo }}
-                                      </span>
-                                    </template> -->
-                  <a-avatar
-                    slot="avatar"
-                    :src="item.entIcon ? item.entIcon : '../../../assets/kong-01.png'"
-                  />
-                </a-card-meta>
-                <div class="card-flex1">
-                  {{ $moment(item.lastTime).format("YYYY-MM-DD") }}
-                </div>
-                <template slot="actions" class="ant-card-actions">
-                  <div class="ent-link1">查看/编辑</div>
-                  <!-- <div class="ent-link1" @click="goSta(item.entID)">图形化</div> -->
-                  <div class="ent-link1" @click.stop="createByTemplate(item)">
-                    参照创建
-                  </div>
-                  <div
-                    v-if="!isModel"
-                    class="ent-link1"
-                    @click.stop="showQRCode(item)"
-                  >
-                    <a-popover
-                      v-if="$const.version === 'bf'"
-                      v-model="item.QRCodeCard"
-                      :title="`二维码：${item.entName}`"
-                      placement="top"
-                      :destroy-tooltip-on-hide="true"
-                      trigger="click"
-                      :get-popup-container="getPopupContainer"
-                      @visibleChange="showHideQRCode(item, $event)"
-                    >
-                      <template
-                        slot="content"
-                        style="min-width: 200px; min-height: 200px"
-                      >
-                        <div :id="'qrcode' + item.entID" />
-                      </template>
-                      二维码
-                    </a-popover>
-                  </div>
-                  <div
-                    class="ent-link2"
-                    @click.stop="handleDelEntity(item.entID)"
-                  >
-                    删除
-                  </div>
-                </template>
-              </a-card>
-            </a-popover>
-          </a-col>
-        </a-row>
-        <a-row style="margin-top: 30px;">
-          <a-col>
-            <a-pagination
-              v-model="pagination.current"
-              :total="pagination.total"
-              :page-size="pagination.pageSize"
-              @change="onChangePagination"
-            />
-          </a-col>
-        </a-row>
-      </div>
-    </a-spin>
-  </div>
-</template>
-
-<script>
-import chartComp from '@/components/common/chart'
-
-const api = require('@/api/index')
-const TEXT = window.USER_ROLE_LANGUAGE[window.USER_ROLE]
-export default {
-  name: 'EntityTemplateList',
-  components: {
-    chartComp
-  },
-  data() {
-    return {
-      // 功能权限控制
-      GOTO_ENTCLS: true,
-      ADD_ENT_MODE_BTN: true,
-      ENT_MODE_LIST: true,
-
-      TEXT,
-      QRCodeCard: false,
-      entityClassId: this.$route.params.classId === 'uknow' ? '' : this.$route.params.classId,
-      entClsName: this.$route.query.entClsName,
-      editable: true,
-      searchType: 'name',
-      searchValue: '',
-      searchEntStr: '',
-      pagination: {
-        pageSize: 9,
-        total: 100,
-        current: this.$route.query.page ? parseInt(this.$route.query.page) : 1
-      },
-      entList: [],
-      isModel: false,
-      breadcrumbList: [],
-      entityClassTreeNode: {
-        // 选中的实体类节点信息
-        entClsName: '',
-        entClsID: '',
-        entClsIcon: ''
-      },
-      spinning: false
-    }
-  },
-  created() {
-    this.init()
-  },
-  mounted() {
-    if (this.$const.authorityControl) {
-      this.GOTO_ENTCLS = !!this.authMap['GOTO_ENTCLS']
-      this.ADD_ENT_MODE_BTN = !!this.authMap['ADD_ENT_MODE_BTN']
-      this.ENT_MODE_LIST = !!this.authMap['ENT_MODE_LIST']
-    }
-
-    const classId = this.entityClassId === 'uknow' ? '' : this.entityClassId
-    this.clsName = this.$route.query.clsName || this.$route.query.searchValue
-    this.searchValue = this.$route.query.searchValue || ''
-    this.spinning = true
-    this.searchEnt(
-      this.searchValue,
-      classId,
-      this.pagination.current,
-      this.pagination.pageSize,
-      this.isModel
-    )
-  },
-  methods: {
-    //
-    getPopupContainer(trigger) {
-      return trigger.parentElement
-    },
-    showQRCode(ent) {
-      if (!ent.qrcode) {
-        ent.QRCodeCard = true
-        const qrcode = new QRCode(document.getElementById('qrcode' + ent.entID), {
-          width: 200,
-          height: 200
-        })
-        const code = `实体类名称：${ent.entClsName}||实体名称：${ent.entName}||实体ID：${ent.entID}`
-        ent.qrcode = qrcode
-        qrcode.makeCode(code)
-      }
-    },
-    showHideQRCode(ent, value) {
-      if (!value) {
-        ent.qrcode = undefined
-      }
-    },
-    drawChart(isShow, entId, isModel) {
-      if (isShow) {
-        api.entity.getRelationEnt(entId, 2, '', 'BOTH', isModel).then((res) => {
-          this.$refs[`chart_${entId}`][0].drawChart(
-            entId,
-            res.entListVO,
-            res.relListVO
-          )
-        })
-      }
-    },
-    goEntCls() {
-      this.$router.push(`/mng/class/${this.entityClassId}`)
-    },
-    init() {
-      const classId = this.$route.params.classId
-      const _vm = this
-      if (classId !== 'uknow') {
-        api.entityClass.getEntityClass(classId).then((data) => {
-          _vm.entityClassTreeNode.entClsName = data.entClsName
-          _vm.entityClassTreeNode.entClsID = data.entClsID
-          _vm.entityClassTreeNode.entClsMemo = data.entClsMemo
-          _vm.entityClassTreeNode.entClsIcon = data.entClsIcon
-          _vm.breadcrumbList = data.parents
-        })
-      }
-    },
-    goDetail(entId, ent) {
-      this.$router.push({
-        name: 'model_edit',
-        params: { classId: ent.entClsID, entityId: entId },
-        query: {
-          page: this.pagination.current,
-          clsName: ent.entClsName,
-          isModel: this.isModel,
-          searchValue: this.searchValue ? this.searchValue : undefined
-        }
-      })
-    },
-    searchEntByName() {
-      this.$trigger('entityClass:clearSearch')
-      this.pagination.current = 1
-      this.spinning = true
-      this.searchEnt(
-        this.searchEntStr,
-        this.entityClassId,
-        this.pagination.current,
-        this.pagination.pageSize,
-        this.isModel,
-        this.searchType
-      )
-    },
-    // 搜索实体
-    searchEnt(searchStr, entClsIDs, current, pageSize, isModel, searchType) {
-      api.search
-        .entSearch(searchStr, entClsIDs, current, pageSize, isModel, true, searchType)
-        .then((data) => {
-          this.entList = data.entList
-          this.pagination.total = data.count
-          this.spinning = false
-        })
-    },
-    handleRemoveClick(e) {
-      this.$open(
-        'entityDeleteMulModal',
-        {
-          paramsId: this.entityClassId, // 实体类id
-          pagelist: this.entList
-        },
-        function(data) {
-          if (data) {
-            const classId =
-                this.entityClassId === 'uknow' ? '' : this.entityClassId
-            this.spinning = true
-            this.searchEnt(
-              this.searchEnt,
-              classId,
-              this.pagination.current,
-              this.pagination.pageSize,
-              this.isModel
-            )
-            this.$message.success('删除成功')
-          }
-        }
-      )
-    },
-    /**
-       * 删除实体
-       * @param id
-       */
-    handleDelEntity(id) {
-      const vm = this
-      this.$confirm({
-        title: '你确定要删除吗?',
-        onOk() {
-          api.entity.delEntityById(id, vm.isModel).then((res) => {
-            const classId =
-                vm.entityClassId === 'uknow' ? '' : vm.entityClassId
-            vm.spinning = true
-            vm.searchEnt(
-              vm.entClsName,
-              classId,
-              vm.pagination.current,
-              vm.pagination.pageSize,
-              vm.isModel
-            )
-            vm.$trigger('entity:nodeDestroyed', id)
-            vm.$message.success(TEXT.ENT + '删除成功')
-          })
-        },
-        onCancel() {
-          console.log('取消删除')
-        }
-      })
-    },
-    /**
-       * 添加实体
-       */
-    handleAddEntity(bool) {
-      this.$open(
-        'addEntityModal',
-        {
-          title: bool === true ? '新增模板' : '新增' + TEXT.ENT,
-          paramsId: this.entityClassId, // 实体类id
-          isModel: bool === true,
-          className: this.clsName
-        },
-        function(data) {
-          if (data) {
-            this.isModel = bool === true
-            this.goDetail(data, {
-              entClsName: this.clsName,
-              entClsID: this.entityClassId
-            })
-          }
-        }
-      )
-    },
-    // 参照创建按钮
-    handleAddModelEntity() {
-      this.$open(
-        'addTemplateEntityModal',
-        {
-          title: this.isModel ? '新增模板' : '新增' + TEXT.ENT,
-          paramsId: this.entityClassId, // 实体类id
-          isModel: this.isModel,
-          className: this.clsName
-        },
-        function(data) {
-          if (data) {
-            this.goDetail(data, {
-              entClsName: this.clsName,
-              entClsID: this.entityClassId
-            })
-          }
-        }
-      )
-    },
-    onChangePagination(current) {
-      const searchValue = this.searchValue || this.searchEntStr
-      this.spinning = true
-      this.searchEnt(
-        searchValue,
-        this.entityClassId,
-        current,
-        this.pagination.pageSize,
-        this.isModel
-      )
-    },
-    // tab标签切换的回调
-    tabChange(key) {
-      this.isModel = key === 'model'
-      const classId = this.entityClassId === 'uknow' ? '' : this.entityClassId
-      this.spinning = true
-      this.searchEnt(
-        this.entClsName,
-        classId,
-        this.pagination.current,
-        this.pagination.pageSize,
-        this.isModel
-      )
-    },
-    // 模板参照创建
-    createByTemplate(item) {
-      this.$open(
-        'addTemplateEntityModal',
-        {
-          title: '创建模板',
-          paramsId: this.entityClassId, // 实体类id
-          isModel: this.isModel,
-          entityId: item.entID,
-          entityName: item.entName,
-          className: this.clsName,
-          startIsModel: false
-        },
-        function(data) {
-          if (data) {
-            this.spinning = true
-            this.searchEnt(
-              '',
-              this.entityClassId,
-              this.pagination.current,
-              this.pagination.pageSize,
-              this.isModel
-            )
-          }
-        }
-      )
-    }
-  }
-}
-</script>
-<style lang="less">
-    .ant-card-body-flex .ant-card-bordered .ant-card-body {
-        display: flex !important;
-        box-shadow: none;
-    }
-
-    .ant-card-dis .ant-card-meta-detail {
-        width: 190px;
-    }
-
-    .ant-card-body-flex .ant-card-meta-title,
-    .ant-card-meta-description {
-        overflow: hidden;
-        text-overflow: ellipsis;
-        white-space: nowrap;
-    }
-</style>
-
-<style scoped>
-    .ant-avatar {
-        border-radius: 4px;
-    }
-
-    .panel-header {
-        display: block;
-    }
-
-    .ant-card {
-        margin-top: 20px;
-        border: 1px solid #ddd;
-        border-radius: 6px;
-        cursor: pointer;
-    }
-
-    .ant-card:hover {
-        border: 1px solid #0aa679;
-    }
-
-    .ant-card:hover .ant-card-body {
-        color: #0aa679;
-    }
-
-    .ant-btn-add {
-        position: absolute;
-        right: 0;
-        top: 50%;
-        margin-top: -21px;
-        height: 32px;
-    }
-
-    .ent-link1,
-    .ent-link2 {
-        width: 100%;
-        text-align: center;
-    }
-
-    .ent-link1 {
-        color: #0aa679;
-    }
-
-    .ent-link2 {
-        color: #999;
-    }
-
-    .ent-link1:hover {
-        color: #27b386;
-    }
-
-    .ent-link2:hover {
-        color: #0aa679;
-    }
-
-    .ant-card-body {
-        background: #eee;
-    }
-
-    .ant-card-actions > li > span {
-        display: block;
-        width: 100%;
-        height: 100%;
-    }
-
-    .ant-avatar {
-        width: 40px;
-        height: 40px;
-        background: url(../../../assets/kong-01.png) no-repeat;
-        background-size: 40px 40px;
-    }
-
-    .card-flex1 {
-        flex: 1;
-        text-align: right;
-    }
-
-</style>