1

YM

2024-04-24 ccb19f88b2583c7dadb18b6b2e9571ec120c6c61

1

 src/api/index.js

@@ -1,222 +1,266 @@
import req from '@/utils/request/req1.js'
import req1 from '@/utils/request/req1.js'
import qs from 'querystring'
import req from "@/utils/request/req1.js";
import req1 from "@/utils/request/req1.js";
import qs from "querystring";
// 注册登录
export const getaddLogin = (Obj) => {
    return req1({
        url: '/account/register',
        method: 'post',
        data: Obj
    })
}
  return req1({
    url: "/account/register",
    method: "post",
    data: Obj
  });
};

// 验证码   /account/verifyCode
export const getverifyCode = (req) => {
    console.log(req, qs.encode(req), 'rrr');
    return req1({
        url: "/account/verifyCode",
        method: "post",
        data: req,
        headers: {
            'Content-Type': 'multipart/form-data'
        }
    })
}
  console.log(req, qs.encode(req), "rrr");
  return req1({
    url: "/account/verifyCode",
    method: "post",
    data: req,
    headers: {
      "Content-Type": "multipart/form-data"
    }
  });
};

// login 登录
export const getLogin = (req) => {
    console.log(req, qs.encode(req), 'rrr');
    return req1({
        url: "/account/verification",
        method: "post",
        data: req,
    })
}
  console.log(req, qs.encode(req), "rrr");
  return req1({
    url: "/account/verification",
    method: "post",
    data: req
  });
};
// 获取用户信息
export const getUserInfo = () => {
    return req1({
        url: "/account/getUserInfo",
        method: "post",
    })
}
  return req1({
    url: "/account/getUserInfo",
    method: "post"
  });
};

// 重置密码
export const getRestPassword = (Obj) => {
    return req1({
        url: '/account/resetPassword',
        method: 'post',
        data: Obj
    })
}
  return req1({
    url: "/account/resetPassword",
    method: "post",
    data: Obj
  });
};

// 退出登录
export const getlogout = () => {
    return req1({
        url: "/account/logout",
        method: "post",
    })
}
  return req1({
    url: "/account/logout",
    method: "post"
  });
};

// 修改密码
export const getchangePassword = (obj) => {
    return req1({
        url: "/account/changePassword",
        method: "post",
        data: obj
    })
}
  return req1({
    url: "/account/changePassword",
    method: "post",
    data: obj
  });
};

// 
//
// 人物相关接口的数据输出
export const getdataOutput = () => {
    return req1({
        url: "/person/dataOutput",
        method: "post",
    })
}
  return req1({
    url: "/person/dataOutput",
    method: "post"
  });
};

// 人物相关的 热门搜索
export const getHotSearch = () => {
    return req1({
        url: '/person/hotSearch',
        method: 'post'
    })
}
  return req1({
    url: "/person/hotSearch",
    method: "post"
  });
};
// 人物相关的 来源
export const getSource = (id) => {
    return req1({
        url: '/person/source',
        method: 'post',
        data: id
    })
}
// 人物相关的 个人时空地图 
export const getSpaceTime = (id) => {
    return req1({
        url: '/person/spaceTime',
        method: 'post',
        data: id
    })
}
export const getSource = (data) => {
  return req1({
    url: "/person/source",
    method: "post",
    data: data
  });
};
// 人物相关的 个人时空地图
export const getSpaceTime = (data) => {
  return req1({
    url: "/person/spaceTime",
    method: "post",
    data: data
  });
};

// 医学人物知识库的相关图表
export const getImages = (id) => {
    return req1({
        url: '/person/images',
        method: 'post',
        data: id
    })
}
export const getPersonImages = (data) => {
  return req1({
    url: "/person/images",
    method: "post",
    data: data
  });
};
// 医学人物知识库 个人事迹
export const getPersonBiog = (data) => {
  return req1({
    url: "/person/biog",
    method: "post",
    data: data
  });
};
// 医学人物知识库 人物关系
export const getPersonRelationAtSchool = (data) => {
  return req1({
    url: "/person/personRelationAtSchool",
    method: "post",
    data: data
  });
};

// 医学人物知识库 著述
export const getWritings = (id) => {
    return req1({
        url: '/person/writings',
        method: 'post',
        data: id
    })
}
export const getPersonWritings = (data) => {
  return req1({
    url: "/person/writings",
    method: "post",
    data: data
  });
};
// 医学人物知识库 人物详情
export const getPersonInfo = (Obj) => {
    return req1({
        url: '/person/getPersonInfo',
        method: 'post',
        data: Obj
    })
}
// 医学人物知识库 基础检索  
export const getFuzzySearch = (Obj) => {
    console.log(Obj, 'sss');
    return req1({
        url: '/person/fuzzySearch?keyword=' + Obj,
        method: 'post',
        // data:Obj
    })
}
  return req1({
    url: "/person/getPersonInfo",
    method: "post",
    data: Obj
  });
};
// 医学人物知识库 基础检索
export const getFuzzySearch = (requestData) => {
  return req1({
    url: "/person/fuzzySearch?keyword="+requestData?.keyword,
    method: "post",
  });
};

// 医学人物知识库 高级检索  
// 医学人物知识库 高级检索
export const getAdvanceSearch = (Obj) => {
    return req1({
        url: '/person/advanceSearch',
        method: 'post',
        data: Obj
    })
}
  return req1({
    url: "/person/advanceSearch",
    method: "post",
    data: Obj
  });
};

// 中国地域地谱检索人物
export const getRetrieval = (dynastyNumber, name) => {
    return req1({
        url: '/person/retrieval',
        method: 'post',
        data: {
            dynasty: dynastyNumber,
            keyword: name
        }
    })
}
export const getRetrieval = (requestData) => {
  return req1({
    url: "/person/retrieval",
    method: "post",
    data: {
      keyword: requestData?.keyword || "",
      dynasty: requestData?.dynasty || ""
    }
  });
};
// 医学人物知识库

// 世医传承
export const inheritMedicalList = (requestData) => {
  return req1({
    url: "/inheritMedical/list",
    method: "post",
    data: requestData
  });
};
export const inheritMedicalSataStatistics = (requestData) => {
  return req1({
    url: "/inheritMedical/dataStatistics",
    method: "post",
    data: requestData
  });
};
export const inheritMedicalCultureList = (requestData) => {
  return req1({
    url: "/inheritMedical/cultureList",
    method: "post",
    data: requestData
  });
};
export const inheritMedicalRelationList = (requestData) => {
  return req1({
    url: "/inheritMedical/relationList",
    method: "post",
    data: requestData
  });
};

// 检索页
// 基础、高级检索 ------------------------------
export const getPList = (person) => {
    return req1({
        url: '/person/list',
        method: 'post',
        data: person
    })
}
export const getPersonList = (data) => {
  return req1({
    url: "/person/list",
    method: "post",
    data: data
  });
};
// 检索数据到出
export const getPDownload = () => {
    return req1({
        url: '/person/download',
        method: 'post'
    })
}
  return req1({
    url: "/person/download",
    method: "post"
  });
};
// -------------------------P




// 医事制度
// 数据统计
export const getDataStatistics = () => {
    return req1({
        url: '/medical/dataStatistics',
        method: 'post'
    })
}
  return req1({
    url: "/medical/dataStatistics",
    method: "post"
  });
};
// 查询
export const getMedicalList = (data) => {
    return req1({
        url: '/medical/list',
        method: 'post',
        data: data
    })
}
  return req1({
    url: "/medical/list",
    method: "post",
    data: data
  });
};
// 详情
export const getMedicalDetails = (Obj) => {
    return req1({
        url: '/medical/details',
        method: 'post',
        data: Obj
    })
}
  return req1({
    url: "/medical/details",
    method: "post",
    data: Obj
  });
};
// 取值：RDF、NT、XML、JSON
export const getMedicalDataOutput = (Obj) => {
    return req1({
        url: '/medical/dataOutput',
        method: 'post',
        data: Obj
    })
}
  return req1({
    url: "/medical/dataOutput",
    method: "post",
    data: Obj
  });
};

// -----------



// 中国医学人物知识库
// 数据统计
export const getPDataStatistics = () => {
    return req1({
        url: '/person/dataStatistics',
        method: 'post'
    })
}
// ----------------
  return req1({
    url: "/person/dataStatistics",
    method: "post"
  });
};
// ----------------

 src/components/advancedSearch/advancedSearch.vue

@@ -1,198 +1,220 @@
<template>
    <view style="height: 100% ;">
        <view class="flex flex-center" style="margin: 20rpx 0;">
            <luanqing-search class="search_bar" @onSearch="onSearch" :buttonText="buttonText"
                :isSearchTrue="isSearchTrue" :placehold="placehold"></luanqing-search>
            <view class="advancedSea" v-if="isAvancedTrue" @click="isAvancedClick"
                style="color:#244A7B ;font-size: .12rem;margin-left: .31rem;cursor: pointer;">高级搜索 ﹀</view>
        </view>
        <!-- 高级搜索 -->
        <view class="advancedSeaTrue" v-if="isAdvancedSearch" style="padding: 0 1.24rem; margin-bottom: .18rem;">
            <view style="background-color: #fff;padding: .29rem;" class="">
                <h3>高级搜索</h3>
                <MyForm @submit="onSubmit" :from="from" />
            </view>
        </view>
    </view>
  <view style="height: 100%">
    <view class="flex flex-center" style="margin: 20rpx 0">
      <luanqing-search
        class="search_bar"
        @onSearch="onSearch"
        :buttonText="buttonText"
        :isSearchTrue="isSearchTrue"
        :placehold="placehold"
        :keyword="keyword"
      ></luanqing-search>
      <view
        class="advancedSea"
        v-if="isAvancedTrue"
        @click="isAvancedClick"
        style="
          color: #244a7b;
          font-size: 0.12rem;
          margin-left: 0.31rem;
          cursor: pointer;
        "
        >高级搜索 ﹀</view
      >
    </view>
    <!-- 高级搜索 -->
    <view
      class="advancedSeaTrue"
      v-if="isAdvancedSearch"
      style="padding: 0 1.24rem; margin-bottom: 0.18rem"
    >
      <view style="background-color: #fff; padding: 0.29rem" class="">
        <h3>高级搜索</h3>
        <MyForm @submit="onSubmit" :from="from" />
      </view>
    </view>
  </view>
