1
QYF-GitLab1
2024-07-24 caeb2c4b5fa88f6fe8799b67c790d8ad8b4d98e8
src/pages/academicSchools/index.vue
@@ -62,10 +62,11 @@
                <div class="selectActivelyBox" @click="selectActively">
                  <p v-if="formData.actively.length == 0">请选择活动地</p>
                  <el-tag
                    style="margin-right: 5px"
                    v-for="item in formData.actively"
                    :key="item.id"
                    :key="item.index"
                    size="small"
                    closable
                    type="info"
                    >{{ item.name }}</el-tag
                  >
                </div>
@@ -131,12 +132,68 @@
            </el-col>
          </el-row>
          <div style="text-align: right">
            <el-button type="primary" size="mini" @click="searchFun"
            <el-button
              size="mini"
              style="background-color: #244a7b; color: #fff"
              @click="searchFun"
              >搜索</el-button
            >
            <el-button size="mini" @click="resetForm">重置</el-button>
          </div>
        </el-form>
        <div class="fromTable">
          <el-table
            :data="tableData"
            class="lightBo"
            style="width: 100%"
            empty-text="暂无搜索信息"
            size="small"
            :border="true"
          >
            <el-table-column
              prop="id"
              label="序号"
              width="70"
            ></el-table-column>
            <el-table-column prop="personName" width="120" label="姓名">
              <template slot-scope="scope">
                <a
                  style="cursor: pointer; color: #027edc"
                  @click="gotoDetail(scope.row.id)"
                  >{{ scope.row.personName }}</a
                >
              </template>
            </el-table-column>
            <el-table-column prop="personAlias" label="别名"></el-table-column>
            <el-table-column prop="palce" label="活动地"></el-table-column>
            <el-table-column
              prop="birthYear"
              label="医学分科"
              width="120"
            ></el-table-column>
            <el-table-column prop="deathYear" label="作品"></el-table-column>
            <el-table-column
              prop="nativePlace"
              width="120"
              label="人物标签"
            ></el-table-column>
            <el-table-column
              prop="socialDistinction"
              label="社会身份"
              width="120"
            ></el-table-column>
            <el-table-column
              prop="official"
              width="120"
              label="时期"
            ></el-table-column>
          </el-table>
          <div style="text-align: right;padding-top: 20px;">
            <el-button style="width: 120px;background-color: #244a7b; color: #fff"
              >确认</el-button
            >
          </div>
        </div>
      </view>
      <div v-if="showPerson" class="personDialog">
        <i
@@ -185,6 +242,7 @@
          text-align: center;
          font-size: 0.2rem;
          color: #666;
          z-index: 99;
        "
      >
        暂无相关数据
@@ -200,6 +258,7 @@
          text-align: center;
          font-size: 0.2rem;
          color: #666;
          z-index: 99;
        "
      ></div>
    </div>
@@ -231,7 +290,6 @@
      </div>
      <div class="btn" @click="spaceTimeArr(detailData.id)">查看更多>>></div>
    </div>
    <el-drawer
      title="地址列表"
      :visible.sync="drawer"
@@ -272,14 +330,14 @@
          <el-table
            ref="multipleTable"
            :data="gridData"
            tooltip-effect="dark"
            style="width: 100%"
            height="530"
            @selection-change="handleSelectionChange"
            row-key="index"
          >
            <el-table-column type="selection" width="55"> </el-table-column>
            <el-table-column prop="currentName" label="地名"> </el-table-column>
            <el-table-column width="250" label="年代區間" show-overflow-tooltip>
            <el-table-column width="250" label="年代區間">
              <template slot-scope="scope">{{
                scope.row.start + "-" + scope.row.end
              }}</template>
@@ -295,6 +353,8 @@
        </div>
        <div class="drawerPage">
          <el-pagination
            class="paging flex"
            background
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="currentPage"
@@ -308,7 +368,7 @@
        <div class="drawerBtn">
          <el-button @click="setCurrent">全選當前頁</el-button>
          <el-button @click="setCurrent('cancle')">取消全選</el-button>
          <el-button @click="onOkAddress" type="primary">確定</el-button>
          <el-button @click="drawer = false" type="primary">確定</el-button>
        </div>
      </div>
    </el-drawer>
