| | |
| | | @click="onSearch({ text: item }, index)" |
| | | :class="{ cursor: true, active: hotAciveIndex === index }" |
| | | v-for="(item, index) in hotKeyList" |
| | | :key="item" |
| | | :key="item.name" |
| | | > |
| | | {{ item.name }} |
| | | </li> |
| | |
| | | </view> |
| | | <view v-if="isAdvancedSearch" class="searchDialog"> |
| | | <h3 style="margin-bottom: 0.2rem">高级搜索</h3> |
| | | <el-form label-width="100px" :model="formData" size="mini"> |
| | | <el-form |
| | | label-width="100px" |
| | | :model="formData" |
| | | ref="searchForm" |
| | | size="mini" |
| | | > |
| | | <el-row> |
| | | <el-col :span="8"> |
| | | <el-form-item label="姓名/别名:"> |
| | |
| | | </el-col> |
| | | <el-col :span="8"> |
| | | <el-form-item label="活动地:"> |
| | | <el-select |
| | | style="width: 100%" |
| | | v-model="formData.actively" |
| | | placeholder="请选择活动地" |
| | | > |
| | | <!-- <el-option label="区域一" value="shanghai"></el-option> --> |
| | | <!-- <el-option label="区域二" value="beijing"></el-option> --> |
| | | </el-select> |
| | | <div class="selectActivelyBox" @click="selectActively"> |
| | | <p v-if="formData.actively.length == 0">请选择活动地</p> |
| | | <el-tag |
| | | v-for="item in formData.actively" |
| | | :key="item.id" |
| | | size="small" |
| | | closable |
| | | >{{ item.name }}</el-tag |
| | | > |
| | | </div> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="8"> |
| | |
| | | <el-col :span="8"> |
| | | <el-form-item label="人物标签:"> |
| | | <el-select |
| | | multiple |
| | | style="width: 100%" |
| | | v-model="formData.personTags" |
| | | placeholder="请选择人物标签" |
| | | > |
| | | <!-- <el-option label="区域一" value="shanghai"></el-option> --> |
| | | <!-- <el-option label="区域二" value="beijing"></el-option> --> |
| | | <el-option |
| | | v-for="item in personTag" |
| | | :key="item.id" |
| | | :label="item.name" |
| | | :value="item.id" |
| | | ></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="8"> |
| | | <el-form-item label="社会身份:"> |
| | | <el-select |
| | | multiple |
| | | style="width: 100%" |
| | | v-model="formData.socialIdentity" |
| | | placeholder="请选择社会身份" |
| | | > |
| | | <!-- <el-option label="区域一" value="shanghai"></el-option> --> |
| | | <!-- <el-option label="区域二" value="beijing"></el-option> --> |
| | | <el-option |
| | | v-for="item in socialDistinction" |
| | | :key="item.id" |
| | | :label="item.name" |
| | | :value="item.id" |
| | | ></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="8"> |
| | | <el-form-item label="时期:"> |
| | | <el-select |
| | | multiple |
| | | style="width: 100%" |
| | | v-model="formData.period" |
| | | placeholder="请选择时期" |
| | | > |
| | | <!-- <el-option label="区域一" value="shanghai"></el-option> --> |
| | | <!-- <el-option label="区域二" value="beijing"></el-option> --> |
| | | <el-option |
| | | v-for="item in dynastyData" |
| | | :key="item.dynastyId" |
| | | :label="item.name" |
| | | :value="item.dynastyId" |
| | | ></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <div style="text-align: right"> |
| | | <el-button type="primary" size="mini" @click="searchFun" |
| | | >搜索</el-button |
| | | > |
| | | <el-button size="mini" @click="resetForm">重置</el-button> |
| | | </div> |
| | | </el-form> |
| | | <div style="text-align: right"> |
| | | <el-button type="primary" size="mini">搜索</el-button> |
| | | <el-button size="mini">重置</el-button> |
| | | </div> |
| | | </view> |
| | | <div v-if="showPerson" class="personDialog"> |
| | | <i |
| | |
| | | </div> |
| | | <div class="btn" @click="spaceTimeArr(detailData.id)">查看更多>>></div> |
| | | </div> |
| | | <el-drawer |
| | | title="地址列表" |
| | | :visible.sync="drawer" |
| | | direction="rtl" |
| | | :before-close="handleClose" |
| | | > |
| | | <span>我来啦!</span> |
| | | </el-drawer> |
| | | </view> |
| | | </template> |
| | | |
| | |
| | | getPersonData, |
| | | getHotSearch, |
| | | getPDataStatistics, |
| | | academicSearch |
| | | academicSearch, |
| | | getPersonTag, |
| | | getSocialDistinction, |
| | | getDynastyAll |
| | | } from "@/api/index.js"; |
| | | import * as echarts from "echarts"; |
| | | import MyForm from "@/components/form/form.vue"; |
| | |
| | | isAdvancedSearch: false, |
| | | formData: { |
| | | name: "", |
| | | actively: "", |
| | | actively: [], |
| | | works: "", |
| | | personTags: "", |
| | | socialIdentity: "", |
| | |
| | | totalCount: 0, |
| | | page: 1, |
| | | limit: 10 |
| | | } |
| | | }, |
| | | personTag: [], |
| | | socialDistinction: [], |
| | | dynastyData: [], |
| | | drawer:false, |
| | | }; |
| | | }, |
| | | mounted() { |
| | | this.getData(); |
| | | // this.echartsArr(); |
| | | this.hotSearch(); |
| | | // 获取人物标签、社会身份 |
| | | this.getOptionInfo(); |
| | | // 监听窗口大小变化 |
| | | window.addEventListener("resize", this.relation); |
| | | }, |
| | |
| | | this.searchKey = options.keyword; |
| | | }, |
| | | methods: { |
| | | getOptionInfo() { |
| | | getDynastyAll().then((res) => { |
| | | this.dynastyData = res.list; |
| | | }); |
| | | getPersonTag().then((res) => { |
| | | this.personTag = res.list; |
| | | }); |
| | | getSocialDistinction().then((res) => { |
| | | this.socialDistinction = res.list; |
| | | }); |
| | | }, |
| | | resetForm(formName) { |
| | | this.formData = { |
| | | name: "", |
| | | actively: [], |
| | | works: "", |
| | | personTags: "", |
| | | socialIdentity: "", |
| | | period: "" |
| | | }; |
| | | }, |
| | | searchFun() { |
| | | console.log(this.formData); |
| | | }, |
| | | selectActively() { |
| | | this.drawer = true; |
| | | }, |
| | | handleClose(done) { |
| | | done(); |
| | | }, |
| | | // 获取人物关系 |
| | | getPersonInfo(arr, str, newArr, order, type, parent) { |
| | | for (let i = 0; i < arr.length; i++) { |
| | |
| | | const obj = { |
| | | personId: ele.personId, |
| | | parentId: parent.id, |
| | | id2: personInfo.id, |
| | | relationTypeName: ele.relationTypeName, |
| | | parentName: parent?.NAME[0]?.content1 ?? parent.parentName, |
| | | name2: personInfo?.NAME[0]?.content1, |
| | | name: personInfo?.NAME[0]?.content1, |
| | | category: type, |
| | | symbolSize: 15 |
| | | }; |
| | |
| | | if (!ele.personId && ele.personList?.length) { |
| | | ele.literatureList = []; |
| | | ele.personId = this.ownInfo.id; |
| | | if (ele[str] && ele[str]?.length) { |
| | | for (let j = 0; j < ele.personList.length; j++) { |
| | | const item = ele.personList[j]; |
| | | if (ele["personList"] && ele["personList"]?.length) { |
| | | for (let j = 0; j < ele["personList"].length; j++) { |
| | | const item = ele["personList"][j]; |
| | | const data = item[str]?.map((e) => { |
| | | return { |
| | | ...e, |
| | | personId: item.personId |
| | | }; |
| | | }); |
| | | if (data?.length) { |
| | | if (ele[str] && data?.length) { |
| | | ele[str].push(...data); |
| | | } |
| | | } |
| | |
| | | } |
| | | return arr; |
| | | }, |
| | | |
| | | // 文献 |
| | | |
| | | //数组去重 |
| | | deduplicateArray(arr, idKey) { |
| | |
| | | if (res && res.success && res.object) { |
| | | this.infoOfPersons = res.object?.infoOfPersons; |
| | | this.infoOfSchools = res.object?.infoOfSchools; |
| | | console.log(res.object); |
| | | if (res.object?.personChain) { |
| | | this.ownInfo = this.infoOfPersons.find( |
| | | (item) => item.id == res.object?.personChain.personId |
| | |
| | | this.categories.push({ name: "活动地" }); |
| | | let newArr = []; |
| | | const data = this.changeLiterature(obj.placeList, "placeList"); |
| | | console.log(data, "place"); |
| | | this.getPersonInfo(data, "placeList", newArr, 1, 4, this.ownInfo); |
| | | place = [...newArr]; |
| | | } |
| | |
| | | ...place, |
| | | ...school |
| | | ]; |
| | | console.log(personData); |
| | | // const k = personData.filter((item) => item.category == 0); |
| | | // const t = personData.filter((item) => item.category == 1); |
| | | // const l = personData.filter((item) => item.category == 2); |
| | | // const o = personData.filter((item) => item.category == 3); |
| | | // const p = personData.filter((item) => item.category == 4); |
| | | // const s = personData.filter((item) => item.category == 5); |
| | | // const nodesList = [...k, ...t, ...l, ...o, ...p, ...s]; |
| | | |
| | | personData.forEach((item) => { |
| | | let exists1 = this.nodes.some( |
| | | (node) => |
| | | node.id === item.parentId && node.name === item.parentName |
| | | ); |
| | | let exists2 = this.nodes.some( |
| | | (node) => node.id === item.parentId && node.name === item.name2 |
| | | ); |
| | | // 证明不存在 |
| | | if (item.name1 && exists1 !== true) { |
| | | this.nodes.push({ |
| | | name: item.parentName, |
| | | id: item.parentId, |
| | | ...item |
| | | }); |
| | | } |
| | | if (item.name2 && exists2 !== true) { |
| | | this.nodes.push({ |
| | | name: item.name2, |
| | | id: item.id2, |
| | | ...item |
| | | }); |
| | | } |
| | | this.nodes.push({ |
| | | name: item.name, |
| | | id: item.personId, |
| | | ...item |
| | | }); |
| | | let obj = { |
| | | source: item.parentName, |
| | | target: item.name2, |
| | | target: item.name, |
| | | relation: item.relationTypeName || "" // 如果存在 relationName 字段则使用,否则为空字符串 |
| | | }; |
| | | this.relationships.push(obj); |
| | |
| | | var links = []; |
| | | relationships.forEach((relationship, i) => { |
| | | var sourceIndex = nodes.findIndex( |
| | | (node) => node.name === relationship.source |
| | | (node) => node.parentName === relationship.source |
| | | ); |
| | | var targetIndex = nodes.findIndex( |
| | | (node) => node.name === relationship.target |
| | |
| | | }); |
| | | // 根据nodes动态生成节点数据 |
| | | var nodeData = nodes; |
| | | console.log(nodeData); |
| | | console.log(links); |
| | | var option; |
| | | option = { |
| | | // backgroundColor: { |
| | |
| | | cursor: pointer; |
| | | } |
| | | } |
| | | |
| | | .selectActivelyBox { |
| | | cursor: pointer; |
| | | border: 1px solid #dcdfe6; |
| | | border-radius: 4px; |
| | | padding: 0 0.12rem; |
| | | font-size: 12px; |
| | | color: #c0c4cc; |
| | | } |
| | | |
| | | .el-drawer__wrapper{ |
| | | top: 0.86rem; |
| | | } |
| | | |
| | | ::v-deep .el-drawer__open .el-drawer.rtl{ |
| | | width: 50% !important; |
| | | } |
| | | |
| | | </style> |