人物详情

YM

2024-05-29 3efb4b13a0c22332f75b48af4015541d6833c1fe

 src/pages/character/index.vue

@@ -1,5 +1,7 @@
<template>
  <view>
  <view
    style="width: 100%; height: 100%; display: flex; flex-direction: column"
  >
    <headNav idIndex="1" text="中医人物数据库" />
    <!-- 高级搜索 -->
    <view style="margin: 0.35rem 0 0.16rem 0">
@@ -9,6 +11,7 @@
        :from="From"
        placehold="请输入关键字"
        :keyword="searchKey"
        :advancedSearchBack="advancedSearchBack"
      />
    </view>
    <!-- 热门搜索 -->
@@ -25,14 +28,29 @@
        </li>
      </ul>
    </view>
    <view class="" style="margin-left: 0.2rem">书中最常提到的100位人物</view>
    <view  style="margin-left: 0.2rem">书中最常提到的100位人物</view>
    <!-- 关系表地图 -->
    <view
      id="relation"
      style="margin-top: 0.2rem; height: 70vh; width: 100%"
    ></view>
      style="margin-top: 0.2rem; flex: 1; width: 100%; position: relative"
      ><div
        v-if="!loading && relationships.length == 0"
        style="
          position: absolute;
          top: 30%;
          left: 0;
          right: 0;
          text-align: center;
          font-size: 0.2rem;
          color: #666;
        "
      >
        暂无相关数据
      </div></view
    >

    <!-- 朝代 -->
    <view
    <!-- <view
      class="flex flex-center"
      style="width: 100%; position: fixed; bottom: 0.33rem; left: 0"
    >
@@ -69,7 +87,7 @@
          </view>
        </li>
      </ul>
    </view>
    </view> -->
  </view>
</template>

@@ -86,6 +104,7 @@
export default {
  data() {
    return {
      loading: true,
      // echarts数据
      nodes: [],
      // echarts两者的关系
@@ -273,9 +292,9 @@
    this.searchKey = options.keyword;
  },
  methods: {
    getData() {
    getData(key) {
      getFuzzySearch({
        keyword: this.searchKey ? this.searchKey : ""
        keyword: key ? key : this.searchKey ? this.searchKey : ""
      }).then((res) => {
        this.nodes = [];
        this.relationships = [];
@@ -308,6 +327,7 @@
            this.relationships.push(obj);
          });
        }
        this.loading = false;
        this.relation();
      });
    },
@@ -388,7 +408,7 @@
          }
        };
      });
      

      var option;
      option = {
        title: {
@@ -454,7 +474,6 @@
      // 设置点击事件监听
      myChart.off("click");
      myChart.on("click", (params) => {
        console.log(params);
        if (params.dataType === "node") {
          this.spaceTimeArr(params.data.id);
        }
@@ -463,13 +482,22 @@
    },
    // 基础搜索
    onSearch(val) {
      this.searchKey = val.text;
      this.getData();
      // this.searchKey = val.text;
      this.getData(val.text);
    },
    // 高级搜索
    onSubmit(val) {
      getAdvanceSearch(val).then((res) => {
        console.log(res, "接口调用成功");
      getAdvanceSearch({
        ...val,
        page: 1,
        pageSize: 100
      }).then((res) => {
        console.log(res, "res");
      });
    },
    advancedSearchBack() {
      uni.navigateTo({
        url: "/pages/knowledgeBase/knowledgeBase"
      });
    },
    // 点击下面的朝代按钮