@@ -319,7 +379,6 @@
import {
  getPersonData,
  getHotSearch,
  getPDataStatistics,
  academicSearch,
  getPersonTag,
  getSocialDistinction,
@@ -330,6 +389,8 @@
export default {
  data() {
    return {
      // 高級搜索表格
      tableData: [],
      loading: true,
      hotAciveIndex: "",
      currentId: 21682,
@@ -343,23 +404,23 @@
      // 分类
      categories: [
        {
          name: "亲属关系"
          name: "亲属关系",
        },
        {
          name: "师承关系"
          name: "师承关系",
        },
        {
          name: "文献作品"
          name: "文献作品",
        },
        {
          name: "社会关系"
          name: "社会关系",
        },
        {
          name: "活动地"
          name: "活动地",
        },
        {
          name: "学术流派"
        }
          name: "学术流派",
        },
      ],
      // 当前人物信息
      ownInfo: null,
@@ -391,10 +452,10 @@
      currentPage: 1,
      pageSize: 10,
      total: 0,
      multipleSelection: [],
      drawer: false,
      dynastyId: "",
      tableKey: "",
      multipleTableSelection: [],
      // echarts
      infoOfPersons: [],
      infoOfSchools: [],
@@ -432,7 +493,15 @@
    },
    // 表格选择
    handleSelectionChange(val) {
      this.multipleSelection = val;
      const data = val.map((item) => {
        return {
          ...item,
          name: item.currentName,
          id: item.dynastyId,
        };
      });
      this.formData.actively = data;
      this.multipleTableSelection = this.formData.actively;
    },
    // 全選
    setCurrent(str) {
@@ -441,23 +510,20 @@
        return false;
      }
      if (this.gridData.length) {
        this.$refs.multipleTable.clearSelection();
        this.gridData.forEach((row) => {
          this.$refs.multipleTable.toggleRowSelection(row);
        });
        this.multipleSelection = this.gridData;
        const data = this.gridData.map((item) => {
          return {
            ...item,
            name: item.currentName,
            id: item.dynastyId,
          };
        });
        this.formData.actively = data;
        this.multipleTableSelection = this.formData.actively;
      }
    },
    // 確認地址
    onOkAddress() {
      const data = this.multipleSelection.map((item) => {
        return {
          ...item,
          name: item.currentName,
          id: item.dynastyId,
        };
      });
      this.formData.actively = data;
      this.drawer = false;
    },
    // 獲取地址列表
    getAddressList() {
@@ -472,8 +538,22 @@
        data["keyword"] = this.tableKey;
      }
      getPlaceInfo(data).then((res) => {
        if (res?.success && res?.npage) {
          this.total = res.npage.totalCount;
        }
        if (res?.success && res?.list.length) {
          this.gridData = res?.list;
          this.gridData = res?.list?.map((item, i) => {
            return {
              ...item,
              index: i,
            };
          });
          setTimeout(() => {
            this.multipleTableSelection.forEach((row) => {
              this.$refs.multipleTable.toggleRowSelection(row);
            });
            this.formData.actively = this.multipleTableSelection;
          }, 2000);
        } else {
          this.gridData = [];
        }
@@ -668,16 +748,19 @@
    getData() {
      this.loading = true;
      getPersonData(this.currentId).then((res) => {
        console.log("1111111111111", res);
        this.infoOfPersons = res.object.infoOfPersons;
        this.infoOfSchools = res.object.infoOfSchools;
        this.nodeDatas = [];
        this.links = [];
        this.handleData([res.object.personChain], null);
        console.log("this.nodeDatas", this.nodeDatas);
        console.log("this.links", this.links);
        this.loading = false;
        this.relation();
        if (res && res.object) {
          this.infoOfPersons = res?.object?.infoOfPersons;
          this.infoOfSchools = res?.object?.infoOfSchools;
          this.nodeDatas = [];
          this.links = [];
          this.handleData([res.object.personChain], null);
          this.loading = false;
          this.relation();
        } else {
          this.loading = false;
          this.nodeDatas = [];
          this.links = [];
        }
        // this.nodes = [];
        // this.relationships = [];
        // let kinData = [];
@@ -835,7 +918,7 @@
                  this.nodeDatas.push({
                    category: 0,
                    id: item.mainId,
                    name: p.NAME[0].content1
                    name: p.NAME[0].content1,
                  });
                }
              }
@@ -864,7 +947,7 @@
                this.nodeDatas.push({
                  category: 2,
                  id: item.mainId,
                  name: item.literatureName
                  name: item.literatureName,
                });
              }
              this.links.push({
@@ -881,7 +964,7 @@
                this.nodeDatas.push({
                  category: 4,
                  id: item.mainId,
                  name: item.ancientName
                  name: item.ancientName,
                });
              }
              this.links.push({
@@ -902,7 +985,7 @@
                  this.nodeDatas.push({
                    category: 5,
                    id: item.mainId,
                    name: s.name[0]
                    name: s.name[0],
                  });
                }
              }
@@ -924,7 +1007,7 @@
                  this.nodeDatas.push({
                    category: 3,
                    id: item.mainId,
                    name: p.NAME[0].content1
                    name: p.NAME[0].content1,
                  });
                }
              }
@@ -957,7 +1040,7 @@
                  this.nodeDatas.push({
                    category: 1,
                    id: item.mainId,
                    name: p.NAME[0].content1
                    name: p.NAME[0].content1,
                  });
                }
              }
