From 1a5b2a6443dc24e3e024e2c0bb500d80a2b20d11 Mon Sep 17 00:00:00 2001 From: 杨磊 <505174330@qq.com> Date: 星期四, 06 六月 2024 15:36:37 +0800 Subject: [PATCH] Merge branch 'master' of http://182.92.203.7:2001/r/TCM_CharacterLibrary --- src/pages/character/detail.vue | 331 +++++++++++++++++++++++++++++++------------------------ 1 files changed, 186 insertions(+), 145 deletions(-) diff --git a/src/pages/character/detail.vue b/src/pages/character/detail.vue index 10fcf40..619d38b 100644 --- a/src/pages/character/detail.vue +++ b/src/pages/character/detail.vue @@ -290,11 +290,16 @@ <span>鐩稿叧闄勮〃/鍥惧儚</span> </div> <view> - <div class="flex"> + <div style="overflow: auto"> <el-image v-for="item in imageList" :key="item" - style="width: 2.05rem; height: 2.4rem" + style=" + width: 2.05rem; + height: 2.4rem; + margin-right: 0.2rem; + margin-bottom: 0.1rem; + " :src="item" fit="fill" ></el-image> @@ -318,7 +323,7 @@ > <span>鐜颁唬鐮旂┒</span> </div> - <ul class="font-family" style="font-size: 0.13rem; line-height: 2"> + <ul class="fileul" style="font-size: 0.13rem; line-height: 2"> <li style="cursor: pointer" v-for="(item, index) in personResearchList" @@ -401,6 +406,7 @@ import { getFuzzySearch, getPersonInfo, + getRelationTypeTreeList, getWebBasic, getIntroduction, getSource, @@ -408,7 +414,7 @@ getPersonBiog, getPersonWritings, getPersonRelationAtSchool, - getSpaceTime + getSpaceTime, } from "@/api/index.js"; import { getImg, getFile } from "@/static/tool.js"; import L from "leaflet"; @@ -416,7 +422,7 @@ export default { components: { - Table1 + Table1, }, data() { return { @@ -437,60 +443,60 @@ tableColumns1: [ { prop: "a", - label: "姝d功鍚�" + label: "姝d功鍚�", }, { prop: "e", - label: "浣滆��" + label: "浣滆��", }, { prop: "b", - label: "钁椾綔骞�" + label: "钁椾綔骞�", }, { prop: "c", - label: "钁椾綔鏂瑰紡" + label: "钁椾綔鏂瑰紡", }, { prop: "d", - label: "鎬荤洰鍒嗙被" - } + label: "鎬荤洰鍒嗙被", + }, ], tableColumns2: [ { prop: "a", - label: "鍏崇郴浜�" + label: "鍏崇郴浜�", }, { prop: "b", - label: "鍏崇郴绫诲瀷" + label: "鍏崇郴绫诲瀷", }, { prop: "c", - label: "鑰冩嵁" + label: "鑰冩嵁", }, { prop: "d", - label: "鍑哄" - } + label: "鍑哄", + }, ], tableColumns3: [ { prop: "a", - label: "娲诲姩鏃堕棿鍖洪棿" + label: "娲诲姩鏃堕棿鍖洪棿", }, { prop: "b", - label: "娲诲姩鍚嶇О" + label: "娲诲姩鍚嶇О", }, { prop: "c", - label: "娲诲姩鍦扮偣" + label: "娲诲姩鍦扮偣", }, { prop: "d", - label: "娲诲姩鎻忚堪" - } + label: "娲诲姩鎻忚堪", + }, ], tableData1: [], tableData2: [], @@ -500,7 +506,7 @@ nodes: [], relationships: [], personResearchList: [], - markerList: [] + markerList: [], }; }, onLoad(options) { @@ -535,7 +541,7 @@ }, methods: { copyText() { - const textToCopy = this.biogData[0].content + " 鏉ユ簮锛氫腑鍖诲尰瀛︿汉鐗╃煡璇嗗簱"; + const textToCopy = this.biogData[0].content + "\n鏉ユ簮锛氫腑鍖诲尰瀛︿汉鐗╃煡璇嗗簱"; const textarea = document.createElement("textarea"); textarea.value = textToCopy; document.body.appendChild(textarea); @@ -544,7 +550,7 @@ document.body.removeChild(textarea); this.$message({ message: "澶嶅埗鎴愬姛锛�", - type: "success" + type: "success", }); }, toLink(item) { @@ -560,7 +566,7 @@ // 鍩烘湰淇℃伅 getPersonInfo({ id: this.detailId, - type: "PERSON_BASIC" + type: "PERSON_BASIC", }).then((res) => { const obj = {}; if ( @@ -583,13 +589,13 @@ //鐜颁唬鐮旂┒ getPersonInfo({ id: this.detailId, - type: "PERSON_RESEARCH" + type: "PERSON_RESEARCH", }).then((res) => { this.personResearchList = res.object.personResearchList; }); getWebBasic({ - personId: this.detailId + personId: this.detailId, }).then((res) => { const obj = res.object; if (obj.school) { @@ -604,7 +610,7 @@ // 娲诲姩骞磋氨 getPersonInfo({ id: this.detailId, - type: "PERSON_SPACE_TIME" + type: "PERSON_SPACE_TIME", }).then((res) => { if (res.object.personSpaceTimeList) { this.tableData5 = res.object.personSpaceTimeList.map((item) => { @@ -612,7 +618,7 @@ a: item.time, b: item.activityName, c: item.activityAddrOld, - d: item.desc // 杩欓噷缂哄皯娲诲姩鎻忚堪瀛楁 + d: item.desc, // 杩欓噷缂哄皯娲诲姩鎻忚堪瀛楁 }; }); } @@ -624,39 +630,39 @@ list: [ { name: "鍒悕", - value: obj.alias || "-" + value: obj.alias || "-", }, { name: "瀛�", - value: obj.zi || "-" + value: obj.zi || "-", }, { name: "鍙�", - value: obj.hao || "-" + value: obj.hao || "-", }, { name: "鎵�澶勬椂鏈�", - value: obj.dynastyDesc || "-" + value: obj.dynastyDesc || "-", }, { name: "姘戞棌", - value: obj.ethnic || "-" - } - ] + value: obj.ethnic || "-", + }, + ], }, { list: [ { name: "绫嶈疮", - value: obj.native || "-" + value: obj.native || "-", }, { name: "鎬у埆", - value: obj.gender || "-" + value: obj.gender || "-", }, { name: "鑱屽畼", - value: obj.official || "-" + value: obj.official || "-", }, { name: "娴佹淳", @@ -666,45 +672,49 @@ sres.object.school_NAME && sres.object.school_NAME.length ? sres.object.school_NAME[0].content - : "-" + : "-", }, { name: "瀛︽湳鐗圭偣", - value: obj.features || "-" - } - ] - } + value: obj.features || "-", + }, + ], + }, ]; }, getSourceData() { getSource({ - personId: this.detailId + personId: this.detailId, }).then((res) => { this.sourceDataList = res.list; }); }, getImages() { getPersonImages({ - personId: this.detailId + personId: this.detailId, }).then((res) => { this.imageList = res.list.map((item) => getImg(item.filePath)); }); }, getBiog() { getPersonBiog({ - personId: this.detailId + personId: this.detailId, }).then((res) => { this.biogData = res.list.map((item) => { return { content: item.content1, - bookName: "銆�" + item.bookName + "銆� " + "P " + item.pageNo // 杩欓噷鍙湁bookid鏃犳硶鍖归厤鍒颁功鍚� + bookName: + "銆�" + + item.bookName + + "銆� " + + (item.pageNo ? "P " + item.pageNo : ""), // 杩欓噷鍙湁bookid鏃犳硶鍖归厤鍒颁功鍚� }; }); }); }, getWritings() { getPersonWritings({ - personId: this.detailId + personId: this.detailId, }).then((res) => { this.tableData1 = res.list.map((item) => { return { @@ -712,12 +722,16 @@ b: item.dynasty, c: item.writeWay, d: item.classify, - e: this.detailInfo.NAME + e: this.detailInfo.NAME, }; }); }); }, getRelationship() { + getRelationTypeTreeList().then((res) => { + console.log(res, "getRelationTypeTreeList"); + console.log(res); + }); // getPersonRelationAtSchool({ // personId: this.detailId, // }).then((res) => { @@ -731,16 +745,23 @@ // }); // } // }); + getPersonInfo({ + id: this.detailId, + type: "PERSON_RELATIONS", + }).then((res) => { + this.tableData4; + console.log(res, "PERSON_RELATIONS"); + }); // 绀句細鍏崇郴 getPersonRelationAtSchool({ personId: this.detailId, - relationSearchTypeEO: "SOCIAL" + relationSearchTypeEO: "SOCIAL", }).then((res) => { if (res.list && res.list.length) { this.tableData4 = res.list.map((f) => { return { a: f.name1, - b: f.relationName + b: f.relationName, }; }); } @@ -748,13 +769,13 @@ // 浜插睘鍏崇郴 getPersonRelationAtSchool({ personId: this.detailId, - relationSearchTypeEO: "KINSHIP" + relationSearchTypeEO: "KINSHIP", }).then((res) => { if (res.list && res.list.length) { this.tableData2 = res.list.map((f) => { return { a: f.name1, - b: f.relationName + b: f.relationName, }; }); } @@ -762,13 +783,13 @@ // 甯堟壙鍏崇郴 getPersonRelationAtSchool({ personId: this.detailId, - relationSearchTypeEO: "INHERITANCE" + relationSearchTypeEO: "INHERITANCE", }).then((res) => { if (res.list && res.list.length) { this.tableData3 = res.list.map((f) => { return { a: f.name1, - b: f.relationName + b: f.relationName, }; }); } @@ -776,7 +797,7 @@ }, getMappingData(name) { getFuzzySearch({ - keyword: name + keyword: name, }).then((res) => { this.nodes = []; this.relationships = []; @@ -792,19 +813,19 @@ if (item.name1 && exists1 !== true) { this.nodes.push({ name: item.name1, - id: item.identifier1 + id: item.identifier1, }); } if (item.name2 && exists2 !== true) { this.nodes.push({ name: item.name2, - id: item.identifier2 + id: item.identifier2, }); } let obj = { source: item.name1, target: item.name2, - relation: item.relationName || "" // 濡傛灉瀛樺湪 relationName 瀛楁鍒欎娇鐢紝鍚﹀垯涓虹┖瀛楃涓� + relation: item.relationName || "", // 濡傛灉瀛樺湪 relationName 瀛楁鍒欎娇鐢紝鍚﹀垯涓虹┖瀛楃涓� }; this.relationships.push(obj); }); @@ -814,18 +835,26 @@ }, getMapInfo() { getSpaceTime({ - personId: this.detailId + personId: this.detailId, }).then((res) => { if (res.list && res.list.length) { - const data = res.list.map((item) => { - return { - name: item.activityName, - value: [item.xcoord, item.ycoord] - }; - }); + const data = []; + for (let i = 0; i < res.list.length; i++) { + const item = res.list[i]; + if (item.xcoord && item.ycoord) { + const obj = { + name: item.activityName, + value: [item.xcoord, item.ycoord], + }; + data.push(obj); + } + } this.markerList = data; // 鏃剁┖鍦板浘 - this.initMap(data[0]); + // 杩欓噷鍙彇浜嗙涓�鏉★紝闇�瑕佸叏閮ㄦ暟鎹� + if (data && data.length) { + this.initMap(data); + } } // loadBMap("1NJdwrI1CfT6lrykVhDkmWgsO6O2bjQK").then(() => { @@ -836,34 +865,42 @@ initMap(markerList) { var map = L.map("spaceTime", { preferCanvas: true, - attributionControl: false - }).setView([markerList.value[1], markerList.value[0]], 13); + attributionControl: false, + }).setView([markerList[0].value[1], markerList[0].value[0]], 13); L.tileLayer .chinaProvider("TianDiTu.Normal.Map", { key: "76bc34ead7e30e663a4eded8aeaf5860", maxZoom: 18, - minZoom: 3 + minZoom: 3, }) .addTo(map); let icon = L.divIcon({ html: "<div class='map-circle-name ripple'></div>", iconSize: [80, 80], - className: "map-circle" + className: "map-circle", }); this.map = map; const temp_mark = L.marker([markerList.value[1], markerList.value[0]], { - icon: icon + icon: icon, }).addTo(map); + if (markerList.length) { + for (let i = 0; i < markerList.length; i++) { + const item = markerList[i]; + const temp_mark = L.marker([item.value[1], item.value[0]], { + icon: icon, + }).addTo(map); + } + } }, // 鏀惧ぇ鍦板浘璺宠浆 fangdaClick(index) { if (index == 1) { uni.navigateTo({ - url: "/pages/character/index?keyword=" + this.detailInfo.NAME + url: "/pages/character/index?keyword=" + this.detailInfo.NAME, }); } else if (index == 2) { uni.navigateTo({ - url: "/pages/characterMap/characterMap?id=" + this.detailId + url: "/pages/characterMap/characterMap?id=" + this.detailId, }); } }, @@ -879,13 +916,13 @@ scrollToTop() { window.scrollTo({ top: 0, - behavior: "smooth" // 浣跨敤骞虫粦婊氬姩 + behavior: "smooth", // 浣跨敤骞虫粦婊氬姩 }); }, openFileClick(index) { let obj = { id: this.detailId, - type: "Person" + type: "Person", }; switch (index) { case 1: @@ -988,8 +1025,8 @@ position: "middle", // 璁剧疆鏍囩鏂囨湰鍦ㄧ嚎鐨勪腑闂翠綅缃笂灞呬腑鏄剧ず // bottom: -(FontSize+10), z: 10, // 璁剧疆鏍囩鐨剒杞撮珮搴︼紝浣垮叾姣旇繛鎺ョ嚎鏇撮珮 - distance: -(Distance + 1) // 灏嗘爣绛炬斁缃湪杩炴帴绾夸笂 - } + distance: -(Distance + 1), // 灏嗘爣绛炬斁缃湪杩炴帴绾夸笂 + }, }); } } @@ -1004,8 +1041,8 @@ itemStyle: { color: "#eae0eb", // 鍙互鏍规嵁绱㈠紩璁剧疆涓嶅悓鐨勯鑹� borderWidth: BorderWidth, - borderColor: "#996f9f" - } + borderColor: "#996f9f", + }, }; }); var option; @@ -1015,14 +1052,14 @@ top: FontSize + 10, subtextStyle: { fontSize: FontSize, // 璁剧疆鍓爣棰樻枃瀛楀ぇ灏忎负 14px - color: "#2C2C2C" - } + color: "#2C2C2C", + }, }, backgroundColor: { type: "image", image: "/static/image/characterRelationBg.png", size: "100% 100%", // 鑳屾櫙鍥剧墖鐨勫昂瀵革紝鍙互鏄櫨鍒嗘瘮鎴栬�呭儚绱� - position: "center center" // 鑳屾櫙鍥剧墖鐨勪綅缃紝鍙互鏄� top, bottom, middle 鎴栬�呯櫨鍒嗘瘮 + position: "center center", // 鑳屾櫙鍥剧墖鐨勪綅缃紝鍙互鏄� top, bottom, middle 鎴栬�呯櫨鍒嗘瘮 }, tooltip: {}, animationDurationUpdate: 1500, @@ -1036,7 +1073,7 @@ label: { show: true, color: "black", // 璁剧疆鑺傜偣鏂囧瓧棰滆壊涓洪粦鑹� - fontSize: FontSize // 璁剧疆鏂囧瓧澶у皬 + fontSize: FontSize, // 璁剧疆鏂囧瓧澶у皬 }, edgeSymbol: ["circle"], edgeSymbolSize: [4, 10], @@ -1045,16 +1082,16 @@ lineStyle: { opacity: 0.9, width: 2, - curveness: 0.3 + curveness: 0.3, }, emphasis: { focus: "adjacency", lineStyle: { - width: 10 - } - } - } - ] + width: 10, + }, + }, + }, + ], }; // 灏嗙敓鎴愮殑杩炴帴绾挎坊鍔犲埌echarts鍥捐〃鐨刼ption涓� option.series[0].links = links; @@ -1078,10 +1115,10 @@ text: "", subtext: "", sublink: "", - left: "center" + left: "center", }, tooltip: { - trigger: "item" + trigger: "item", }, bmap: { center: data[0].value, @@ -1093,123 +1130,123 @@ featureType: "water", elementType: "all", stylers: { - color: "#86a1ac" - } + color: "#86a1ac", + }, }, { featureType: "land", elementType: "all", stylers: { - color: "#f1d99d" - } + color: "#f1d99d", + }, }, { featureType: "railway", elementType: "all", stylers: { - visibility: "off" - } + visibility: "off", + }, }, { featureType: "highway", elementType: "all", stylers: { - color: "#f1d99d" - } + color: "#f1d99d", + }, }, { featureType: "highway", elementType: "labels", stylers: { - visibility: "off" - } + visibility: "off", + }, }, { featureType: "arterial", elementType: "geometry", stylers: { - color: "#f1d99d" - } + color: "#f1d99d", + }, }, { featureType: "arterial", elementType: "geometry.fill", stylers: { - color: "#f1d99d" - } + color: "#f1d99d", + }, }, { featureType: "poi", elementType: "all", stylers: { - visibility: "off" - } + visibility: "off", + }, }, { featureType: "green", elementType: "all", stylers: { - visibility: "off" - } + visibility: "off", + }, }, { featureType: "subway", elementType: "all", stylers: { - visibility: "off" - } + visibility: "off", + }, }, { featureType: "manmade", elementType: "all", stylers: { - color: "#f1d99d" - } + color: "#f1d99d", + }, }, { featureType: "local", elementType: "all", stylers: { - color: "#f1d99d" - } + color: "#f1d99d", + }, }, { featureType: "local", elementType: "labels", stylers: { - visibility: "off" - } + visibility: "off", + }, }, { featureType: "arterial", elementType: "labels", stylers: { - visibility: "off" - } + visibility: "off", + }, }, { featureType: "boundary", elementType: "all", stylers: { - color: "#f1d99d" - } + color: "#f1d99d", + }, }, { featureType: "building", elementType: "all", stylers: { - color: "#f1d99d" - } + color: "#f1d99d", + }, }, { featureType: "label", elementType: "labels.text.fill", stylers: { - color: "#000" - } - } - ] - } + color: "#000", + }, + }, + ], + }, }, series: [ { @@ -1219,18 +1256,18 @@ data: data, symbolSize: 0, encode: { - value: 2 + value: 2, }, label: { formatter: "{b}", position: "right", - show: false + show: false, }, emphasis: { label: { - show: true - } - } + show: true, + }, + }, }, { name: "", @@ -1239,32 +1276,32 @@ data: data, symbolSize: 20, encode: { - value: 2 + value: 2, }, showEffectOn: "render", rippleEffect: { - brushType: "stroke" + brushType: "stroke", }, label: { formatter: "{b}", position: "right", - show: false + show: false, }, itemStyle: { color: "#ec7b43", shadowBlur: 10, - shadowColor: "#333" + shadowColor: "#333", }, emphasis: { - scale: false + scale: false, }, - zlevel: 1 - } - ] + zlevel: 1, + }, + ], }; option && myChart.setOption(option); - } - } + }, + }, }; </script> @@ -1500,4 +1537,8 @@ opacity: 0; } } + +.fileul li:hover { + color: #597aa5; +} </style> -- Gitblit v1.9.1