1
YM
2024-07-26 c423765d8a5ff0c58d23bb0a31af7df6c1fad95c
src/pages/TcmSystem/TcmSystem.vue
@@ -15,9 +15,10 @@
        热门搜索:
        <ul class="flex" style="margin-right: 10rpx">
          <li
            v-for="item in hot"
            v-for="(item, index) in hot"
            :key="item.id"
            @tap="HotClick(item.name)"
            @tap="HotClick(item.name, index)"
            :class="{ cursor: true, active: hotAciveIndex === index }"
            style="margin: 0 0.05rem; color: #244a7b; cursor: pointer"
          >
            {{ item.name }}
@@ -50,8 +51,8 @@
              style="padding: 0 20rpx; color: #2c2c2c; cursor: pointer"
              @click="handInstitCLick(item, 'a')"
            >
              <view class="">{{ item.dynastyName }}</view>
              <view class="">{{ item.count }}</view>
              <view>{{ item.dynastyName }}</view>
              <view>{{ item.count }}</view>
            </li>
          </ul>
          <view v-if="institution.list.length - 1 > 3" class="flex flex-center">
@@ -85,8 +86,8 @@
              style="padding: 0 20rpx; cursor: pointer"
              @click="handInstitCLick(item, 'b')"
            >
              <view class="">{{ item.dynastyName }}</view>
              <view class="">{{ item.count }}</view>
              <view>{{ item.dynastyName }}</view>
              <view>{{ item.count }}</view>
            </li>
          </ul>
          <view v-if="officials.list.length - 1 > 3" class="flex flex-center">
@@ -125,9 +126,7 @@
        v-loading="pageLoading"
      >
        <view class="flex" style="width: 100%; margin-bottom: 0.3rem">
          <view
            class=""
            style="font-size: 0.14rem; color: #2c2c2c; font-weight: 400"
          <view style="font-size: 0.14rem; color: #2c2c2c; font-weight: 400"
            >共{{ total }}条</view
          >
          <view class="paixu">
@@ -145,8 +144,8 @@
        <view class="flex CommodityList">
          <view
            class="rightList"
            @click="ListClick(item)"
            v-for="item in CommodityList"
            @click="ListClick(item, index)"
            v-for="(item, index) in CommodityList"
            :key="item"
          >
            <el-card class="box-card" style="height: 100%">
@@ -247,7 +246,6 @@
    <el-dialog class="dialog" :visible.sync="dialogVisible" width="40%">
      <!-- 取消键 -->
      <view
        class=""
        style="
          padding: 0.16rem;
          position: absolute;
@@ -292,21 +290,20 @@
            </ul>
          </view>
        </view>
        <view class="" style="width: 80%; height: 100%; position: relative">
        <view style="width: 80%; height: 100%; position: relative">
          <view class="pinji flex">
            <view class=""
            <view
              >品级:<span> {{ ListDetails.grade || "-" }}</span>
            </view>
            <view class=""
            <view
              >别名:<span> {{ ListDetails.alias || "-" }}</span>
            </view>
            <view class=""
            <view
              >来源:<span> {{ ListDetails.source || "-" }}</span>
            </view>
          </view>
          <view class="">
          <view>
            <view
              class=""
              style="
                font-size: 0.14rem;
                color: #2c2c2c;
@@ -320,7 +317,6 @@
              相关描述
            </view>
            <view
              class=""
              style="
                font-size: 0.14rem;
                color: #2c2c2c;
@@ -330,9 +326,8 @@
            >
              {{ ListDetails.desc || "-" }}
            </view>
            <view class="">
            <view>
              <view
                class=""
                style="
                  font-size: 0.14rem;
                  color: #2c2c2c;
@@ -346,7 +341,6 @@
                备注
              </view>
              <span
                class=""
                v-for="item in ListDetails.notesList"
                style="
                  font-size: 0.14rem;