</template>

<script>
    import MyForm from '@/components/form/form.vue'
    export default {
        props: {
            isAvancedTrue: {
                type: Boolean,
                default () {
                    return true
                }
            },
            isSearchTrue: {
                type: Boolean,
                default () {
                    return true
                }
            },
            buttonText: {
                type: String,
                default () {
                    return '搜索'
                }
            },
            placehold: {
                type: String
            },
            from: {
                type: Object,
                default () {
                    return {
                        from: [{
                                type: 'input',
                                label: '姓名',
                                name: 'name',
                                value: ''
                            },
                            {
                                type: 'select',
                                label: '性别',
                                value: '',
                                name: 'sex',
                                options: [{
                                        label: '男',
                                        value: '男'
                                    },
                                    {
                                        label: '女',
                                        value: '女'
                                    }
                                ]
                            },
                            {
                                type: 'input',
                                label: '联系',
                                name: 'phone',
                                value: ''
                            },
                            {
                                type: 'input',
                                label: '证件',
                                name: 'idNumber',
                                value: ''
                            },
                            {
                                type: 'select',
                                label: '状态',
                                name: 'state',
                                value: '',
                                options: [{
                                        label: '未申请',
                                        value: '未申请'
                                    },
                                    {
                                        label: '已申请',
                                        value: '已申请'
                                    },
                                    {
                                        label: '已删除',
                                        value: '已删除'
                                    }
                                ]
                            }
                        ]
                    }
                }
            }
        },
        components: {
            MyForm
        },
        name: "advancedSearch",
        data() {
            return {
                // 高级搜索显示
                isAdvancedSearch: false,
                // 高级搜索
				
import MyForm from "@/components/form/form.vue";
export default {
  props: {
    isAvancedTrue: {
      type: Boolean,
      default() {
        return true;
      }
    },
    isSearchTrue: {
      type: Boolean,
      default() {
        return true;
      }
    },
    buttonText: {
      type: String,
      default() {
        return "搜索";
      }
    },
    placehold: {
      type: String
    },
    keyword: {
      type: String
    },
    from: {
      type: Object,
      default() {
        return {
          from: [
            {
              type: "input",
              label: "姓名",
              name: "name",
              value: ""
            },
            {
              type: "select",
              label: "性别",
              value: "",
              name: "sex",
              options: [
                {
                  label: "男",
                  value: "男"
                },
                {
                  label: "女",
                  value: "女"
                }
              ]
            },
            {
              type: "input",
              label: "联系",
              name: "phone",
              value: ""
            },
            {
              type: "input",
              label: "证件",
              name: "idNumber",
              value: ""
            },
            {
              type: "select",
              label: "状态",
              name: "state",
              value: "",
              options: [
                {
                  label: "未申请",
                  value: "未申请"
                },
                {
                  label: "已申请",
                  value: "已申请"
                },
                {
                  label: "已删除",
                  value: "已删除"
                }
              ]
            }
          ]
        };
      }
    }
  },
  components: {
    MyForm
  },
  name: "advancedSearch",
  data() {
    return {
      // 高级搜索显示
      isAdvancedSearch: false
      // 高级搜索
    };
  },
  methods: {
    isAvancedClick() {
      this.isAdvancedSearch = !this.isAdvancedSearch;
      //     this.$nextTick(() => {

            };
        },
        methods: {
            isAvancedClick() {
                this.isAdvancedSearch = !this.isAdvancedSearch
                //     this.$nextTick(() => {

                //         var box1Height = document.querySelector('.fbox').offsetHeight;
                //         // let box2Height= document.querySelector('.fbox1').style.height = box1Height + 'px';
                //         let box2Height = document.querySelector('.fbox1').offsetHeight
                //         console.log(box1Height, box2Height);
                //         if (box1Height <= box2Height) {
                //             document.querySelector('.fbox1').style.height = box1Height + 'px';
                //         }
                //     })
            },
            onSearch(val) {
                this.$emit('onSearch', val)
                // console.log(val);
            },
            onSubmit(val) {
                this.$emit('onSubmit', val)
                // console.log(val);
            },
        }
    }
      //         var box1Height = document.querySelector('.fbox').offsetHeight;
      //         // let box2Height= document.querySelector('.fbox1').style.height = box1Height + 'px';
      //         let box2Height = document.querySelector('.fbox1').offsetHeight
      //         console.log(box1Height, box2Height);
      //         if (box1Height <= box2Height) {
      //             document.querySelector('.fbox1').style.height = box1Height + 'px';
      //         }
      //     })
    },
    onSearch(val) {
      this.$emit("onSearch", val);
    },
    onSubmit(val) {
      this.$emit("onSubmit", val);
      // console.log(val);
    }
  }
};
</script>

<style>
    .advancedSeaTrue,
    .zhushuju {
        padding: 0 1.24rem !important;
    }
.advancedSeaTrue,
.zhushuju {
  padding: 0 1.24rem !important;
}

    .advancedSeaTrue1 {
        padding: .08rem .19rem !important;
        font-size: .14rem !important;
    }
.advancedSeaTrue1 {
  padding: 0.08rem 0.19rem !important;
  font-size: 0.14rem !important;
}

    /* Form组件里面的样式 */
    ::v-deep .el-row {
        display: flex;
        flex-wrap: wrap;
        margin-top: .1rem !important;
    }
/* Form组件里面的样式 */
::v-deep .el-row {
  display: flex;
  flex-wrap: wrap;
  margin-top: 0.1rem !important;
}

    ::v-deep .el-form-item {
        display: flex !important;
        flex-wrap: wrap !important;
        margin-bottom: .18rem !important;
    }
::v-deep .el-form-item {
  display: flex !important;
  flex-wrap: wrap !important;
  margin-bottom: 0.18rem !important;
}

    ::v-deep .el-form-item__label {
        font-size: .14rem !important;
        height: .3rem !important;
        display: flex !important;
        align-items: center !important;
    }
::v-deep .el-form-item__label {
  font-size: 0.14rem !important;
  height: 0.3rem !important;
  display: flex !important;
  align-items: center !important;
}

    ::v-deep .el-input__inner {
        font-size: .14rem !important;
        height: .3rem !important;
    }
::v-deep .el-input__inner {
  font-size: 0.14rem !important;
  height: 0.3rem !important;
}

    ::v-deep .Formbtn {
        width: 100% !important;
        display: flex;
        justify-content: center;
        align-items: center;
::v-deep .Formbtn {
  width: 100% !important;
  display: flex;
  justify-content: center;
  align-items: center;

        .el-button {
            width: .7rem !important;
            height: .3rem !important;
            font-size: .12rem;
  .el-button {
    width: 0.7rem !important;
    height: 0.3rem !important;
    font-size: 0.12rem;
  }
}

        }
    }

    .search_bar {
        width: 5rem;
        height: .36rem;
    }
</style>
.search_bar {
  width: 5rem;
  height: 0.36rem;
}
</style>

 src/components/headNav/headNav.vue

@@ -1,6 +1,6 @@
<template>
  <view class="headNav">
    <view class="NavTop flex" :style="{ backgroundImage: 'url(' + bg + ')' }">
    <view class="NavTop flex" :style="{ backgroundImage: 'url(' + bg + ')' }" >
      <view
        class="santiaogang"
        style="width: 0.34rem; height: 0.34rem; margin-right: 3rem;cursor: pointer;"