@@ -1093,9 +1176,9 @@
            },
            force: {
              repulsion: 600,
              edgeLength: 300
            }
          }
              edgeLength: 300,
            },
          },
        ],
        color: [
          "#5470c6",
@@ -1103,8 +1186,8 @@
          "#fac858",
          "#ee6666",
          "#ea7ccc",
          "#9a60b4"
        ]
          "#9a60b4",
        ],
      };
      // 设置点击事件监听
      myChart.off("click");
@@ -1126,9 +1209,7 @@
        div.style.display = "block";
        div.style.left = e.offsetX + 50 + "px";
        div.style.top = e.offsetY - 50 + "px";
        const data = this.infoOfPersons?.find(
          (i) => i.id == id
        );
        const data = this.infoOfPersons?.find((i) => i.id == id);
        const obj = {
          id: id,
          name:
@@ -1151,7 +1232,7 @@
              i += 1;
              return e["content" + i];
            }).join("、") ?? "",
          biography: data?.BIOGRAPHY ?? ""
          biography: data?.BIOGRAPHY ?? "",
        };
        this.detailData = obj;
      }
@@ -1162,9 +1243,7 @@
        div.style.display = "block";
        div.style.left = e.offsetX + 50 + "px";
        div.style.top = e.offsetY - 50 + "px";
        const data = this.infoOfPersons?.find(
          (i) => i.id == id
        );
        const data = this.infoOfPersons?.find((i) => i.id == id);
        const obj = {
          id: params.data.id,
          name:
@@ -1187,7 +1266,7 @@
              i += 1;
              return e["content" + i];
            }).join("、") ?? "",
          biography: data?.BIOGRAPHY ?? ""
          biography: data?.BIOGRAPHY ?? "",
        };
        this.detailData = obj;
      }
@@ -1294,11 +1373,28 @@
</script>
<style>
.fromTable {
  width: 100%;
  padding: 40px 0;
  box-sizing: border-box;
}
.fromTable >>> .el-table thead th.el-table__cell {
  background-color: rgb(194 208 217) !important;
  color: #333;
  font-weight: normal;
  font-size: 14px;
}
.customDrawer >>> .el-drawer__header {
  margin-bottom: 20px;
  border-bottom: 1px solid #eee;
  padding: 20px;
  box-sizing: border-box;
}
.headerClassBg {
  background-color: rgb(95, 127, 168);
}
.drawerTips {
@@ -1310,9 +1406,16 @@
  width: 100%;
}
.drawerTable >>> .el-table thead th.el-table__cell {
  background-color: rgb(231, 236, 239) !important;
  color: #333;
  font-weight: normal;
}
.tableTabs {
  width: 100%;
  display: flex;
  margin-bottom: 20px;
}
.inputItem {
@@ -1338,6 +1441,36 @@
  box-sizing: border-box;
}
/* 分页 */
.paging ::v-deep .btn-prev,
.paging ::v-deep .btn-next {
  border: 0;
  height: 30px;
}
.paging ::v-deep .btn-prev span,
.paging ::v-deep .btn-next span {
  font-size: 0.12rem;
  height: 0.3rem;
  line-height: 0.3rem;
  background-color: #fff;
  color: #9e9e9e;
  text-align: center;
  border: 1px solid #9e9e9e;
  padding: 0 0.1rem;
}
.paging ::v-deep .el-pager li {
  font-size: 0.1rem;
  width: 0.28rem;
  height: 0.3rem;
  line-height: 0.3rem;
  background-color: #fff;
  color: #9e9e9e;
  text-align: center;
  border: 1px solid #9e9e9e;
}
#relation {
  width: 100%;
  height: 100%;