@@ -360,21 +354,60 @@
            </view>
          </view>
        </view>
        <!-- <view class="flex detailsBtn">
          <el-button class="flex btn-prev">
        <view class="flex detailsBtn">
          <el-button
            class="flex btn-prev"
            :disabled="!ListDetails.prev"
            @click="ListClick(ListDetails.prev, ListDetails.prev.index)"
          >
            <view class="flex">
              <view class="" style="margin-right: 40rpx">上一条</view>
              <view class="btn-prev-L">机构: 太医院 </view>
              <view style="width: 0.6rem">上一条</view>
              <view
                class="btn-prev-L"
                style="
                  flex: 1;
                  overflow: hidden;
                  white-space: nowrap;
                  text-overflow: ellipsis;
                "
                :title="ListDetails.prev ? ListDetails.prev.name : '-'"
              >
                {{
                  ListDetails.prev
                    ? ListDetails.prev.typeName + ":" + ListDetails.prev.name
                    : "-"
                }}
              </view>
            </view>
          </el-button>
          <view class=""> 102/329 </view>
          <el-button class="flex btn-next">
          <view class="pageInfo">
            {{ ListDetails.index + 1 }}/{{ total }}
          </view>
          <el-button
            class="flex btn-next"
            :disabled="!ListDetails.next"
            @click="ListClick(ListDetails.next, ListDetails.next.index)"
          >
            <view class="flex">
              <view class="" style="margin-right: 40rpx">机构: 太医院 </view>
              <view class="btn-prev-R">下一条</view>
              <view
                style="
                  flex: 1;
                  overflow: hidden;
                  white-space: nowrap;
                  text-overflow: ellipsis;
                "
                :title="ListDetails.next ? ListDetails.next.name : '-'"
              >
                {{
                  ListDetails.next
                    ? ListDetails.next.typeName + ":" + ListDetails.next.name
                    : "-"
                }}
              </view>
              <view class="btn-prev-R" style="width: 0.6rem">下一条</view>
            </view>
          </el-button>
        </view> -->
        </view>
      </view>
    </el-dialog>