@@ -163,7 +163,7 @@
    bg1: {
      type: String,
      default() {
        return "/static/image/line.png";
        return "@/static/image/line.png";
      }
    },
    idIndex: {
@@ -284,7 +284,7 @@
        });
      } else if (index === "1") {
        uni.navigateTo({
          url: "/pages/characterRelation/characterRelation?id=" + 1
          url: "/pages/character/index?id=" + 1
        });
      } else if (index === "2") {
        uni.navigateTo({
@@ -377,8 +377,7 @@
}

.NavTop {
  /* background: url(@/static/image/topBg.png); */

  /* background-image: url("../../static/image/topBg.png"); */
  background-size: 100% 100%;
  padding: 0.16rem 0.24rem;
  color: #fff !important;

 src/pages.json

@@ -2,11 +2,28 @@
    "pages": [{
            "path": "pages/index/index",
            "style": {
                // "navigationBarTitleText": "uni-app",
                // "navigationBarTitleText": "中国医学人物数据库",
                "navigationStyle": "custom"
            }
        }, {
            "path": "pages/Login/Login",
            "style": {
                "navigationBarTitleText": "",
                "enablePullDownRefresh": false,
                "navigationStyle": "custom"
            }
        },
        // 人物数据库
        {
            "path": "pages/character/index",
            "style": {
                "navigationBarTitleText": "",
                "enablePullDownRefresh": false,
                "navigationStyle": "custom"
            }
        },
        {
            "path": "pages/character/detail",
            "style": {
                "navigationBarTitleText": "",
                "enablePullDownRefresh": false,
@@ -53,14 +70,7 @@
                "navigationStyle": "custom"
            }
        },
        {
            "path": "pages/repository/repository",
            "style": {
                "navigationBarTitleText": "",
                "enablePullDownRefresh": false,
                "navigationStyle": "custom"
            }
        },
		
        {
            "path": "pages/inherit/index",
            "style": {
@@ -85,14 +95,7 @@
                "navigationStyle": "custom"
            }
        },
        {
            "path": "pages/characterRelation/characterRelation",
            "style": {
                "navigationBarTitleText": "",
                "enablePullDownRefresh": false,
                "navigationStyle": "custom"
            }
        },
		
        {
            "path": "pages/characterMap/characterMap",
            "style": {
@@ -165,7 +168,7 @@
    ],
    "globalStyle": {
        "navigationBarTextStyle": "black",
        "navigationBarTitleText": "uni-app",
        "navigationBarTitleText": "中国医学人物数据库",
        "navigationBarBackgroundColor": "#F8F8F8",
        "backgroundColor": "#F8F8F8"
    }

 src/pages/Login/Login.vue

@@ -222,12 +222,12 @@
                // uni.setStorageSync('globalData', { id: 123, name: 'example' });
                if (item.id == 1) {
                    uni.navigateTo({
                        url: '/pages/repository/repository?id=' + item.id
                        url: '/pages/character/detail?id=' + item.id
                    })
                } else if (item.id == 2) {
                    console.log(item.name);
                    // uni.navigateTo({
                    //     url:'/pages/repository/repository?id='+item.id
                    //     url:'/pages/character/detail?id='+item.id
                    // })
                } else if (item.id == 3) {
                    uni.navigateTo({

 src/pages/TcmSystem/TcmSystem.vue

@@ -236,7 +236,7 @@
                // 机构和职官的类型 取值：OFFICIAL->职官 INSTITUTION->机构 ALL->职官、机构
                classifyType: 'ALL',
                // 机构和职官的id
                classifyId: 0,
                classifyId: "",
                // 职官统计
                officials: {
                    title: '职官统计',
@@ -357,8 +357,8 @@
            // 右侧的list数据 
            async getMList(obj) {
                let Obj = {
                    medicalSearchType: "ALL",
                    "type": this.classifyType, //查询类型 取值：OFFICIAL->职官 INSTITUTION->机构 ALL->职官、机构
                    "bookId": this.source.index, // 点击来源查询数据时，带上此参数
                    "name": this.SearchValue, //搜索框检索
                    "dynastyId": this.classifyId, //点击朝代查询数据时，带上此参数
                    "sort": this.rankVal, //排序方式 取值：CREATE创建时间，NAME名称

 src/pages/character/detail.vue

New file
@@ -0,0 +1,1100 @@
<template>
  <view class="relative">
    <headNav :idIndex="1" text="中医人物数据库" />
    <view class="Midde flex">
      <el-button class="MiddeBack flex flex-center" @click="goBack"
        >返回</el-button
      >
      <view style="width: 70%" class="flex flex-center flex-column">
        <view style="font-weight: bold; font-size: 0.2rem">李时珍</view>
        <ul class="flex" style="line-height: 1.2; margin: 0.15rem 0">
          <li
            v-for="item in 4"
            style="
              background-color: #fff;
              padding: 0 0.08rem;
              border: 0.01rem solid #000;
              border-radius: 0.1rem;
              font-size: 0.12rem;
              text-align: center;
              margin-right: 0.15rem;
            "
          >
            VSDS
          </li>
        </ul>
        <view
          class="fz font-family"
          style="
            font-size: 0.13rem;
            font-weight: normal;
            line-height: 0.2rem;
            letter-spacing: 0.03rem;
          "
        >
          李时珍(1518年-1593年)，字:
          东璧，时人谓之:李东璧。号濒湖，晚年自号濒湖山人，湖北薪州(今湖北省黄冈市薪春县薪州镇)人，汉族，生于明武宗正德十三年(公元1518年)，卒于神宗万历二十二年(公元1593年)。是中国明代与万密斋齐名的医学家、药物学家、博物学家、著述家。李时珍对道家医学的继承是多方面的，曾参考历代有关医药及其学术书籍八百余种，结合自身经验和调查研究，历时27年编成《本草纲目》一书，是我国古代药物学的总结性巨著，在国内外均有很高的评价，已有几种文字的译本或节译本，其著有《濒湖脉学》
        </view>
        <view class="flex" style="width: 100%; margin: 0.25rem 0 0.15rem 0">
          <view>
            <!-- <el-button style="padding: 10rpx;" size="mini" icon="el-icon-folder-add">收藏</el-button> -->
            <el-button style="padding: 0.05rem 0.085rem" class="yinyong flex">
              <img src="@/static/image/yinyong.png" alt="" />引用</el-button
            >
          </view>
          <view
            style="font-size: 0.12rem; color: #244a7b; cursor: pointer"
            @click="ProfileClick"
            >阅读更多></view
          >
        </view>
      </view>
      <view style="width: 5%"></view>
    </view>
    <el-row style="padding: 0 1.2rem 0; padding-top: 0.24rem">
      <!-- 左侧 -->
      <el-col
        :span="5"
        class="BoxLeft"
        style="padding-right: 0.2rem; width: 2.8rem"
      >
        <div class="grid-content bg-purple-dark flex flex-column">
          <el-card class="box-card" style="width: 100%; height: 2.06rem">
            <div
              class="clearfix flex"
              style="
                font-weight: 900;
                font-size: 0.14rem;
                padding-bottom: 0.1rem;
              "
            >
              <span
                style="
                  margin-left: 0.12rem;
                  font-size: 0.14rem;
                  font-weight: 900;
                "
                >关系图谱</span
              >
              <!-- <el-button icon="el-icon-rank" style="float: right; padding: 3px 0;" type="text"></el-button> -->
              <img
                src="@/static/image/fangda.png"
                @click="fangdaClick(1)"
                style="width: 0.18rem; height: 0.18rem"
                alt=""
              />
            </div>
            <view id="relation" style="height: 1.51rem; width: 100%"></view>
          </el-card>
          <el-card
            class="box-card"
            style="width: 100%; height: 2.06rem; margin: 0.26rem 0"
          >
            <div
              class="clearfix flex"
              style="
                font-weight: 900;
                font-size: 0.14rem;
                padding-bottom: 0.1rem;
              "
            >
              <span>时空地图</span>
              <!-- <el-button icon="el-icon-rank" style="float: right; padding: 3px 0" type="text"></el-button> -->
              <img
                src="@/static/image/fangda.png"
                @click="fangdaClick(2)"
                style="width: 0.18rem; height: 0.18rem"
                alt=""
              />
            </div>
            <view
              id="spaceTime"
              style="height: 1.51rem; width: 100%; position: relative"
            ></view>
          </el-card>
          <el-card style="width: 100%; height: 2.06rem">
            <div
              class="clearfix"
              style="
                font-weight: 900;
                font-size: 0.14rem;
                padding-bottom: 0.1rem;
              "
            >
              <span>来源</span>
            </div>
            <ul
              class="font-family"
              style="height: 300rpx; font-size: 0.12rem; line-height: 0.3rem"
            >
              <li>1.《明史·卷二百九十九·列作品. p52</li>
              <li>2.《进(本草纲目)疏》 p52</li>
            </ul>
          </el-card>
        </div>
      </el-col>
      <!-- 右侧 -->
      <el-col :span="18" class="BoxRight">
        <div class="grid-content bg-purple-dark" style="width: 100%">
          <el-card class="box-card" style="padding: 0">
            <div
              class="clearfix"
              style="
                font-weight: 900;
                font-size: 0.14rem;
                padding-bottom: 0.1rem;
              "
            >
              <span>基础信息</span>
            </div>
            <!-- 基础信息  -->
            <cc-defineTable :tableData="tableArr"></cc-defineTable>
          </el-card>
          <el-card
            class="box-card"
            style="min-height: 1.91rem; margin: 0.2rem 0"
          >
            <el-tabs ref="tabs" v-model="activeName" @tab-click="handleClick">
              <el-tab-pane label="代表著作" data-id="1" name="representative">
                <Table1 :data="tableData" :columns="tableColumns" />
              </el-tab-pane>
              <el-tab-pane label="亲属关系" data-id="2" name="family ">
                亲属关系
              </el-tab-pane>
              <el-tab-pane label="师承关系" data-id="3" name="mentoring "
                >师承关系</el-tab-pane
              >
              <el-tab-pane label="社会关系" data-id="4" name="society"
                >社会关系</el-tab-pane
              >
              <el-tab-pane label="活动年谱" data-id="5" name="activity"
                >活动年谱</el-tab-pane
              >
            </el-tabs>
          </el-card>
          <el-card style="margin-bottom: 0.2rem">
            <div
              class="clearfix"
              style="
                font-weight: 900;
                font-size: 0.14rem;
                padding-bottom: 0.1rem;
              "
            >
              <span>相关附表/图像</span>
            </div>
            <view class="flex">
              <el-image
                v-for="item in 4"
                :key="item"
                style="width: 2.05rem; height: 1.4rem"
                src="https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg"
                fit="fill"
              ></el-image>
            </view>
          </el-card>
          <el-card class="box-card">
            <div
              class="clearfix"
              style="
                font-weight: 900;
                font-size: 0.14rem;
                padding-bottom: 0.1rem;
              "
            >
              <span>相关附表/图像</span>
            </div>
            <ul class="font-family" style="font-size: 0.13rem; line-height: 2">
              <li>
                [1|刘炜,谢蓉,张磊,等.向人文研究的国家数据基础设施建设[J|.中国图书馆学报,2016,42(5):29-39.
              </li>
              <li>
                [2|周晨.国际数字人文研究特征与知识结构|J图书馆论坛2017.37(4):1-8.
              </li>
              <li>
                [3]傅德华,于翠艳,李春博,关于创建“20
                世纪中国人物传记资料全文数据库治的构想[川,中国者引,2009,714):24-26.
              </li>
              <li>
                [4|于翠艳,傅德华,李春博,关于“20世纪中国人物传记资料全文数据库治的进展与困惑[J1.中国常引,2012.10111:20-22
              </li>
              <li>
                [5]贾武。《湖南近代人物数据率》资源收录范围研究|J河南图书馆学利,2015,35(7):126.127.140.
              </li>
            </ul>
          </el-card>
        </div>
      </el-col>
    </el-row>

    <!-- 返回顶部 -->
    <el-col style="position: absolute; bottom: 1rem; left: 1.2rem">
      <el-button
        style="width: 0.5rem; height: 0.5rem; font-size: 0.3rem"
        icon="el-icon-top"
        circle
        @click="scrollToTop"
      ></el-button>
    </el-col>
    <!-- 个人小传 -->
    <el-dialog :visible.sync="isProfile" :modal-append-to-body="false">
      <view class="ProfileNav flex flex-center"> 个人小传 </view>
      <view style="padding: 0.44rem 0.3rem; min-height: 7.32rem">
        <view
          style="
            margin-bottom: 0.2rem;
            background-color: #f0f0f0;
            padding: 0.18rem 0.1rem 0.1rem 0.27rem;
            font-size: 0.12rem;
            line-height: 0.24rem;
            font-weight: 400;
          "
        >
          <view style="color: #2c2c2c">
            蕙展丁丑同里日岩额序先考月池翁著《四彭酸明》八卷，皆精指奥室，茂犀未能疯造，珍因撮粹想菜，僵撰此唐，以便智睛，服指南。世之雷病雨家，咸以服焉首务，不知派乃四能之末，谓之巧者雨。上士欲舍其全，非四不可。
          </view>
          <view class="flex">
            <view></view>
            <view style="font-weight: 700; color: #2c2c2c"
              >——《奇八服考》P 3</view
            >
          </view>
        </view>
      </view>
    </el-dialog>
  </view>
</template>

<script>
import * as echarts from "echarts";
import "echarts/extension/bmap/bmap";
import { loadBMap } from "@/static/map.js";
import Table1 from "@/components/table1/table1.vue";
import {
  getPersonInfo,
  getSource,
  getPersonImages,
  getPersonBiog,
  getPersonWritings,
  getPersonRelationAtSchool,
  getSpaceTime
} from "@/api/index.js";
export default {
  components: {
    Table1
  },
  data() {
    return {
      // 标题顶部栏需要的东西
      detailId: "",
      detailInfo: {},
      sourceDataList: [],
      imageList: [],
      biogData: "",
      writingsList: [],
      relationshipData: [],
      // -------
      // 小传
      isProfile: false,
      // 关系图谱
      activeName: "representative",
      // 基础信息
      tableArr: [
        {
          list: [
            {
              name: "别名",
              value: "李东璧、药圣、李三七"
            },
            {
              name: "字",
              value: "东璧"
            },
            {
              name: "号",
              value: "频湖山人"
            },
            {
              name: "所处时期",
              value: "明朝"
            },
            {
              name: "民族",
              value: "166g"
            }
          ]
        },
        {
          list: [
            {
              name: "籍贯",
              value: "黄州府薪州 (今湖北省薪春县)"
            },
            {
              name: "性别",
              value: "男"
            },
            {
              name: "职官",
              value: "太医院判"
            },
            {
              name: "流派",
              value: "医经学派"
            },
            {
              name: "学术特点",
              value: "考古证今、穷究物理"
            }
          ]
        }
      ],
      // 代表著作
      tableColumns: [
        {
          prop: "worksName",
          label: "作品名"
        },
        {
          prop: "works",
          label: "作品"
        },
        {
          prop: "literature",
          label: "文献关系"
        },
        {
          prop: "epoch",
          label: "著作时代"
        },
        {
          prop: "category",
          label: "类别"
        }
        // { type: 'button', action: 'edit', label: 'Edit' }
      ],
      tableData: [
        {
          worksName: "本草纲目",
          works: "李二牛",
          literature: "作者",
          epoch: "现代",
          category: "中医学",
          id: 1
        },
        {
          worksName: "本草纲目",
          works: "李二牛",
          literature: "作者",
          epoch: "现代",
          category: "中医学",
          id: 1
        }
      ]
    };
  },
  onLoad(options) {
    this.detailId = options.id;
  },
  mounted() {
    // 获取人物详情
    // this.getData();
    // 获取来源
    // this.getSourceData();
    // 获取相关图表
    // this.getImages();
    // 获取个人事迹
    // this.getBiog();
    // 获取著作
    // this.getWritings();
    // 获取人物关系
    // this.getRelationship();
    // 获取时空地图
    // this.getMapInfo();
    // 关系图谱
    this.relation();
    // 时空地图
    loadBMap("5USVDAhhS4ssz44HLq3gNPZai7naXf4Q").then(() => {
      this.spaceTime();
    });
    this.$nextTick(() => {
      // 获取第一个选项卡的 DOM 元素
      const firstTab = this.$refs.tabs.$el.querySelector(
        ".el-tabs__active-bar"
      );
      firstTab.style.transform = "translateX(" + "-.2rem" + ")";
    });

    // 监听窗口大小变化
    window.addEventListener("resize", this.relation);
  },
  methods: {
    getData() {
      getPersonInfo({
        id: this.detailId
      }).then((res) => {
        console.log(res);
        this.detailInfo = res;
      });
    },
    getSourceData() {
      getSource({
        personId: this.detailId
      }).then((res) => {
        console.log(res);
        this.sourceDataList = res;
      });
    },
    getImages() {
      getPersonImages({
        personId: this.detailId
      }).then((res) => {
        console.log(res);
        this.imageList = res;
      });
    },
    getBiog() {
      getPersonBiog({
        personId: this.detailId
      }).then((res) => {
        console.log(res);
        this.biogData = res;
      });
    },
    getWritings() {
      getPersonWritings({
        personId: this.detailId
      }).then((res) => {
        console.log(res);
        this.writingsList = res;
      });
    },
    getRelationship() {
      getPersonRelationAtSchool({
        personId: this.detailId
      }).then((res) => {
        console.log(res);
        this.relationshipData = res;
      });
    },
    getMapInfo() {
      getSpaceTime({
        personId: this.detailId
      }).then((res) => {
        console.log(res);
      });
    },

    // 放大地图跳转
    fangdaClick(index) {
      if (index == 1) {
        uni.navigateTo({
          url: "/pages/character/index"
        });
      } else if (index == 2) {
        uni.navigateTo({
          url: "/pages/characterMap/characterMap"
        });
      }
    },
    // 小传
    ProfileClick() {
      this.isProfile = !this.isProfile;
    },
    // 返回上一页
    goBack() {
      this.$router.go(-1);
    },
    // 返回顶部
    scrollToTop() {
      window.scrollTo({
        top: 0,
        behavior: "smooth" // 使用平滑滚动
      });
    },
    handleClick(tab) {
      let index = tab.$attrs["data-id"] - 1;
      this.$nextTick(() => {
        let firstTab = this.$refs.tabs.$el.querySelector(
          ".el-tabs__active-bar"
        );
        if (index == 0) {
          firstTab.style.transform = "translateX(-" + 0.2 + "rem)";
        } else if (index == 1) {
          firstTab.style.transform = "translateX(" + 0.85 * index + "rem)";
        } else if (index == 2) {
          firstTab.style.transform = "translateX(" + 0.93 * index + "rem)";
        } else if (index == 3) {
          firstTab.style.transform = "translateX(" + 0.95 * index + "rem)";
        } else if (index == 4) {
          firstTab.style.transform = "translateX(" + 0.97 * index + "rem)";
        } else {
          let firstTab = this.$refs.tabs.$el.querySelector(
            ".el-tabs__active-bar"
          );
          firstTab.style.transform = "translateX(" + "-.2" + "rem)";
        }
      });
    },
    // 关系图谱
    relation() {
      var chartDom = document.getElementById("relation");
      var myChart = echarts.init(chartDom);

      // 假设您有节点名称和它们之间的关系数据
      var nodes = ["李时珍", "成就", "传承", "亲友", "著作"];
      var relationships = [
        {
          source: "李时珍",
          target: "成就"
        },
        {
          source: "李时珍",
          target: "传承"
        },
        {
          source: "李时珍",
          target: "亲友"
        },
        {
          source: "李时珍",
          target: "著作"
        }
        // 其他关系...
      ];

      // 根据关系数据生成连接线
      var links = [];
      relationships.forEach(function (relationship) {
        var sourceIndex = nodes.indexOf(relationship.source);
        var targetIndex = nodes.indexOf(relationship.target);
        if (sourceIndex !== -1 && targetIndex !== -1) {
          links.push({
            source: sourceIndex,
            target: targetIndex
          });
        }
      });
      let FontSize = 12; // 字体大小
      let BorderWidth = 2; // 边框大小
      let SymbolSize = 80; // 尺寸距离
      // 不同尺寸下修改echarts的字体
      if (window.innerWidth > 2560 && window.innerWidth <= 3840) {
        FontSize = 28;
        BorderWidth = 5;
        SymbolSize = 100;
      } else if (window.innerWidth > 1920 && window.innerWidth <= 2560) {
        FontSize = 28;
        BorderWidth = 4;
        SymbolSize = 90;
      } else if (window.innerWidth >= 1366 && window.innerWidth <= 1920) {
        FontSize = 18;
        BorderWidth = 4;
        SymbolSize = 70;
      }
      // 根据nodes动态生成节点数据
      var nodeData = nodes.map(function (node, index) {
        return {
          name: node,
          x: Math.random() * 1000, // 设置随机x坐标位置
          y: Math.random() * 600, // 设置随机y坐标位置
          itemStyle: {
            color: getColorByIndex(index), // 可以根据索引设置不同的颜色
            borderWidth: BorderWidth,
            borderColor: getColorByIndex(index + 1)
          }
        };
      });
      // 设置颜色
      function getColorByIndex(index) {
        var colors = ["#ecf4ff", "#dd9795", "#f1edbe", "#ecf4ff", "#c5dbd8"]; // 可以根据实际情况设置颜色数组
        return colors[index % colors.length];
      }

      var option;
      option = {
        tooltip: {},
        animationDurationUpdate: 1500,
        animationEasingUpdate: "quinticInOut",
        series: [
          {
            type: "graph",
            layout: "none",
            symbolSize: SymbolSize, // 调整节点大小
            label: {
              show: true,
              color: "black", // 设置节点文字颜色为黑色
              fontSize: FontSize // 设置文字大小
            },
            edgeSymbol: ["circle"],
            edgeSymbolSize: [4, 10],
            edgeLabel: {
              fontSize: 40
            },
            data: nodeData,
            links: [
              {
                source: 0,
                target: 1,
                symbolSize: [5, 20]
              },
              {
                source: "Node 2",
                target: "Node 1"
              },
              {
                source: "Node 1",
                target: "Node 3"
              },
              {
                source: "Node 2",
                target: "Node 3"
              },
              {
                source: "Node 2",
                target: "Node 4"
              },
              {
                source: "Node 1",
                target: "Node 4"
              }
            ],
            lineStyle: {
              opacity: 0.9,
              width: 2,
              curveness: 0
            }
          }
        ]
      };

      // 将生成的连接线添加到echarts图表的option中
      option.series[0].links = links;
      option && myChart.setOption(option);
    },
    // 时空地图
    spaceTime() {
      var chartDom = document.getElementById("spaceTime");
      var myChart = echarts.init(chartDom);
      var option;

      const data = [
        {
          name: "海门",
          value: 9
        },
        {
          name: "金昌",
          value: 19
        },
        {
          name: "泉州",
          value: 21
        },
        {
          name: "衢州",
          value: 177
        },
        {
          name: "廊坊",
          value: 193
        },
        {
          name: "菏泽",
          value: 194
        },
        {
          name: "合肥",
          value: 229
        },
        {
          name: "武汉",
          value: 273
        },
        {
          name: "大庆",
          value: 279
        }
      ];
      const geoCoordMap = {
        海门: [121.15, 31.89],
        鄂尔多斯: [109.781327, 39.608266],
        招远: [120.38, 37.35],
        平顶山: [113.29, 33.75],
        邢台: [114.48, 37.05],
        德州: [116.29, 37.45],
        济宁: [116.59, 35.38],
        荆州: [112.239741, 30.335165],
        宜昌: [111.3, 30.7],
        义乌: [120.06, 29.32],
        丽水: [119.92, 28.45],
        洛阳: [112.44, 34.7],
        秦皇岛: [119.57, 39.95],
        株洲: [113.16, 27.83],
        石家庄: [114.48, 38.03],
        莱芜: [117.67, 36.19],
        常德: [111.69, 29.05],
        保定: [115.48, 38.85],
        湘潭: [112.91, 27.87],
        金华: [119.64, 29.12],
        岳阳: [113.09, 29.37],
        长沙: [113, 28.21],
        衢州: [118.88, 28.97],
        廊坊: [116.7, 39.53],
        菏泽: [115.480656, 35.23375],
        合肥: [117.27, 31.86],
        武汉: [114.31, 30.52],
        大庆: [125.03, 46.58]
      };
      const convertData = function (data) {
        var res = [];
        for (var i = 0; i < data.length; i++) {
          var geoCoord = geoCoordMap[data[i].name];
          if (geoCoord) {
            res.push({
              name: data[i].name,
              value: geoCoord.concat(data[i].value)
            });
          }
        }
        return res;
      };
      option = {
        tooltip: {
          trigger: "item"
        },
        bmap: {
          center: [104.114129, 37.550339],
          zoom: 1,
          roam: true,
          mapStyle: {
            styleJson: [
              {
                featureType: "water",
                elementType: "all",
                stylers: {
                  color: "#d1d1d1"
                }
              },
              {
                featureType: "land",
                elementType: "all",
                stylers: {
                  color: "#f3f3f3"
                }
              },
              {
                featureType: "manmade",
                elementType: "all",
                stylers: {
                  color: "#d1d1d1"
                }
              },
              {
                featureType: "local",
                elementType: "all",
                stylers: {
                  color: "#d1d1d1"
                }
              },
              {
                featureType: "arterial",
                elementType: "labels",
                stylers: {
                  visibility: "off"
                }
              },
              {
                featureType: "boundary",
                elementType: "all",
                stylers: {
                  color: "#fefefe"
                }
              },
              {
                featureType: "building",
                elementType: "all",
                stylers: {
                  color: "#d1d1d1"
                }
              },
              {
                featureType: "label",
                elementType: "labels.text.fill",
                stylers: {
                  color: "#999999"
                }
              }
            ]
          }
        },
        series: [
          {
            name: "pm2.5",
            type: "scatter",
            coordinateSystem: "bmap",
            data: convertData(data),
            symbolSize: function (val) {
              return val[2] / 10;
            },
            encode: {
              value: 2
            },
            credits: {
              enabled: false
            },
            label: {
              formatter: "{b}",
              position: "right",
              show: false
            },
            emphasis: {
              label: {
                show: true
              }
            }
          },
          {
            name: "Top 5",
            type: "effectScatter",
            coordinateSystem: "bmap",
            data: convertData(
              data
                .sort(function (a, b) {
                  return b.value - a.value;
                })
                .slice(0, 6)
            ),
            symbolSize: function (val) {
              return val[2] / 10;
            },
            encode: {
              value: 2
            },
            showEffectOn: "render",
            rippleEffect: {
              brushType: "stroke"
            },
            label: {
              formatter: "{b}",
              position: "right",
              show: true
            },
            itemStyle: {
              shadowBlur: 10,
              shadowColor: "#333"
            },
            emphasis: {
              scale: true
            },
            zlevel: 1
          }
        ]
      };

      option && myChart.setOption(option);
    }
  }
};
</script>

<style>
/* Table1表格里面的数据 */
::v-deep .is-leaf {
  .cell {
    font-size: 0.14rem !important;
    height: 0.4rem !important;
    line-height: 0.4rem !important;
  }
}

::v-deep .el-table__body {
  .cell {
    font-size: 0.14rem !important;
    height: 0.4rem !important;
    line-height: 0.4rem !important;
  }
}

/* --------------- */
@media screen and (min-width: 2560px) and (max-width: 3840px) {
}

.BoxLeft ::v-deep.el-card__body {
  padding: 0.1rem 0.11rem !important;
}

::v-deep .el-tabs__content {
  line-height: 1;
}

/* 个人小传 ------------------*/
::v-deep .el-dialog__header {
  display: none;
}

::v-deep .el-dialog__body {
  padding: 0;
}

::v-deep .el-dialog__wrapper {
  z-index: 999999999999999 !important;
}

.ProfileNav {
  width: 100%;
  height: 0.7rem;
  background: url(@/static/image/ProfileBg.png);
  background-size: 100% 100%;
  font-size: 0.24rem;
  color: #2c2c2c;
  font-weight: bold;
}

/* ------------------- */

img {
  width: 100%;
  height: 100%;
}

* {
  box-sizing: border-box;
}

.NavTop {
  background-color: #0c274c;
  padding: 15rpx 25rpx;
  color: #fff !important;

  img {
    width: 30rpx;
    height: 30rpx;
    vertical-align: middle;
  }

  .NavTopr {
    img {
      margin-right: 10rpx;
    }
  }
}

.mImage {
  width: 100%;
  height: 30rpx;

  img {
    vertical-align: top;
  }
}

.Midde {
  /* background-color: #dbeafd; */
  background-image: url(@/static/image/yongBg.png);
  background-size: 100% 100%;
  color: #000;
  align-items: flex-start;
  padding: 0.18rem 0.24rem;

  view {
    color: #000;
  }

  .MiddeBack {
    width: 0.6rem;
    height: 0.24rem;
    font-size: 0.12rem;
    padding: 0;
    border: 1px solid #9e9e9e;
  }
}

.yinyong {
  font-size: 0.12rem;

  img {
    width: 0.12rem;
    height: 0.1rem;
    vertical-align: top;
    margin-right: 0.03rem;
  }
}

.el-dialog__wrapper {
  background: rgba(0, 0, 0, 0.3);
}

.fz {
  /* line-height: 1.3;
        height: 100rpx;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 4;
        -webkit-box-orient: vertical; */
  color: #2c2c2c;
}

::v-deep .el-card__body {
  padding: 0.1rem !important;
}

/* echart地图水印 */
::v-deep .BMap_cpyCtrl {
  display: none;
}

::v-deep .anchorBL {
  display: none;
}

::v-deep .el-tabs__nav-wrap::after {
  background-color: transparent;
}

::v-deep .el-tabs__nav {
  margin-bottom: 0.1rem !important;
}

::v-deep .el-tabs__nav-scroll {
  display: flex;
  justify-content: center;
}

::v-deep .el-tabs__item {
  width: 1rem;
  font-size: 0.14rem;
  line-height: 0.4rem;
  height: 0.4rem;
}

::v-deep .el-tabs__header {
  margin: 0 0 10rpx;
}

::v-deep .el-tabs__active-bar {
  /* 设置滚动条宽度 */
  width: 1rem !important;
  height: 0.03rem !important;
  background-color: #597aa5;
  transform: translateX(-20px);
  /* margin-top: .09rem; */
}

::v-deep .el-tabs__active-bar {
  top: 0.37rem !important;
}

::v-deep .el-table::before {
  background-color: #fff !important;
}

.BoxRight ::v-deep.el-card__body {
  padding: 0.2rem 0.14rem !important;
}

.BoxRight .box-card {
  margin-bottom: 0.2rem !important;
}
</style>

 src/pages/character/index.vue

New file
@@ -0,0 +1,585 @@
<template>
  <view>
    <headNav idIndex="1" text="中医人物数据库" />
    <!-- 高级搜索 -->
    <view style="margin: 0.35rem 0 0.16rem 0">
      <advancedSearch
        @onSearch="onSearch"
        @onSubmit="onSubmit"
        :from="From"
        placehold="请输入关键字"
        :keyword="searchKey"
      />
    </view>
    <!-- 热门搜索 -->
    <view class="flex flex-center hotSearch">
      热门搜索：
      <ul class="flex" style="margin-right: 10rpx">
        <li
          @click="onSearch({ text: item })"
          class="cursor"
          v-for="item in hotKeyList"
          :key="item"
        >
          {{ item }}
        </li>
      </ul>
    </view>
    <view class="" style="margin-left: 0.2rem">书中最常提到的100位人物</view>
    <!-- 关系表地图 -->
    <view
      id="relation"
      style="margin-top: 0.2rem; height: 70vh; width: 100%"
    ></view>
    <!-- 朝代 -->
    <view
      class="flex flex-center"
      style="width: 100%; position: fixed; bottom: 0.33rem; left: 0"
    >
      <ul class="flex">
        <li
          @click="dynastyBottomClick(item)"
          v-for="(item, index) in dynasty"
          :key="item.id"
        >
          <view
            class="flex flex-center"
            style="height: 0.35rem; background-color: #fff; color: #244a7b"
          >
            {{ item.coord }}
          </view>
          <view
            class="flex flex-center font-family"
            style="
              padding: 0.05rem 0.19rem;
              height: 0.3rem;
              line-height: 0.3rem;
              color: #fff;
              font-size: 0.14rem;
              margin-top: 0.03rem;
              margin-right: 0.03rem;
              background-color: #597aa5;
            "
            :style="{
              marginRight: index === dynasty.length - 1 ? '0' : '0.03rem',
              background: dynastyColor == item.id ? '#244A7B' : '#597AA5'
            }"
          >
            {{ item.name }}
          </view>
        </li>
      </ul>
    </view>
  </view>
</template>

<script>
import {
  getPersonList,
  getDataStatistics,
  getHotSearch,
  getFuzzySearch,
  getAdvanceSearch,
  getPDataStatistics
} from "@/api/index.js";
import * as echarts from "echarts";
export default {
  data() {
    return {
      // echarts数据
      nodes: [],
      // echarts两者的关系
      relationships: [],
      // 高级搜索
      From: {
        from: [
          {
            type: "input",
            label: "姓名",
            name: "name",
            value: ""
          },
          {
            type: "input",
            label: "别名",
            name: "alias",
            value: ""
          },
          {
            type: "input",
            label: "籍贯",
            name: "location",
            value: ""
          },
          {
            type: "select",
            label: "职业",
            name: "sdId",
            value: "",
            options: [
              {
                label: "未指明",
                value: "UNKNOWN"
              }
            ]
          },
          {
            type: "input",
            label: "官职",
            name: "office",
            value: ""
          },
          {
            type: "select",
            label: "性别",
            value: "",
            name: "genderTypeEO",
            options: [
              {
                label: "未指明",
                value: "UNKNOWN"
              },
              {
                label: "男",
                value: "MALE"
              },
              {
                label: "女",
                value: "WOMAN"
              }
            ]
          },
          {
            type: "input",
            label: "时间",
            name: "period",
            value: ""
          },
          {
            type: "input",
            label: "机构",
            name: "inst",
            value: ""
          },
          {
            type: "number",
            label: "页码",
            name: "page",
            value: ""
          },
          {
            type: "number",
            label: "页大小",
            name: "pageSize",
            value: ""
          }
        ]
      },
      // 下面的朝代1
      dynastyColor: 1,
      // 朝代
      dynasty: [
        {
          name: "夏朝",
          coord: "2070BC",
          id: 1
        },
        {
          name: "商朝",
          id: 2,
          coord: "1600BC"
        },
        {
          name: "西周",
          id: 3,
          coord: "1600BC"
        },
        {
          name: "春秋战国",
          id: 4,
          coord: "770BC"
        },
        {
          name: "秦朝",
          id: 5,
          coord: "221BC"
        },
        {
          name: "汉朝",
          id: 6,
          coord: "202BC"
        },
        {
          name: "三国两晋南北朝",
          id: 7,
          coord: "184"
        },
        {
          name: "隋朝",
          id: 8,
          coord: "581"
        },
        {
          name: "唐朝",
          id: 9,
          coord: "618"
        },
        {
          name: "五代十国",
          id: 10,
          coord: "907"
        },
        {
          name: "辽夏金",
          id: 11,
          coord: "907"
        },
        {
          name: "宋朝",
          id: 12,
          coord: "960"
        },
        {
          name: "元朝",
          id: 13,
          coord: "1271"
        },

        {
          name: "明朝",
          id: 14,
          coord: "1368"
        },
        {
          name: "清朝",
          id: 15,
          coord: "1636"
        }
      ],
      // 热门搜索
      hotKeyList: [],
      searchKey: ""
    };
  },
  mounted() {
    this.getData();
    this.echartsArr();
    this.hotSearch();
    // 监听窗口大小变化
    // window.addEventListener("resize", this.relation);
    this.innt();
  },
  methods: {
    getData() {
      getPersonList({
        keywords: "楊", //搜索框检索
        name: "", //姓名
        alias: "", //别名
        nativePlace: "", //机关
        tagId: null, //职业id
        official: "", //职官
        genderType: null, //性别
        dynasty: null, //朝代名
        dynastyId: null, //朝代id
        institution: "", //机构
        bookId: null, //来源id
        page: 1,
        pageSize: 100
      }).then((res) => {
        console.log(res);
      });
    },
    // 关系图谱
    relation() {
      var chartDom = document.getElementById("relation");
      var myChart = echarts.init(chartDom);
      // 假设您有节点名称和它们之间的关系数据
      var nodes = this.nodes;
      var relationships = this.relationships;

      let FontSize = 12; // 字体大小
      let BorderWidth = 2; // 边框大小
      let SymbolSize = 80; // 尺寸距离
      let Distance = 10;
      // 不同尺寸下修改echarts的字体
      if (window.innerWidth > 2560 && window.innerWidth <= 3840) {
        FontSize = 28;
        BorderWidth = 5;
        SymbolSize = 100;
        Distance = 33;
      } else if (window.innerWidth > 1920 && window.innerWidth <= 2560) {
        FontSize = 28;
        BorderWidth = 4;
        SymbolSize = 90;
        Distance = 22;
      } else if (window.innerWidth >= 1366 && window.innerWidth <= 1920) {
        FontSize = 18;
        BorderWidth = 4;
        SymbolSize = 70;
        Distance = 22;
      }
      // 根据关系数据生成连接线
      var links = [];
      relationships.forEach((relationship, i) => {
        var sourceIndex = nodes.findIndex(
          (node) => node.name === relationship.source
        );
        var targetIndex = nodes.findIndex(
          (node) => node.name === relationship.target
        );
        if (relationship.relation) {
          if (sourceIndex !== -1 && targetIndex !== -1) {
            links.push({
              source: sourceIndex,
              target: targetIndex,
              label: {
                show: true,
                formatter: function (params) {
                  // 使用函数动态生成标签内容
                  // return relationships.find(rel => rel.source === nodes[params.data
                  //         .source] && rel.target === nodes[params.data.target])
                  //     .relation;
                  return relationship.relation;
                }, // 设置关系标签内容为"Child-Parent"
                color: "#2C2C2C",
                fontSize: FontSize - 2,
                backgroundColor: "rgba(255, 255, 255, 1)",
                padding: [3, 8],
                borderRadius: 30,
                position: "middle", // 设置标签文本在线的中间位置上居中显示
                // bottom: -(FontSize+10),
                z: 10, // 设置标签的z轴高度，使其比连接线更高
                // offset: [0, 15] ,// 往下移动 10 像素
                distance: -(Distance + 1) // 将标签放置在连接线上
              }
            });
          }
        }
      });
      // 根据nodes动态生成节点数据
      var nodeData = nodes.map(function (node, index) {
        return {
          name: node.name,
          id: node.id,
          x: Math.random() * 2000, // 设置随机x坐标位置
          y: Math.random() * 600, // 设置随机y坐标位置
          itemStyle: {
            color: getColorByIndex(), // 可以根据索引设置不同的颜色
            borderWidth: BorderWidth,
            borderColor: getColorByIndex()
          }
        };
      });
      // 设置颜色
      function getColorByIndex() {
        // 生成随机的 R、G、B 分量值，限制在更高的范围内
        var r = Math.floor(Math.random() * 106) + 150; // 150 到 255 之间的随机数
        var g = Math.floor(Math.random() * 106) + 150; // 150 到 255 之间的随机数
        var b = Math.floor(Math.random() * 106) + 150; // 150 到 255 之间的随机数
        // 将 R、G、B 分量值转换为十六进制，并确保每个分量值都是两位数
        var hexR = r.toString(16).padStart(2, "0"); // 使用 padStart 方法确保生成的十六进制数为两位
        var hexG = g.toString(16).padStart(2, "0");
        var hexB = b.toString(16).padStart(2, "0");
        // 拼接十六进制颜色值
        var color = "#" + hexR + hexG + hexB;
        return color;
      }
      console.log(links);
      console.log(nodeData);
      var option;
      option = {
        title: {
          // text: '书中最常提到的100位人物',
          // subtext: '',
          left: "center",
          top: FontSize + 10,
          // textStyle: {
          //     fontSize: FontSize // 设置标题文字大小为 18px
          // },
          subtextStyle: {
            fontSize: FontSize, // 设置副标题文字大小为 14px
            color: "#2C2C2C"
          }
        },
        backgroundColor: {
          type: "image",
          image: "/static/image/characterRelationBg.png",
          // repeat: 'repeat-x', // 是否平铺，可以是 'repeat-x', 'repeat-y', 'no-repeat'
          size: "100% 100%", // 背景图片的尺寸，可以是百分比或者像素
          position: "center center" // 背景图片的位置，可以是 top, bottom, middle 或者百分比
        },
        tooltip: {},
        animationDurationUpdate: 1500,
        animationEasingUpdate: "quinticInOut",
        series: [
          {
            type: "graph",
            layout: "none",
            roam: true,
            symbolSize: SymbolSize, // 调整节点大小
            label: {
              show: true,
              color: "black", // 设置节点文字颜色为黑色
              fontSize: FontSize // 设置文字大小
            },
            edgeSymbol: ["circle"],
            edgeSymbolSize: [4, 10],
            data: nodeData,
            links: links,
            lineStyle: {
              opacity: 0.9,
              width: 2,
              curveness: 0.3
            }
          }
        ]
      };
      // 将生成的连接线添加到echarts图表的option中
      option.series[0].links = links;
      // 设置点击事件监听
      myChart.on("click", (params) => {
        // menuNav2 = !menuNav1
        if (params.componentType === "series") {
          this.spaceTimeArr(params.data.id);
        }
      });
      option && myChart.setOption(option);
    },
    // 基础搜索
    onSearch(val) {
      this.searchKey = val.text;
      getFuzzySearch({ keyword: val.text }).then((res) => {
        if (res.list) {
          this.nodes = [];
          this.relationships = [];
          res.list.forEach((item, index) => {
            let exists1 = this.nodes.some(
              (node) => node.id === item.identifier1 && node.name === item.name1
            );
            let exists2 = this.nodes.some(
              (node) => node.id === item.identifier2 && node.name === item.name2
            );
            // 证明不存在
            if (exists1 !== true) {
              this.nodes.push({
                name: item.name1,
                id: item.identifier1
              });
            }
            if (exists2 !== true) {
              this.nodes.push({
                name: item.name2,
                id: item.identifier2
              });
            }
            let obj = {
              source: item.name1,
              target: item.name2,
              relation: item.relationName || "" // 如果存在 relationName 字段则使用，否则为空字符串
            };
            this.relationships.push(obj);
          });
        }
        this.relation();
      });
    },
    // 高级搜索
    onSubmit(val) {
      getAdvanceSearch(val).then((res) => {
        console.log(res, "接口调用成功");
      });
    },
    // 点击下面的朝代按钮
    dynastyBottomClick(item) {
      this.dynastyColor = item.id;
      this.onSearch({
        text: item.name
      });
    },
    // 关系图 点击里面的元素
    spaceTimeArr(id) {
      // 关系图的数据
      uni.navigateTo({
        url: "/pages/character/detail?id=" + id
      });
    },
    // 获取朝代echarts的数据
    echartsArr() {
      getDataStatistics().then((res) => {
        res.object.dynastyStatistic.details.map((item, index) => {
          // this.dynasty.id = item.dynastyId
          // this.dynasty.name = item.dynastyName
          // this.dynasty.coord = item.count
          this.dynasty[index].id = item.dynastyId;
          this.dynasty[index].name = item.dynastyName;
          this.dynasty[index].coord = item.count;
        });
      });
    },
    // 热门搜索
    hotSearch() {
      getHotSearch().then((res) => {
        const indexList = Object.keys(res.object);
        indexList.sort((a, b) => parseInt(b) - parseInt(a));
        this.hotKeyList = indexList.map((item) => {
          return res.object[item];
        });
      });
    },

    // 高级搜索里面职业的下拉菜单
    innt() {
      getPDataStatistics().then((res) => {
        const professionIndex = this.From.from.findIndex(
          (field) => field.label === "职业"
        );
        // 如果找到了职业字段
        if (professionIndex !== -1) {
          // 将 profession.list 转换为 options 格式
          const options = res.object.occupationStatistic.details.map(
            (item) => ({
              label: item.tagName,
              value: item.tagId.toString() // 将 id 转换为字符串，确保与 value 类型一致
            })
          );
          // 更新职业字段的 options 属性
          this.$set(this.From.from[professionIndex], "options", options);
        }
      });
    }
  }
};
</script>

<style>
@media screen and (min-width: 2560px) and (max-width: 3840px) {
}

@media screen and (min-width: 1366px) and (max-width: 1920px) {
}

::v-deep .uni-input-placeholder {
  line-height: 1;
  font-size: 0.12rem;
}

::v-deep .ffff {
  border-radius: 0.5rem;
}

::v-deep .widget_button {
  border-radius: 0.5rem;
  margin: 0.02rem;
}

.hotSearch {
  font-size: 0.12rem;
  color: #2c2c2c;

  li {
    color: #244a7b;
    margin: 0 0.1rem;
    color: #244a7b;
  }
}
</style>

 src/pages/characterRelation/characterRelation.vue

File was deleted

 src/pages/forgetPass/forgetPass.vue

@@ -198,12 +198,12 @@
                // uni.setStorageSync('globalData', { id: 123, name: 'example' });
                if (item.id == 1) {
                    uni.navigateTo({
                        url: '/pages/repository/repository?id=' + item.id
                        url: '/pages/character/detail?id=' + item.id
                    })
                } else if (item.id == 2) {
                    console.log(item.name);
                    // uni.navigateTo({
                    //     url:'/pages/repository/repository?id='+item.id
                    //     url:'/pages/character/detail?id='+item.id
                    // })
                } else if (item.id == 3) {
                    uni.navigateTo({

 src/pages/index/index.vue

@@ -182,8 +182,8 @@
                // uni.setStorageSync('globalData', { id: 123, name: 'example' });
                if (item.id == 1) {
                    uni.navigateTo({
                        // url: '/pages/repository/repository?id=' + item.id
                        url: '/pages/characterRelation/characterRelation?id=' + item.id
                        // url: '/pages/character/detail?id=' + item.id
                        url: '/pages/character/index?id=' + item.id
                    })
                } else if (item.id == 2) {
                    console.log(item.name);

 src/pages/inherit/index.vue

@@ -54,6 +54,12 @@
</template>
<script>
import * as echarts from "echarts";
import {
  inheritMedicalList,
  inheritMedicalSataStatistics,
  inheritMedicalCultureList,
  inheritMedicalRelationList
} from "@/api/index.js";
export default {
  data() {
    return {
@@ -64,44 +70,45 @@
        {
          name: "唐",
          number: "4910",
          isColor: false,
          isColor: false
        },
        {
          name: "五代",
          number: "494",
          isColor: true,
          isColor: true
        },
        {
          name: "宋",
          number: "51273",
          isColor: false,
          isColor: false
        },
        {
          name: "北宋",
          number: "15",
          isColor: true,
          isColor: true
        },
        {
          name: "南宋",
          number: "4910",
          isColor: false,
          isColor: false
        },
        {
          name: "元",
          number: "299",
          isColor: true,
          isColor: true
        },
        {
          name: "明",
          number: "1830",
          isColor: false,
          isColor: false
        },
        {
          name: "清",
          number: "1000",
          isColor: true,
        },
          isColor: true
        }
      ],
      nodeData: []
    };
  },
  onLoad(options) {
@@ -109,10 +116,31 @@
    console.log("optionsoptionsoptions", options.id);
  },
  mounted() {
    // 初始化 echarts
    this.initBarChart();
    this.getData();
  },
  methods: {
    getData() {
      inheritMedicalList({
        keywords: "",
        dynastyId: "",
        searchType: "KEYWORD",
        path: ""
      }).then((res) => {
        console.log(res);
        this.nodeData = res.object.nodeList.map((item) => {
          return {
            ...item,
            itemStyle: {
              color: "#F8E2D7",
              borderColor: "#F3AA78",
              borderWidth: "3"
            }
          };
        });
        // 初始化 echarts
        this.initBarChart();
      });
    },
    initBarChart() {
      // WMBg
      //通过 $ref 进行挂载
@@ -140,16 +168,17 @@
        Distance = 22;
      }

      console.log(this.nodeData, "this.nodeData");
      let option = {
        title: {
          text: [""],
          text: [""]
        },
        backgroundColor: {
          type: "image",
          image: "/static/image/WMBg.png",
          repeat: "repeat-x", // 是否平铺，可以是 'repeat-x', 'repeat-y', 'no-repeat'
          size: "100% 100%", // 背景图片的尺寸，可以是百分比或者像素
          position: "center center", // 背景图片的位置，可以是 top, bottom, middle 或者百分比
          position: "center center" // 背景图片的位置，可以是 top, bottom, middle 或者百分比
        },
        tooltip: {},
        animationDurationUpdate: 1500,
@@ -157,18 +186,17 @@
        series: [
          {
            type: "graph",
            layout: "none",
            symbolSize: SymbolSize + 20,
            layout: "force",
            symbolSize: 120,
            //是否允许用户拖动图片
            roam: false,
            roam: true,
            label: {
              show: true,
              color: "black", // 设置节点文字颜色为黑色
              fontSize: FontSize, // 设置文字大小
              fontSize: FontSize // 设置文字大小
            },
            edgeSymbol: ["circle", "arrow"],
            edgeSymbolSize: [4, 10],

            edgeLabel: {
              show: true,
              fontSize: FontSize, //更改两者关系的字体
@@ -179,132 +207,40 @@
              formatter: function (params) {
                // params.data 是边的数据对象，你可以在这里定义关系名
                // 例如，你可以根据 source 和 target 的名称来定义关系名
                return params.data.relationName || "父子"; // 如果定义了 relationName 则显示它，否则显示“父子”
              },
                return params.data.relationName; // 如果定义了 relationName 则显示它，否则显示“父子”
              }
            },
            //各个节点
            data: [
              {
                name: "薛雪",
                itemStyle: {
                  color: "#F8E2D7",
                  borderColor: "#F3AA78",
                  borderWidth: "3",
                },
              },
              {
                name: "邵登瀛",
                x: 400,
                y: 300,
                itemStyle: {
                  color: "#F8E2D7",
                  borderColor: "#F3AA78",
                  borderWidth: "3",
                },
              },
              {
                name: "邵鲁瞻",
                x: 500,
                y: 300,
                itemStyle: {
                  color: "#F8E2D7",
                  borderColor: "#F3AA78",
                  borderWidth: "3",
                },
              },
              {
                name: "邵春泉",
                x: 600,
                y: 300,
                itemStyle: {
                  color: "#F8E2D7",
                  borderColor: "#F3AA78",
                  borderWidth: "3",
                },
              },
              {
                name: "徐锦",
                x: 650,
                y: 400,
                itemStyle: {
                  color: "#DCE7EB",
                  borderColor: "#5F81A4",
                  borderWidth: "3",
                },
              },
              {
                name: "邵丙扬",
                x: 700,
                y: 300,
                itemStyle: {
                  color: "#F8E2D7",
                  borderColor: "#F3AA78",
                  borderWidth: "3",
                },
              },
              {
                name: "冯桂芬",
                x: 720,
                y: 400,
                itemStyle: {
                  color: "#DCE7EB",
                  borderColor: "#5F81A4",
                  borderWidth: "3",
                },
              },
              {
                name: "李鸿章",
                x: 740,
                y: 500,
                itemStyle: {
                  color: "#E1E1E1",
                  borderColor: "#888888",
                  borderWidth: "3",
                },
              },
              {
                name: "邵景尧",
                x: 800,
                y: 200,
                itemStyle: {
                  color: "#F8E2D7",
                  borderColor: "#F3AA78",
                  borderWidth: "3",
                },
              },
              {
                name: "邵景康",
                x: 800,
                y: 400,
                itemStyle: {
                  color: "#F8E2D7",
                  borderColor: "#F3AA78",
                  borderWidth: "3",
                },
              },
            ],
            data: this.nodeData,
            lineStyle: {
              color: "#000000",
              opacity: 0.9,
              width: 2,
              curveness: 0,
              curveness: 0
            },
          },
        ],
            force: {
              // initLayout: 'circular',
              // gravity: 0
              friction: 0.1,
              repulsion: 500,
              edgeLength: 6
            }
          }
        ]
      };
      //进行渲染
      myChart.setOption(option);
      myChart.on("click", (params) => {
        uni.navigateTo({
        url: "/pages/inherit/list"
      });
          url: "/pages/inherit/list"
        });
      });
    },
    // 返回按钮
    goBack() {
      this.$router.go(-1);
    },
  },
    }
  }
};
</script>
<style scoped>

 src/pages/inherit/list.vue

@@ -653,7 +653,7 @@
        },
        backgroundColor: {
          type: "image",
          image: "/static/image/WMBg.png",
          image: "./static/image/WMBg.png",
          repeat: "repeat-x", // 是否平铺，可以是 'repeat-x', 'repeat-y', 'no-repeat'
          size: "100% 100%", // 背景图片的尺寸，可以是百分比或者像素
          position: "center center" // 背景图片的位置，可以是 top, bottom, middle 或者百分比

 src/pages/repository/repository.vue

@@ -286,7 +286,7 @@
                if (index == 1) {
                    console.log('跳转关系地图');
                    uni.navigateTo({
                        url: '/pages/characterRelation/characterRelation'
                        url: '/pages/character/index'
                    })
                } else if (index == 2) {
                    uni.navigateTo({

 src/pages/shiyiHome/shiyiHome.vue

@@ -1,7 +1,7 @@
<template>
    <view>
        <headNav :idIndex="idIndex" :searchBg="false" text="中医世医传承数据库" bg="@/static/image/topBg1.png"
            bg1="@/static/image/line1.png" />
        <headNav :idIndex="idIndex" :searchBg="false" text="中医世医传承数据库" bg="/static/image/topBg1.png"
            bg1="/static/image/line1.png" />
    </view>
</template>


 src/pages/territory/territory.vue

@@ -1466,7 +1466,7 @@
            // 查看更多>>
            viewMoreClick() {
                uni.navigateTo({
                    url: '/pages/repository/repository'
                    url: '/pages/character/detail'
                })
            },
        }

 src/uni_modules/luanqing-search/components/luanqing-search/luanqing-search.vue

@@ -1,118 +1,134 @@
<template>
    <view class="widget_style" >
        <view class="ffff" style="display: flex;height: 100%;">
            <input placeholder-class="widget_input_placehold" @confirm="onClickSearch" v-model="content" class="widget_input" :style="style1" :placeholder="placehold" />
            <view class="widget_button" v-if="isSearchTrue"  @click="onClickSearch">{{buttonText}}</view>
            <view class="widget_button searchBg" v-else  @click="onClickSearch"></view>
        </view>
		
    </view>
  <view class="widget_style">
    <view class="ffff" style="display: flex; height: 100%">
      <input
        placeholder-class="widget_input_placehold"
        @confirm="onClickSearch"
        v-model="content"
        class="widget_input"
        :style="style1"
        :placeholder="placehold"
      />
      <view class="widget_button" v-if="isSearchTrue" @click="onClickSearch">{{
        buttonText
      }}</view>
      <view class="widget_button searchBg" v-else @click="onClickSearch"></view>
    </view>
  </view>
</template>

<script setup>
    export default{
        data(){
            return{
                content:'',
                style1:'',
                style2:'',
            }
        },
        props:{
            width:{
                type:Number,
                default:50
            },
            placehold:{
                type:String,
                default:'请输入内容'
            },
            buttonText:{
                type:String,
                default(){
                    return '搜索'
                }
            },isSearchTrue:{
                type:Boolean,
                default(){
                    return true
                }
            },
        },
        created() {
            // 编织设置动态宽度
            // this.style1 = 'min-width:calc('+this.width+'vw);';
            // this.style2 = 'min-width:calc('+(this.width / 5)+'vw);';
            this.style1= 'width:4.5rem'
            this.style2= 'width:.5rem'
        },
        destroyed() {
			
        },
        methods:{
            onClickSearch(){
                this.$emit('onSearch',{text:this.content});
            }
export default {
  data() {
    return {
      content: "",
      style1: "",
      style2: ""
    };
  },
  props: {
    width: {
      type: Number,
      default: 50
    },
    placehold: {
      type: String,
      default: "请输入内容"
    },
    keyword: {
      type: String
    },
    buttonText: {
      type: String,
      default() {
        return "搜索";
      }
    },
    isSearchTrue: {
      type: Boolean,
      default() {
        return true;
      }
    }
  },
  created() {
    // 编织设置动态宽度
    // this.style1 = 'min-width:calc('+this.width+'vw);';
    // this.style2 = 'min-width:calc('+(this.width / 5)+'vw);';
    this.style1 = "width:4.5rem";
    this.style2 = "width:.5rem";
    this.content = this.keyword || "";
  },
  destroyed() {},
  methods: {
    onClickSearch() {
      this.$emit("onSearch", { text: this.content });
    }
  },
    watch: {
        keyword(value) {
            this.content = value
        }
    }
};
</script>

<style>
    .widget_style{
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        border-radius: 30px;
        height: 100% !important;
    }
    .ffff{
        border: 2px solid #597AA5;
        border-radius: 30px;
        overflow: hidden;
        padding-left: 10px;
        background-color: #fff;
        align-items: center;
    }
    .widget_input{
        min-width: 320rpx;
        height: 100%;
        background-color: #fff;
        /* border: 2rpx solid #FF6600; */
        /* border-radius: 10rpx; */
        padding-left: 12rpx;
        padding-right: 12rpx;
        font-size: 24rpx;
    }
    .widget_input_placehold{
        color: #BBB;
    }
    .widget_button{
        color: #fff;
        width: .74rem;
        height: .3rem;
        font-size: .14rem;
        padding: 5rpx 20rpx;
        display: flex;
        align-items: center;
        justify-content: center;
        border-top-right-radius: 10rpx;
        border-top-left-radius: 0rpx;
        border-bottom-left-radius: 0rpx;
        border-bottom-right-radius: 10rpx;
        background-color: #244A7B;
        border-radius: 30px;
        margin: 2rpx;
    }
    .searchBg{
        width: .46rem;
        height: 0.46rem;
        background-image:url(@/static/image/搜索.png) ;
        background-size: 100% 100%;
    }
    ::v-deep .uni-input-input{
        height: 100% !important;
        color: #000;
        font-size: .16rem;
    }
.widget_style {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  border-radius: 30px;
  height: 100% !important;
}
.ffff {
  border: 2px solid #597aa5;
  border-radius: 30px;
  overflow: hidden;
  padding-left: 10px;
  background-color: #fff;
  align-items: center;
}
.widget_input {
  min-width: 320rpx;
  height: 100%;
  background-color: #fff;
  /* border: 2rpx solid #FF6600; */
  /* border-radius: 10rpx; */
  padding-left: 12rpx;
  padding-right: 12rpx;
  font-size: 24rpx;
}
.widget_input_placehold {
  color: #bbb;
}
.widget_button {
  color: #fff;
  width: 0.74rem;
  height: 0.3rem;
  font-size: 0.14rem;
  padding: 5rpx 20rpx;
  display: flex;
  align-items: center;
  justify-content: center;
  border-top-right-radius: 10rpx;
  border-top-left-radius: 0rpx;
  border-bottom-left-radius: 0rpx;
  border-bottom-right-radius: 10rpx;
  background-color: #244a7b;
  border-radius: 30px;
  margin: 2rpx;
}
.searchBg {
  width: 0.46rem;
  height: 0.46rem;
  background-image: url(@/static/image/搜索.png);
  background-size: 100% 100%;
}
::v-deep .uni-input-input {
  height: 100% !important;
  color: #000;
  font-size: 0.16rem;
}
</style>

 src/uni_modules/uni-list/readme.md

@@ -259,17 +259,17 @@
<uni-list>
    <uni-list-item title="自定义右侧插槽" note="列表描述信息" link>
        <template slot="header">
            <image class="slot-image" src="/static/logo.png" mode="widthFix"></image>
            <image class="slot-image" src="@/static/logo.png" mode="widthFix"></image>
        </template>
    </uni-list-item>
    <uni-list-item>
        <!-- 自定义 header -->
        <view slot="header" class="slot-box"><image class="slot-image" src="/static/logo.png" mode="widthFix"></image></view>
        <view slot="header" class="slot-box"><image class="slot-image" src="@/static/logo.png" mode="widthFix"></image></view>
        <!-- 自定义 body -->
        <text slot="body" class="slot-box slot-text">自定义插槽</text>
        <!-- 自定义 footer-->
        <template slot="footer">
            <image class="slot-image" src="/static/logo.png" mode="widthFix"></image>
            <image class="slot-image" src="@/static/logo.png" mode="widthFix"></image>
        </template>
    </uni-list-item>
</uni-list>

 src/uni_modules/uni-ui/package.json

@@ -1,15 +1,6 @@
{
  "id": "uni-ui",
  "displayName": "uni-ui",
  "displayName": "zhongguoyixuerenwushujuku",
  "version": "1.4.27",
  "description": "uni-ui 是基于uni-app的、全端兼容的、高性能UI框架",
  "keywords": [
    "uni-ui",
    "uniui",
    "UI组件库",
    "ui框架",
    "ui库"
],
  "repository": "https://github.com/dcloudio/uni-ui",
  "engines": {
    "HBuilderX": "^3.2.10"

 src/utils/request/req1.js

@@ -1,50 +1,55 @@
// 封装网络请求
import axios from 'axios'
import { Message } from 'element-ui'
import axios from "axios";
import { Message } from "element-ui";
// 创建请求实例
const req = axios.create({
    // baseURL: '/api'
    // baseURL: '/account/verification'
    baseURL: 'http://icmm.test.xyinde.com/api',
    timeout: 10000
})
  // baseURL: '/api'
  // baseURL: '/account/verification'
  baseURL: "http://icmm.test.xyinde.com/api",
  timeout: 10000
});

// 请求拦截
req.interceptors.request.use((config) => {
    // 携带token参数，一般会加载header  Authorization
    config.headers.Authorization = localStorage.getItem('access_token')
    return config
}, (error) => {
    return Promise.reject(error)
})
req.interceptors.request.use(
  (config) => {
    // 携带token参数，一般会加载header  Authorization
    config.headers.Authorization = localStorage.getItem("access_token");
    return config;
  },
  (error) => {
    return Promise.reject(error);
  }
);

// 响应拦截
req.interceptors.response.use(
    (res) => {
        // 判断token过期时的一些处理 
        if (res.data.success== false&& res.data.errorText=='需要验证身份'&&res.data.errorCode == '11') {
            console.log('token过期了');
             Message.error(res.data.errorText || '')
            // 清楚token
            uni.getStorageSync('access_token');
            uni.clearStorageSync();
            uni.showToast({
                title: '请重新登录',
                icon: 'none'
            });
            uni.reLaunch({
                url: "/pages/Login/Login"
            });
        } 
        console.log(res, '相应拦截1')
        return res.data
    },
    (error) => {
        // state  400  500
        // 错误处理
        console.log(error, '相应拦截2')
        // 跳登陆页面
    }
)
  (res) => {
    // 判断token过期时的一些处理
    if (
      res.data.success == false &&
      res.data.errorText == "需要验证身份" &&
      res.data.errorCode == "11"
    ) {
      console.log("token过期了");
      Message.error(res.data.errorText || "");
      // 清楚token
      uni.getStorageSync("access_token");
      uni.clearStorageSync();
      uni.showToast({
        title: "请重新登录",
        icon: "none"
      });
      uni.reLaunch({
        url: "/pages/Login/Login"
      });
    }
    return res.data;
  },
  (error) => {
    // state  400  500
    // 错误处理
    // 跳登陆页面
  }
);

export default req
export default req;