yitisheng-mini-app/pages/zyb/npee/schoolNpee.vue

<script>
import ApiConstant from "@/common/ApiConstant";
import Request from "@/common/request";
import JumpTool from "../../../common/js/jumpTool";

let request = new Request()
export default {
  name: "schoolNepp",
  data() {
    return {
      schoolId: '1759576199980183554',

      icons: {
        up: '/static/icons/glyph/icons-arrow-up-orange-90.png',
        down: '/static/icons/glyph/icons-arrow-down-orange-90.png'
      },
      schoolName: '',
      isBaoyan: false,
      //专硕授权点数据
      professionalMasterDegreeList: [],
      //学硕授权点
      academicMasterDegreeList: []
    }
  },
  onLoad(e) {
    if (e.schoolId) {
      this.schoolId = e.schoolId
      this.getSchoolGraduateDegree()
    }
    if(e.schoolName){
      this.schoolName = e.schoolName
    }
    if(e.byzg && e.byzg ==='1'){
      this.isBaoyan = true
    }
  },
  onShow() {


  },
  methods: {
    openZhuanShuoChildTr(index) {
      this.professionalMasterDegreeList[index].status = !this.professionalMasterDegreeList[index].status
    },
    openXueShuoChildTr(index) {
      this.academicMasterDegreeList[index].status = !this.academicMasterDegreeList[index].status
    },
    //获取详细信息
    getSchoolGraduateDegree() {
      request.get(ApiConstant.GraduateDegree.findSchoolGraduateDegreeList, {schoolId: this.schoolId}).then(res => {
        if (res.success) {
          let result = res.result
          console.log(result)
          this.academicMasterDegreeList = result.academicMasterDegreeList.map(a => {
            a.status = false;
            return a
          })
          this.professionalMasterDegreeList = result.professionalMasterDegreeList.map(a => {
            a.status = false;
            return a
          })

          //result.academicMasterDegreeList
          //result.professionalMasterDegreeList
        }
      }).catch(err => {
      }).finally(() => {
      });
    },
    openDetail(e){
      JumpTool.goto('./schoolNpeeDetail?id='+e)
    },
  }
}
</script>

<template>
  <view class="head">
    <view class="flexWrap" style="height: 50rpx;line-height: 50rpx">
      <text class="schoolName font-size-medium">{{ schoolName }}</text>
      <text class="baoyanzige font-size-mini4 margin-left-20" v-if="isBaoyan">有保研资格</text>
    </view>
  </view>
  <view class="body">
    <view class="cardTab">
      <uni-section title="硕士专业学位授权点" titleFontSize="38rpx" type="line">
        <view class="table">
          <view class="thead border-bottom">
            <view class="tr flexWrap">
              <view class="th">学科类别</view>
              <view class="th">专业</view>
            </view>
          </view>
          <view class="tbody">
            <!--一级-->
            <view class="tr flexWrap" v-for="(item,index) in professionalMasterDegreeList" :key="index">
              <view class="flex-item-10">
                <view class="flexWrap">
                  <view class="flex-item-5">({{ item.subjectCode }}){{ item.disciplineField }}</view>
                  <view class="flex-item-5" @click="openZhuanShuoChildTr(index)">
                    <text>{{ item.majorName.replace('（专业学位）',"") }}</text>
<!--                    <text>{{ item.disciplineField }}</text>-->
                    <image v-if="item.schoolGraduateDegreeList && item.schoolGraduateDegreeList.length>0"
                           :src="item.status!==undefined &&item.status?icons.up:icons.down" class="icon32"
                           style="float: right;position: relative;top: 20rpx"/>
                  </view>
                </view>
                <!--二级-->
                <view v-if="item.status!==undefined &&item.status">
                  <view class="tr-child flexWrap" v-for="(child,chi) in item.schoolGraduateDegreeList" :key="chi">
                    <view class="flex-item-5"></view>
                    <view class="flex-item-5 flexWrap" style="line-height: 40rpx">
                      <view class="flex-item-7">{{ child.researchDirection }}</view>
                      <view class="flex-item-3 redOrange" @click="openDetail(child.id)">
                        <text class="float-right">详情</text>
                      </view>
                    </view>
                  </view>
                </view>
              </view>

            </view>
          </view>
        </view>
      </uni-section>
    </view>
    <view class="cardTab">
      <uni-section title="硕士学术学位授权点" titleFontSize="38rpx" type="line">
        <view class="table">
          <view class="thead border-bottom">
            <view class="tr flexWrap">
              <view class="th">学科类别</view>
              <view class="th">专业</view>
            </view>
          </view>
          <view class="tbody">
            <!--一级-->
            <view class="tr flexWrap" v-for="(item,index) in academicMasterDegreeList" :key="index">
              <view class="flex-item-10">
                <view class="flexWrap">
                  <view class="flex-item-5">({{ item.subjectCode }}){{ item.disciplineField }}</view>
                  <view class="flex-item-5" @click="openXueShuoChildTr(index)">
                    <text>{{ item.majorName.replace('（专业学位）',"") }}</text>
<!--                    <text>{{ item.disciplineField }}</text>-->
                    <image v-if="item.schoolGraduateDegreeList && item.schoolGraduateDegreeList.length>0"
                           :src="item.status!==undefined &&item.status?icons.up:icons.down" class="icon32"
                           style="float: right;position: relative;top: 20rpx"/>
                  </view>
                </view>
                <!--二级-->
                <view v-if="item.status!==undefined &&item.status">
                  <view class="tr-child flexWrap" v-for="(child,chi) in item.schoolGraduateDegreeList" :key="chi">
                    <view class="flex-item-5"></view>
                    <view class="flex-item-5 flexWrap" style="line-height: 40rpx">
                      <view class="flex-item-7">{{ child.researchDirection }}</view>
                      <view class="flex-item-3 redOrange" @click="openDetail(child.id)">
                        <text class="float-right">详情</text>
                      </view>
                    </view>
                  </view>
                </view>
              </view>

            </view>
          </view>
        </view>
      </uni-section>
    </view>
  </view>
</template>

<style scoped lang="scss">
/*头部*/
.head {
  padding: 30rpx 35rpx;
  background-color: white;
  /*学校名称*/
  .schoolName {
    color: #000000;
  }

  /*保研资格*/
  .baoyanzige {
    color: green;
  }

  .tags {
    background-color: #efefef;
    border-radius: 15rpx;
    padding: 15rpx;
  }
}

.body {
  margin-top: 20rpx;

  .cardTab {
    margin: 20rpx 0;
    min-height: 100rpx;
    background-color: white;
  }

  //表格
  .table {
    padding: 0 30rpx;
    //列头
    .thead {
      color: #8e8e8e;

      .tr {
        line-height: 80rpx;
        font-size: 33rpx;
        padding: 0 20rpx;
      }

      .tr .th {
        width: 50%;
      }
    }

    //内容
    .tbody {
      .tr {
        font-size: 33rpx;
        padding: 0 20rpx;
        line-height: 80rpx;
      }

      .tr .td {
        width: 50%;
      }
    }
  }
}

/*二级表格*/
.tr-child {
  margin: 20rpx 0;
  font-size: 28rpx;
}
</style>