@@ -397,6 +430,7 @@
  },
  data() {
    return {
      hotAciveIndex: "",
      // 机构统计
      institution: {
        title: "机构统计",
@@ -406,6 +440,7 @@
      // 显示多少条职官数据
      institutionIndex: 4,
      // 机构和职官的类型 取值:OFFICIAL->职官 INSTITUTION->机构 ALL->职官、机构
      searchType: "ALL",
      classifyType: "ALL",
      // 机构和职官的id
      classifyId: "",
@@ -513,12 +548,18 @@
      });
    },
    // 右侧的list数据
    getMList(obj) {
    getMList(key, index) {
      if (index !== undefined) {
        this.SearchValue = "";
        this.hotAciveIndex = index;
      } else {
        this.hotAciveIndex = "";
      }
      this.pageLoading = true;
      let Obj = {
        medicalSearchType: "ALL",
        medicalSearchType: this.searchType,
        type: this.classifyType, //查询类型 取值:OFFICIAL->职官 INSTITUTION->机构 ALL->职官、机构
        name: this.SearchValue, //搜索框检索
        name: key ? key : this.SearchValue, //搜索框检索
        dynastyId: this.classifyId, //点击朝代查询数据时,带上此参数
        sort: this.rankVal, //排序方式 取值:CREATE创建时间,NAME名称
        page: this.CurrentPage, //第几页
@@ -527,7 +568,7 @@
      getMedicalList(Obj).then((res) => {
        this.CommodityList = res.list.map((item) => {
          return {
            id: item.id,
            requestId: this.searchType == "ALL" ? item.id : item.rowId,
            post:
              item.type === "OFFICIAL"
                ? "职官"
@@ -543,18 +584,43 @@
      });
    },
    // list数组 获取list里面的详情shuju
    ListClick(item) {
    ListClick(item, index) {
      let Obj = {
        id: item.dataId,
        type: item.type
        rowId: item.requestId,
        medicalSearchType: this.searchType,
        type: this.classifyType, //查询类型 取值:OFFICIAL->职官 INSTITUTION->机构 ALL->职官、机构
        name: this.SearchValue, //搜索框检索
        dynastyId: this.classifyId, //点击朝代查询数据时,带上此参数
        sort: this.rankVal //排序方式 取值:CREATE创建时间,NAME名称
      };
      getMedicalDetails(Obj).then((res) => {
        this.ListDetails = {
          index,
          ...item,
          ...res.object
          ...res.object.curr,
          next:
            res.object.next && res.object.next.name
              ? {
                  ...res.object.next,
                  requestId: res.object.next.rowId,
                  index: index + 1,
                  typeName:
                    res.object.next.type === "OFFICIAL" ? "职官" : "机构"
                }
              : null,
          prev:
            res.object.prev && res.object.prev.name
              ? {
                  ...res.object.prev,
                  requestId: res.object.prev.rowId,
                  index: index - 1,
                  typeName:
                    res.object.prev.type === "OFFICIAL" ? "职官" : "机构"
                }
              : null
        };
        this.dialogVisible = true;
      });
      this.dialogVisible = !this.dialogVisible;
    },
    // 左侧的机构统计等等按钮
    handInstitCLick(item, name) {
@@ -629,9 +695,9 @@
      this.getMList();
    },
    // 热门搜索
    HotClick(val) {
      this.SearchValue = val;
      this.getMList();
    HotClick(val, index) {
      // this.SearchValue = val;
      this.getMList(val, index);
    },
    // 按照什么排序
    selectChange(e) {
@@ -690,8 +756,6 @@
}
.creatureXinxi2 {
  /* width: .24rem; */
  height: 0.17rem;
  line-height: 1;
  font-size: 0.12rem;
  font-weight: 600;
@@ -704,7 +768,6 @@
}
.creatureXinxi3 li {
  height: 0.16rem;
  line-height: 0.16rem;
  background-color: #fff;
  padding: 0 0.08rem;
@@ -719,7 +782,8 @@
/* --------- */
/* 品级 */
.pinji {
  box-shadow: 2px 0px 3px #888;
  box-shadow: 0 0 3px #888;
  border-radius: 6px;
  background-color: #fff;
  width: 100%;
  /* height: .6rem;
@@ -730,6 +794,10 @@
  position: relative;
  top: -0.25rem;
  color: #2c2c2c;
  font-weight: bold;
  span {
    font-weight: initial;
  }
}
/* 个人信息的按钮 */
@@ -749,12 +817,19 @@
  border-radius: 5px;
  /* height: .32rem; */
  line-height: 0.32rem;
  flex: 1;
  overflow: hidden;
}
.detailsBtn .pageInfo {
  width: 1rem;
  text-align: center;
}
.detailsBtn .btn-prev-L,
.detailsBtn .btn-prev-R {
  border-left: 1px solid #9e9e9e;
  padding-left: 0.1rem;
  text-align: center;
}
.detailsBtn > :nth-child(2) {
@@ -772,58 +847,55 @@
  background-color: #0c274c;
  padding: 25rpx;
  color: #fff !important;
}
.NavTop img {
  width: 30rpx;
  height: 30rpx;
  vertical-align: middle;
}
.NavTop .NavTopr {
  img {
    width: 30rpx;
    height: 30rpx;
    vertical-align: middle;
  }
  .NavTopr {
    img {
      margin-right: 10rpx;
    }
    margin-right: 10rpx;
  }
}
.mImage {
  width: 100%;
  height: 40rpx;
  img {
    vertical-align: top;
  }
}
.mImage img {
  vertical-align: top;
}
.centre {
  padding-left: 1.23rem;
  padding-right: 1.17rem;
  align-items: stretch;
}
.centre .CLeft {
  width: 2.4rem;
  flex-direction: column;
  margin-right: 0.2rem;
}
.centre .CLeft .institution {
  width: 100%;
  border: 1px solid #000;
  padding: 20rpx;
}
.centre .CLeft .institution2 {
  margin: 20rpx 0;
}
.centre .CLeft .institution3 {
  flex-grow: 1;
}
  .CLeft {
    width: 2.4rem;
    flex-direction: column;
    margin-right: 0.2rem;
    .institution {
      width: 100%;
      border: 1px solid #000;
      padding: 20rpx;
    }
    .institution2 {
      margin: 20rpx 0;
    }
    .institution3 {
      flex-grow: 1;
    }
  }
  .CRight {
    flex: 1;
    border: 1px solid #c1d3ea;
    box-sizing: border-box;
    overflow: hidden;
    padding: 0.1rem 0.2rem;
  }
.centre .CRight {
  flex: 1;
  border: 1px solid #c1d3ea;
  box-sizing: border-box;
  overflow: hidden;
  padding: 0.1rem 0.2rem;
}
.CommodityList {
@@ -836,15 +908,15 @@
  align-content: flex-start;
  /* padding: 20rpx 20rpx 0 20rpx; */
  justify-content: space-between;
}
  > .rightList {
    width: 49%;
    margin-bottom: 20rpx;
.CommodityList .rightList {
  width: 49%;
  margin-bottom: 20rpx;
}
    .box-card {
      overflow: visible;
    }
  }
.CommodityList .rightList .box-card {
  overflow: visible;
}
/* ::v-deep .el-card__body{
@@ -889,23 +961,23 @@
  position: fixed;
  right: 0;
  top: 0;
  z-index: 9999999999999999999999999999999999999999999 !important;
  z-index: 99999 !important;
}
  > div {
    height: 100%;
    margin: 0 !important;
    position: fixed;
    right: 0;
    top: 0;
.dialog div {
  height: 100%;
  margin: 0 !important;
  position: fixed;
  right: 0;
  top: 86px;
}
    > :nth-child(1) {
      display: none;
    }
.dialog div:nth-child(1) {
  display: none;
}
    > :nth-child(2) {
      padding: 0;
    }
  }
.dialog div:nth-child(2) {
  padding: 0;
}
::v-deep .el-dialog .el-dialog__body {
@@ -916,13 +988,12 @@
  width: 100%;
  height: 1.94rem;
  color: #000;
  img {
    position: absolute;
    width: 100%;
    height: 100%;
    vertical-align: top;
  }
}
.detailImage img {
  position: absolute;
  width: 100%;
  height: 100%;
  vertical-align: top;
}
/* 搜索按钮 */
@@ -999,7 +1070,7 @@
.search1 ::v-deep .uni-select__selector-item {
  position: relative;
  z-index: 999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999 !important;
  z-index: 99999 !important;
  display: flex;
  justify-content: center;
@@ -1037,34 +1108,33 @@
  min-height: 2rem !important;
  position: relative;
  border: 1px solid #c1d3ea !important;
}
.boox ul {
  margin-top: 0.16rem !important;
}
  ul {
    margin-top: 0.16rem !important;
  }
.boox h3 {
  font-size: 0.14rem;
  margin-left: 0.1rem;
}
  h3 {
    font-size: 0.14rem;
    margin-left: 0.1rem;
  }
.boox li {
  height: 0.3rem;
  line-height: 0.3rem;
  padding: 0 0.2rem !important;
  margin: 0.05rem 0 !important;
  border-radius: 0.3rem !important;
  font-size: 0.14rem;
}
  li {
    height: 0.3rem;
    line-height: 0.3rem;
    padding: 0 0.2rem !important;
    margin: 0.05rem 0 !important;
    border-radius: 0.3rem !important;
    font-size: 0.14rem;
  }
.boox .toggleButton1 {
  position: absolute;
  bottom: 0.1rem !important;
  left: 40% !important;
}
  .toggleButton1 {
    position: absolute;
    bottom: 0.1rem !important;
    left: 40% !important;
  }
  .toggleButton {
    font-size: 0.14rem !important;
  }
.boox .toggleButton {
  font-size: 0.14rem !important;
}
.paixu {
@@ -1153,30 +1223,35 @@
  padding: 0.14rem 0.2rem 0.23rem;
  /* position: relative; */
  .biecheng {
    height: 0.24rem;
    /* line-height: .24rem; */
    font-size: 0.12rem;
    padding-left: 0.1rem;
    background-color: #f0f0f0;
    display: flex;
    align-items: center;
    margin-bottom: 0.12rem;
  }
}
.rightList .desBox .biecheng {
  height: 0.24rem;
  /* line-height: .24rem; */
  font-size: 0.12rem;
  padding-left: 0.1rem;
  background-color: #f0f0f0;
  display: flex;
  align-items: center;
  margin-bottom: 0.12rem;
}
  .describe {
    position: absolute;
    bottom: 0.1rem;
    left: 0;
    /* width: 100%; */
    padding: 0 0.23rem;
    height: 0.49rem;
    line-height: 0.24rem;
    font-size: 0.12rem;
  }
.rightList .desBox .describe {
  position: absolute;
  bottom: 0.1rem;
  left: 0;
  /* width: 100%; */
  padding: 0 0.23rem;
  height: 0.49rem;
  line-height: 0.24rem;
  font-size: 0.12rem;
}
.nullBox {
  width: 100%;
}
.cursor.active {
  color: #027edc !important;
  font-weight: bold;
}
</style>