[feat] 环境探索-信息搜索，关键搜索，高校详情

src/views/system/user/authRole.vue

@@ -15,7 +15,6 @@
             </el-col>
          </el-row>
       </el-form>
-
       <h4 class="form-header h4">角色信息</h4>
       <el-table v-loading="loading" :row-key="getRowKey" @row-click="clickRow" ref="roleRef" @selection-change="handleSelectionChange" :data="roles.slice((pageNum - 1) * pageSize, pageNum * pageSize)">
          <el-table-column label="序号" width="55" type="index" align="center">

src/views/xjc-integratedmachine/components/collection_component.vue

@@ -1,51 +1,85 @@
 <template>
-    <el-button @click="collection" v-if="collectionList.length == 0">收藏</el-button>
-    <el-button @click="cancle_collection" v-if="collectionList.length >= 1">取消收藏</el-button>
+
+
+    <div class="item-img" v-if="collectionList.length == 0">
+      <img @click="collection" v-if="collectionList.length == 0" src="@/assets/images/environment/collage.png">
+      <p @click="collection" v-if="collectionList.length == 0">收藏</p>
+    </div>
+  <div class="item-img" v-if="collectionList.length >= 1">
+    <img @click="cancle_collection" v-if="collectionList.length >= 1" src="@/assets/images/environment/collaged.png">
+    <p @click="cancle_collection" v-if="collectionList.length >= 1">取消收藏</p>
+  </div>
+    <div class="item-img">
+      <img src="@/assets/images/environment/contrast.png">
+<!--      <img src="@/assets/images/environment/contrasted.png">-->
+      <p>对比</p>
+    </div>
 </template>
 
 <script setup>
-    import {addCollection, getCollection, removeCollection} from '@/api/xjc-integratedmachine/environment/university.js'
-
-    const props = defineProps({
-        collection: {
-            contentType: null,
-            contentId: null
-        }
-    })
-
-    const collectionList = ref([])
-
-    function collection() {
-        let data = {
-            contentType: props.collection.contentType,
-            contentId: props.collection.contentId
-        }
-        addCollection(data).then(resp => {
-            queryConnection()
-        })
-    }
-
-    function queryConnection() {
-        let data = {
-            contentType: props.collection.contentType,
-            contentId: props.collection.contentId
-        }
-        getCollection(data).then(resp => {
-            collectionList.value = resp.collection
-        })
-    }
-
-    function cancle_collection() {
-        let data = {
-            id: collectionList.value[0].id,
-        }
-        removeCollection(data).then(resp => {
-            queryConnection()
-        })
-    }
+import {addCollection, getCollection, removeCollection} from '@/api/xjc-integratedmachine/environment/university.js'
+
+const props = defineProps({
+  collection: {
+    contentType: null,
+    contentId: null
+  }
+})
+
+const collectionList = ref([])
+
+function collection() {
+  let data = {
+    contentType: props.collection.contentType,
+    contentId: props.collection.contentId
+  }
+  addCollection(data).then(resp => {
+    queryConnection()
+  })
+}
+
+function queryConnection() {
+  let data = {
+    contentType: props.collection.contentType,
+    contentId: props.collection.contentId
+  }
+  getCollection(data).then(resp => {
+    collectionList.value = resp.collection
+  })
+}
+
+function cancle_collection() {
+  let data = {
+    id: collectionList.value[0].id,
+  }
+  removeCollection(data).then(resp => {
+    queryConnection()
+  })
+}
 
 </script>
 
-<style scoped>
+<style scoped lang="scss">
+p,div{
+  margin: 0;
+  padding: 0;
+}
+.item-img {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  width: 400px;
+  border: 1px solid;
+  p {
+    font-weight: 400;
+    font-size: 20px;
+    color: #515F6A;
+  }
 
+  img {
+    width: 36px;
+    height: 36px;
+    border: 1px solid;
+  }
+}
 </style>

src/views/xjc-integratedmachine/components/head_component.vue

@@ -11,7 +11,8 @@
         <div class="right-user">
           <img  src="@/assets/images/wakeup/user.png" @click="backTo" alt="404">
         </div>
-        <el-button class="head-right-btn1" >使用说明</el-button>
+        <el-button class="head-right-btn1" v-if="headinfo.isHome">使用说明</el-button>
+        <el-button class="head-right-btn1" v-else @click="homeUrlTo">首页</el-button>
         <el-button class="head-right-btn2" @click="exit">退出登录</el-button>
       </div>
 <!--      </div>-->
@@ -35,7 +36,14 @@
         router.go(-1);
       }
     }
+    function homeUrlTo() {
+        router.push({
+          path: props.headinfo.homeUrl
+        })
+
 
+
+    }
     function exit() {
         proxy.$modal.confirm('您确认退出吗').then(function () {
             router.push({

src/views/xjc-integratedmachine/environment/index.vue

@@ -29,12 +29,13 @@ const headinfo = ref({})
 
 function setHeadinfo(){
   headinfo.value = {
-    title: '生涯唤醒学习系统',
+    title: '环境探索学习系统',
     user: {
       avatar: '头像路径',
       nickName: '张三'
     },
-    backUrl : '/xjc-integratedmachine/wakeup/index'
+    backUrl : '/xjc-integratedmachine/index',
+    isHome:true,
   }
 }
 

src/views/xjc-integratedmachine/environment/query_universitydb_conditions.vue

@@ -1,12 +1,12 @@
 <template>
-  <div class="wake-up-page">
+  <div class="query_universitydb_conditions">
     <head-component :headinfo=headinfo></head-component>
     <div class="page-content">
       <div class="content-left">
         <div class="tab-box">
           <div :class="[onePage?'item-box-active':'item-box']" @click="showPage(1)">
-               <img v-if="onePage" src="@/assets/images/environment/condition-search-h.png">
-               <img v-else src="@/assets/images/environment/condition-search.png">
+            <img v-if="onePage" src="@/assets/images/environment/condition-search-h.png">
+            <img v-else src="@/assets/images/environment/condition-search.png">
             条件查询
           </div>
           <div :class="[twoPage?'item-box-active':'item-box']" @click="showPage(2)">
@@ -18,10 +18,21 @@
       </div>
       <div class="content-right">
         <div class="one-page" v-show="onePage">
-          <div>
-            <img  src="@/assets/images/environment/search-card1.png">
-            <img  src="@/assets/images/environment/search-card2.png">
-            <img  src="@/assets/images/environment/search-card3.png">
+          <div class="top">
+            <img src="@/assets/images/environment/search-card1.png" @click="showAreaChooseHandler">
+            <img src="@/assets/images/environment/search-card2.png" @click="showEducationlevelHandler">
+            <img src="@/assets/images/environment/search-card3.png" @click="showCharacteristicHandler">
+          </div>
+          <div class="search-btn">
+            <p v-show="form.educationlevelName || form.areaname || form.characteristicName">
+              <span style="margin-right: 3px;margin-left: 3px">已选择条件:</span>
+              <span style="margin-right: 3px;margin-left: 3px">{{form.educationlevelName}}</span>
+              <span v-show="form.areaname">|</span>
+              <span style="margin-right: 3px;margin-left: 3px">{{form.areaname}}</span>
+              <span v-show="form.characteristicName">|</span>
+              <span style="margin-right: 3px;margin-left: 3px">{{form.characteristicName}}</span>
+            </p>
+            <img @click="search" style="z-index:10" src="@/assets/images/environment/search-btn.png">
           </div>
         </div>
         <div class="two-page" v-show="twoPage">
@@ -36,27 +47,60 @@
                 <span style="font-size: 38px;color: #444040;margin-left: 37px;">
                   X
                 </span>
-<!--                <el-icon class="el-input__icon"><calendar /></el-icon>-->
-<!--                <img  src="@/assets/images/environment/condition-search-h.png">-->
               </template>
             </el-input>
           </div>
-          <div class="result-box" >
-          <div class="two-page-result">
+          <div class="result-box">
+            <div class="two-page-result">
 
-              <div v-for="(item,index) in universityList" :class="[item.selected?'item-result-box-active':'item-result-box']"
+              <div v-for="(item,index) in universityList"
+                   :class="[item.selected?'item-result-box-active':'item-result-box']"
                    @click="toDetail(item)">
                 <div v-html="item.name"></div>
               </div>
             </div>
-
-<!--            <div class="item-result-box-active">-->
-<!--              程序员计算机程序员计算机程序员计算机程序员计算机-->
-<!--            </div>-->
           </div>
         </div>
       </div>
       <drag_component></drag_component>
+
+    </div>
+    <div>
+      <!--院校属地-->
+      <el-dialog v-model="showAreaChoose" width="1000px" append-to-body>
+        <div class="dialog-box">
+          <div v-for="dict in gk_province" :key="dict.value" @click="chooseArea(dict)">
+            <p>
+              {{ dict.label }}
+            </p>
+          </div>
+        </div>
+      </el-dialog>
+
+    </div>
+    <div>
+      <!--学历层次-->
+      <el-dialog v-model="showEducationlevel" width="1000px" append-to-body>
+        <div class="dialog-box dialog-box2">
+          <div v-for="dict in educationlevel" :key="dict.value" @click="chooseEducationlevel(dict)">
+            <p>
+              {{ dict.label }}
+            </p>
+          </div>
+        </div>
+      </el-dialog>
+    </div>
+    <div>
+      <!--特色-->
+      <el-dialog v-model="showCharacteristic" width="1000px" append-to-body>
+        <div class="dialog-box">
+          <div v-for="dict in characteristic" :key="dict.value" @click="chooseCharacteristic(dict)">
+            <p>
+              {{ dict.label }}
+            </p>
+          </div>
+        </div>
+      </el-dialog>
     </div>
   </div>
 
@@ -74,6 +118,7 @@ const router = useRouter()
 const onePage = ref(true)
 const twoPage = ref(false)
 const threePage = ref(false)
+
 const form = ref({
   areaid: null,
   areaname: null,
@@ -81,18 +126,20 @@ const form = ref({
   educationlevelName: null,
   characteristic: null,
   characteristicName: null,
-  name : null
+  name: null
 })
 const keyInput = ref(false);
 const headinfo = ref({})
-function setHeadinfo(){
+
+function setHeadinfo() {
   headinfo.value = {
-    title: '生涯唤醒学习系统',
+    title: '高校信息查询',
     user: {
       avatar: '头像路径',
       nickName: '张三'
     },
-    backUrl : '/xjc-integratedmachine/wakeup/index'
+    backUrl: '/xjc-integratedmachine/environment/index',
+    homeUrl: '/xjc-integratedmachine/environment/index'
   }
 }
 
@@ -119,26 +166,29 @@ function jumpTo(path) {
     query: {name: 123}
   })
 }
+
 onMounted(() => {
   setHeadinfo()
 })
 const universityList = ref([])
+
 // 定义一个函数，用于将关键词变为红色
 function highlightKeywords(text, keywords) {
   // 遍历关键词列表
   keywords.forEach(keyword => {
     // 使用正则表达式匹配关键词，并替换为带有红色样式的HTML标签
     // 这里使用全局匹配标志'g'，以确保替换所有出现的关键词
-    console.log("keywords",keywords)
+    console.log("keywords", keywords)
     let regex = new RegExp(keyword, 'g');
     text = text.replace(regex, `<span style="color: #0DE6A1;">${keyword}</span>`);
-    console.log("text",text)
+    console.log("text", text)
   });
   return text;
 }
+
 function byKeyword() {
   getUniversityByKeyword(form.value).then(resp => {
-    resp.list.map(item =>{
+    resp.list.map(item => {
       item.selected = false;
       let keyWord = form.value.name
       item.name = highlightKeywords(item.name, [keyWord]);
@@ -153,19 +203,72 @@ function byKeyword() {
 
 function toDetail(row) {
   router.push({
-    path : '/xjc-integratedmachine/environment/university_details_video',
-    query : {
-      id : row.id,
-      name : row.name,
+    path: '/xjc-integratedmachine/environment/university_details_video',
+    query: {
+      id: row.id,
+      name: row.name,
     }
   })
 }
 
+
+const tab = ref("tj")
+
+function changeTab(path) {
+  tab.value = path
+}
+
+
+const showAreaChoose = ref(false)
+const showEducationlevel = ref(false)
+const showCharacteristic = ref(false)
+
+const {proxy} = getCurrentInstance()
+const {gk_province, educationlevel, characteristic} = proxy.useDict('gk_province', 'educationlevel', 'characteristic')
+
+
+function showAreaChooseHandler() {
+  showAreaChoose.value = true
+}
+
+function chooseArea(item) {
+  form.value.areaid = item.value
+  form.value.areaname = item.label
+  showAreaChoose.value = false
+}
+
+function showEducationlevelHandler() {
+  showEducationlevel.value = true
+}
+
+function chooseEducationlevel(item) {
+  form.value.educationlevel = item.value
+  form.value.educationlevelName = item.label
+  showEducationlevel.value = false
+}
+
+function showCharacteristicHandler() {
+  showCharacteristic.value = true
+}
+
+function chooseCharacteristic(item) {
+  form.value.characteristic = item.value
+  form.value.characteristicName = item.label
+  showCharacteristic.value = false
+}
+
+function search() {
+  router.push({
+    path: '/xjc-integratedmachine/environment/university_list',
+    query: form.value
+  })
+}
+
 </script>
 
 
 <style scoped lang="scss">
-.wake-up-page {
+.query_universitydb_conditions {
   background: url('@/assets/images/login/login-home-background.png') no-repeat;
   background-size: 1920px 1080px;
   z-index: 10;
@@ -179,31 +282,36 @@ function toDetail(row) {
     bottom: 0;
     display: flex;
     justify-content: space-between;
+
     .content-left {
       width: 244px;
       height: 957px;
       background: rgba(255, 255, 255, 0.26);
+
       ::v-deep .el-menu-item .is-active {
         background: red !important;
       }
-      .item-box{
+
+      .item-box {
         width: 244px;
         height: 80px;
         color: #B3B3B3;
         display: flex;
         align-items: center;
-        margin-right:5px;
+        margin-right: 5px;
         font-weight: bold;
         font-size: 20px;
         background: #C8FFED;
-        img{
+
+        img {
           width: 28px;
           height: 28px;
-          margin-right:10px;
+          margin-right: 10px;
           margin-left: 40px;
         }
       }
-      .item-box-active{
+
+      .item-box-active {
         width: 244px;
         height: 80px;
         background: #1EC590;
@@ -212,86 +320,116 @@ function toDetail(row) {
         display: flex;
         color: #FFFFFF;
         line-height: 40px;
-        margin-right:5px;
+        margin-right: 5px;
         align-items: center;
-        img{
+
+        img {
           width: 28px;
           height: 28px;
-          margin-right:10px;
+          margin-right: 10px;
           margin-left: 40px;
         }
       }
     }
-    .content-right{
+
+    .content-right {
       width: 1615px;
       height: 926px;
       background: #FFFFFF;
       border-radius: 35px 35px 35px 35px;
       margin-top: 13px;
       margin-right: 24px;
-      .one-page{
-        div{
+
+      .one-page {
+        .top {
           display: flex;
           justify-content: space-around;
           align-items: center;
+          img {
+            width: 446px;
+            height: 239px;
+            margin-top: 271px;
+          }
         }
-        img{
-          width: 446px;
-          height: 239px;
+
+        .search-btn {
+          display: flex;
+          align-items: center;
+          flex-direction: column;
+          justify-content: space-around;
           margin-top: 271px;
+          img {
+            width: 244px;
+            height: 100px;
+          }
+          p{
+
+          }
+          span{
+            margin-left: 3px;
+          }
         }
       }
-      .two-page{
+
+      .two-page {
         display: flex;
         flex-direction: column;
         align-items: center;
 
-        .two-page-search{
-            margin-top: 57px;
-            ::v-deep .el-input__inner{
-              width: 1300px;
-              height: 84px;
-              font-size: 24px;
-              margin-left: 34px;
-            }
-          ::v-deep .el-input__suffix{
+        .two-page-search {
+          margin-top: 57px;
+
+          ::v-deep .el-input__inner {
+            width: 1300px;
+            height: 84px;
+            font-size: 24px;
+            margin-left: 34px;
+          }
+
+          ::v-deep .el-input__suffix {
             font-size: 100px;
             width: 100px;
             height: 100px;
 
           }
-          ::v-deep .el-input__wrapper{
+
+          ::v-deep .el-input__wrapper {
             background: #F5F9FA;
             box-shadow: none;
           }
         }
-        .result-box{
-           width: 1484px;
-           height: 750px;
-           overflow: auto;
-          .two-page-result{
+
+        .result-box {
+          width: 1484px;
+          height: 750px;
+          overflow: auto;
+
+          .two-page-result {
             display: flex;
             flex-wrap: wrap;
             justify-content: space-between;
             align-items: center;
-            .item-result-box-active{
+
+            .item-result-box-active {
               min-width: 320px;
               height: 92px;
-              background: linear-gradient( 180deg, #B6FFEF 0%, #C5EEFF 100%);
+              background: linear-gradient(180deg, #B6FFEF 0%, #C5EEFF 100%);
               box-shadow: inset 0px -2px 7px 0px #1E410E;
               border-radius: 5px 5px 5px 5px;
               border: 1px solid #A2F57F;
               font-weight: 400;
               font-size: 30px;
               color: #0DE6A1;
-              line-height:90px;
+              line-height: 90px;
               text-align: center;
               margin-left: 50px;
+              margin-right: 50px;
               margin-top: 32px;
               padding-left: 20px;
               padding-right: 20px;
             }
-            .item-result-box{
+
+            .item-result-box {
               min-width: 320px;
               height: 92px;
               background: #E0EEF4;
@@ -299,24 +437,26 @@ function toDetail(row) {
               font-weight: 400;
               font-size: 30px;
               color: #000000;
-              line-height:90px;
+              line-height: 90px;
               text-align: center;
               margin-left: 50px;
+              margin-right: 50px;
               margin-top: 32px;
               padding-left: 20px;
               padding-right: 20px;
             }
-            .item-result-box:hover{
+
+            .item-result-box:hover {
               min-width: 320px;
               height: 92px;
-              background: linear-gradient( 180deg, #B6FFEF 0%, #C5EEFF 100%);
+              background: linear-gradient(180deg, #B6FFEF 0%, #C5EEFF 100%);
               box-shadow: inset 0px -2px 7px 0px #1E410E;
               border-radius: 5px 5px 5px 5px;
               border: 1px solid #A2F57F;
               font-weight: 400;
               font-size: 30px;
               color: #000000;
-              line-height:90px;
+              line-height: 90px;
               text-align: center;
               margin-left: 50px;
               margin-top: 32px;
@@ -330,7 +470,38 @@ function toDetail(row) {
 
     }
   }
+
 }
 
+.dialog-box {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+
+  div {
+    //border: 1px solid;
+
+  }
+
+  p {
+    min-width: 120px;
+    padding-left: 10px;
+    padding-right:10px;
+    height: 60px;
+    margin-left: 10px;
+    margin-right: 10px;
+    border: 1px solid;
+    font-weight: 400;
+    font-size: 30px;
+    color: #333333;
+    text-align: center;
+    line-height: 60px;
+    border-radius: 10px;
+  }
+}
+.dialog-box2{
+     display: flex;
+     justify-content: space-around;
+}
 </style>
 

src/views/xjc-integratedmachine/environment/university_details_video.vue

@@ -4,49 +4,261 @@
     <div class="page-content">
       <div class="page-img-box">
         <div class="top-content">
-          <!--           <img :src= "`${baseUrl}`+ item.picPath" />-->
-          <div style="width: 154px;height: 154px;border: 1px solid;margin-left: 48px"></div>
+          <img :src="`${baseUrl}`+ entity.logo"/>
+          <!--          <div style="width: 154px;height: 154px;border: 1px solid;margin-left: 48px"></div>-->
           <div class="top-content-right">
             <div class="right-top">
-              <p class="title">title</p>
+              <p class="title">{{ entity.name }}</p>
               <div class="right-top-icon">
-                <div class="item-img">
-                  <img src="@/assets/images/environment/collage.png">
-                  <p>收藏</p>
-                </div>
-                <div class="item-img">
-                  <img src="@/assets/images/environment/contrast.png">
-                  <p>对比</p>
-                </div>
-
+                <collectionComponent :collection="collection_data"></collectionComponent>
               </div>
             </div>
-
             <div class="school-level-box">
-              <p class="school-level">98</p>
-              <p class="school-level"></p>
-              <p class="school-level"></p>
-              <p class="school-level"></p>
+              <p class="school-level" style="background-color: #B3FC7C" v-show="entity.nef==='1'">985</p>
+              <p class="school-level" style="background-color: #BBF88D" v-show="entity.too==='1'">211</p>
+              <p class="school-level" style="background-color: #8CE349" v-show="entity.istopschool==='1'">一流大学</p>
+              <p class="school-level" style="background-color: #9DFF51" v-show="entity.istopsubject==='1'">一流学科</p>
+              <p class="school-level" style="background-color: #8ADFC4" v-show="entity.self==='1'">强</p>
+              <p class="school-level" style="background-color: #1EC590" v-show="entity.graduate==='1'">研</p>
+            </div>
+            <div class="text-box">
+              <p style="width: 200px">创建时间:{{ entity.ctime }}</p>
+              <p style="width: 200px">所在地区:{{ entity.areaname }}</p>
+              学历层次:
+              <dict-tag style="width: 200px" :options="educationlevel" :value="entity.educationlevel"/>
+              办学性质:
+              <dict-tag :options="property" :value="entity.property"/>
+              院校类型:
+              <dict-tag :options="school_category" :value="entity.school_category"/>
             </div>
             <div class="text-box">
-              <p>创建时间:{{entity.ctime}}</p>
-              <p>所在地区:{{entity.areaname}}</p>
-              <p>学历层次:{{entity.educationlevel}}</p>
-              <p>办学性质:{{entity.property}}</p>
-              <p>院校类型:{{entity.school_category}}</p>
-              <p>院校隶属:{{entity.subjection}}:</p>
-              <p>通讯地址:{{entity.address}}</p>
+              <p style="width: 200px">院校隶属:{{ entity.subjection }}:</p>
+              <p>通讯地址:{{ entity.address }}</p>
             </div>
           </div>
         </div>
         <div class="bottom-content">
-
+          <div class="tab-box">
+            <div :class="[onePage?'item-box-active':'item-box']" @click="showPage(1)">
+              学校简介
+            </div>
+            <div :class="[twoPage?'item-box-active':'item-box']" @click="showPage(2)">
+              院校设置
+            </div>
+            <div :class="[threePage?'item-box-active':'item-box']" @click="showPage(3)">
+              学科专业
+            </div>
+            <div :class="[fourPage?'item-box-active':'item-box']" @click="showPage(4)">
+              奖励资助
+            </div>
+            <div :class="[fivePage?'item-box-active':'item-box']" @click="showPage(5)">
+              考分查询
+            </div>
+            <div :class="[sixPage?'item-box-active':'item-box']" @click="showPage(6)">
+              计划查询
+            </div>
+            <div :class="[senvenPage?'item-box-active':'item-box']" @click="showPage(7)">
+              招生章程
+            </div>
+            <div :class="[eightPage?'item-box-active':'item-box']" @click="showPage(8)">
+              学校视频
+            </div>
+          </div>
+          <div class="one-page" v-show="onePage">
+            <p class="title">学校简介</p>
+            <p class="info" v-html="entity.summary">
+            </p>
+          </div>
+          <div class="one-page" v-show="twoPage">
+            <p class="title">院系设置</p>
+            <p class="info" v-html="entity.collegeset">
+            </p>
+          </div>
+          <div class="one-page" v-show="threePage">
+            <p class="title">学科专业</p>
+            <p class="info" v-html="entity.specialtyintroduction">
+            </p>
+          </div>
+          <div class="one-page" v-show="fourPage">
+            <p class="title">奖励资助</p>
+            <p class="info" v-html="entity.incentivegrant">
+            </p>
+          </div>
+          <div class="one-page" v-show="fivePage">
+            <div class="select-div">
+              <p>招生地区:</p>
+              <p class="select-box" @click="showAreaChooseHandler">
+                <span v-if="form.areaname">{{ form.areaname }}</span>
+                <span v-else>请选择</span>
+              </p>
+              <p style="margin-left: 20px">考生类别：
+              </p>
+              <p class="select-box" @click="showCategoryHandler">
+                <span v-if="form.categoryName">{{ form.categoryName }}</span>
+                <span v-else>请选择</span>
+              </p>
+              <p class="select-box click-search" @click="getScore">点击查询</p>
+            </div>
+            <el-table :data="kf_tableData">
+              <el-table-column label="招生年份" align="center" key="years" prop="years" style="height: 95px"/>
+              <el-table-column label="录取批次" align="center" key="batchname" prop="batchname" style="height: 95px"/>
+              <el-table-column label="最低分" align="center" key="lowscore" prop="lowscore" style="height: 95px"/>
+              <el-table-column label="最低分位次" align="center" key="totalorder" prop="totalorder" style="height: 95px"
+                               ya/>
+            </el-table>
+          </div>
+          <div class="one-page" v-show="sixPage">
+            <div class="select-div">
+              <p>招生地区:</p>
+              <p class="select-box" @click="showAreaChooseHandler">
+                <span v-if="form.areaname">{{ form.areaname }}</span>
+                <span v-else>请选择</span></p>
+              <p style="margin-left: 20px">年份:</p>
+              <p class="select-box" @click="showGradeHandler">
+                <span v-if="form.grade">{{ form.grade }}</span>
+                <span v-else>请选择</span></p>
+              <p style="margin-left: 20px">考生类别:</p>
+              <p class="select-box" @click="showCategoryHandler">
+                <span v-if="form.categoryName">{{ form.categoryName }}</span>
+                <span v-else>请选择</span>
+              </p>
+              <p class="select-box click-search" @click="getPlan">点击查询</p>
+            </div>
+            <el-table :data="jh_tableData">
+              <el-table-column label="招生年份" align="center" key="years" prop="years"/>
+              <el-table-column label="专业名称" align="center" key="enrollname" prop="enrollname"/>
+              <el-table-column label="大学学制" align="center" key="studyyears" prop="studyyears"/>
+              <el-table-column label="批次" align="center" key="batch_name" prop="batch_name"/>
+              <el-table-column label="计划招生人数" align="center" key="plannum" prop="plannum"/>
+              <el-table-column label="学费" align="center" key="fee" prop="fee"/>
+            </el-table>
+          </div>
+          <div class="one-page" v-show="senvenPage">
+            <p class="title">学校简介</p>
+            <p class="info" v-html="entity.sturecruitmen">
+            </p>
+          </div>
+          <div class="one-page" v-show="eightPage">
+            <p class="title">学校视频</p>
+          </div>
         </div>
       </div>
       <drag_component></drag_component>
     </div>
   </div>
-
+  <el-dialog
+      v-model="sixPage"
+      destroy-on-close
+      title=""
+      width="90%"
+      height="910px"
+      style="width: 90%;height: 910px;"
+      center
+      align-center
+  >
+    <div class="one-page" style="width: 1658px" v-show="sixPage">
+      <div class="select-div">
+        <p>招生地区:</p>
+        <p class="select-box" @click="showAreaChooseHandler">
+          <span v-if="form.areaname">{{ form.areaname }}</span>
+          <span v-else>请选择</span></p>
+        <p style="margin-left: 20px">年份:</p>
+        <p class="select-box" @click="showGradeHandler">
+          <span v-if="form.grade">{{ form.grade }}</span>
+          <span v-else>请选择</span></p>
+        <p style="margin-left: 20px">考生类别:</p>
+        <p class="select-box" @click="showCategoryHandler">
+          <span v-if="form.categoryName">{{ form.categoryName }}</span>
+          <span v-else>请选择</span>
+        </p>
+        <p class="select-box click-search" @click="getPlan">点击查询</p>
+      </div>
+      <el-table :data="jh_tableData">
+        <el-table-column label="招生年份" align="center" key="years" prop="years"/>
+        <el-table-column label="专业名称" align="center" key="enrollname" prop="enrollname"/>
+        <el-table-column label="大学学制" align="center" key="studyyears" prop="studyyears"/>
+        <el-table-column label="批次" align="center" key="batch_name" prop="batch_name"/>
+        <el-table-column label="计划招生人数" align="center" key="plannum" prop="plannum"/>
+        <el-table-column label="学费" align="center" key="fee" prop="fee"/>
+      </el-table>
+    </div>
+  </el-dialog>
+  <el-dialog
+      v-model="fivePage"
+      destroy-on-close
+      title=""
+      width="90%"
+      height="910px"
+      style="width: 90%;height: 910px;"
+      center
+      align-center
+  >
+    <div class="one-page" style="width: 1658px" v-show="fivePage">
+      <div class="select-div">
+        <p>招生地区:</p>
+        <p class="select-box" @click="showAreaChooseHandler">
+          <span v-if="form.areaname">{{ form.areaname }}</span>
+          <span v-else>请选择</span>
+        </p>
+        <p style="margin-left: 20px">考生类别：
+        </p>
+        <p class="select-box" @click="showCategoryHandler">
+          <span v-if="form.categoryName">{{ form.categoryName }}</span>
+          <span v-else>请选择</span>
+        </p>
+        <p class="select-box click-search" @click="getScore">点击查询</p>
+      </div>
+      <el-table :data="kf_tableData">
+        <el-table-column label="招生年份" align="center" key="years" prop="years" style="height: 95px"/>
+        <el-table-column label="录取批次" align="center" key="batchname" prop="batchname" style="height: 95px"/>
+        <el-table-column label="最低分" align="center" key="lowscore" prop="lowscore" style="height: 95px"/>
+        <el-table-column label="最低分位次" align="center" key="totalorder" prop="totalorder" style="height: 95px"
+                         ya/>
+      </el-table>
+    </div>
+  </el-dialog>
+  <div>
+    <!--招生地区-->
+    <el-dialog v-model="showAreaChoose" width="600px" append-to-body>
+      <div class="dict-dialog">
+        <div class="dict-box" v-for="dict in gk_province" :key="dict.value" @click="chooseArea(dict)">{{
+            dict.label
+          }}
+        </div>
+      </div>
+    </el-dialog>
+    <!--考生类别-->
+    <el-dialog v-model="showCategoryChoose" width="600px" append-to-body>
+      <div class="dict-dialog">
+        <div class="dict-box" v-for="dict in category" :key="dict.value" @click="chooseCategory(dict)">{{
+            dict.label
+          }}
+        </div>
+      </div>
+    </el-dialog>
+    <!--年份-->
+    <el-dialog v-model="showGradeChoose" width="600px" append-to-body>
+      <div class="dict-dialog">
+        <div class="dict-box" v-for="item in grade" :key="item" @click="chooseGrade(item)">{{ item }}</div>
+      </div>
+    </el-dialog>
+    <el-dialog
+        v-model="eightPage"
+        @before-close="dialogBeforeClose"
+        destroy-on-close
+        title="学校视频"
+        width="1832px"
+        height="915px"
+        center
+        align-center
+    >
+      <div class="video-content" v-if="entity.path">
+        <video ref="videoPlayer" video preload="auto" autoplay muted controls width="1798" height="900">
+          <source :src="entity.path" type="video/mp4">
+        </video>
+      </div>
+    </el-dialog>
+  </div>
 </template>
 <script setup>
 import headComponent from '@/views/xjc-integratedmachine/components/head_component.vue'
@@ -63,7 +275,7 @@ import 'video.js/dist/video-js.css';
 
 import collectionComponent from '@/views/xjc-integratedmachine/components/collection_component.vue'
 import {ref} from "vue";
-
+import {getConfigKey} from "@/api/system/config.js";
 
 
 const showAreaChoose = ref(false)
@@ -75,17 +287,23 @@ const route = useRoute()
 
 const param = route.query
 const showIndex = ref(1)
+const baseUrl = ref()
 
 const collection_data = ref({
-  contentType : 1,
-  contentId :param.id
+  contentType: 1,
+  contentId: param.id
 })
-
 const grade = ref([])
 
 const {proxy} = getCurrentInstance()
 
-const {gk_province, category, educationlevel, property, school_category} = proxy.useDict('gk_province', 'category', 'educationlevel', 'property', 'school_category')
+const {
+  gk_province,
+  category,
+  educationlevel,
+  property,
+  school_category
+} = proxy.useDict('gk_province', 'category', 'educationlevel', 'property', 'school_category')
 
 const form = ref({
   area: null,
@@ -96,14 +314,24 @@ const form = ref({
 const entity = ref({})
 const collectionList = ref([])
 const headinfo = ref({})
+const onePage = ref(true)
+const twoPage = ref(false)
+const threePage = ref(false)
+const fourPage = ref(false)
+const fivePage = ref(false)
+const sixPage = ref(false)
+const senvenPage = ref(false)
+const eightPage = ref(false)
+
 function setHeadinfo(){
   headinfo.value = {
-    title: '生涯唤醒学习系统',
+    title: '高校信息查询',
     user: {
       avatar: '头像路径',
       nickName: '张三'
     },
-    backUrl : '/xjc-integratedmachine/wakeup/index'
+    backUrl : '/xjc-integratedmachine/environment/query_universitydb_conditions',
+    homeUrl:'/xjc-integratedmachine/environment/index'
   }
 }
 
@@ -181,6 +409,17 @@ function getScore() {
   })
 }
 
+function dialogBeforeClose() {
+  onePage.value = true;
+  twoPage.value = false;
+  threePage.value = false;
+  fourPage.value = false;
+  fivePage.value = false;
+  sixPage.value = false
+  senvenPage.value = false
+  eightPage.value = false;
+}
+
 const jh_tableData = ref([])
 
 function getPlan() {
@@ -204,6 +443,7 @@ function collection() {
     queryConnection()
   })
 }
+
 function queryConnection() {
   let data = {
     contentType: 1,
@@ -213,6 +453,7 @@ function queryConnection() {
     collectionList.value = resp.collection
   })
 }
+
 function cancle_collection() {
   let data = {
     id: collectionList.value[0].id,
@@ -224,40 +465,94 @@ function cancle_collection() {
 
 
 detail()
+const showPage = (val) => {
+  if (val === 1) {
+    onePage.value = true;
+    twoPage.value = false;
+    threePage.value = false;
+    fourPage.value = false;
+    fivePage.value = false;
+    sixPage.value = false
+    senvenPage.value = false
+    eightPage.value = false;
+  } else if (val === 2) {
+    onePage.value = false;
+    twoPage.value = true;
+    threePage.value = false;
+    fourPage.value = false;
+    fivePage.value = false;
+    sixPage.value = false
+    senvenPage.value = false
+    eightPage.value = false;
+  } else if (val === 3) {
+    onePage.value = false;
+    twoPage.value = false;
+    threePage.value = true;
+    fourPage.value = false;
+    fivePage.value = false;
+    sixPage.value = false
+    senvenPage.value = false
+    eightPage.value = false;
+  } else if (val === 4) {
+    onePage.value = false;
+    twoPage.value = false;
+    threePage.value = false;
+    fourPage.value = true;
+    fivePage.value = false;
+    sixPage.value = false
+    senvenPage.value = false
+    eightPage.value = false;
+  } else if (val === 5) {
+    onePage.value = false;
+    twoPage.value = false;
+    threePage.value = false;
+    fourPage.value = false;
+    fivePage.value = true;
+    sixPage.value = false
+    senvenPage.value = false
+    eightPage.value = false;
+  } else if (val === 6) {
+    onePage.value = false;
+    twoPage.value = false;
+    threePage.value = false;
+    fourPage.value = false;
+    fivePage.value = false;
+    sixPage.value = true
+    senvenPage.value = false
+    eightPage.value = false;
+  } else if (val === 7) {
+    onePage.value = false;
+    twoPage.value = false;
+    threePage.value = false;
+    fourPage.value = false;
+    fivePage.value = false;
+    sixPage.value = false
+    senvenPage.value = true
+    eightPage.value = false;
+  } else if (val === 8) {
+    onePage.value = false;
+    twoPage.value = false;
+    threePage.value = false;
+    fourPage.value = false;
+    fivePage.value = false;
+    sixPage.value = false
+    senvenPage.value = false;
+    eightPage.value = true;
+  }
+  //清空数据
+  form.area = '';
+  form.areanam = '';
+  form.university = '';
+  form.categoryName = '';
+}
 
+onMounted(() => {
+  proxy.getConfigKey('sys_resource_root2').then(res => {
+    baseUrl.value = res.msg;
+  })
+  setHeadinfo()
+})
 </script>
-<!--<script setup>-->
-<!--import headComponent from '@/views/xjc-integratedmachine/components/head_component.vue'-->
-<!--import Drag_component from "@/views/xjc-integratedmachine/components/drag_component.vue";-->
-
-<!--const router = useRouter()-->
-
-<!--const headinfo = ref({})-->
-
-<!--function setHeadinfo() {-->
-<!--  headinfo.value = {-->
-<!--    title: '生涯唤醒学习系统',-->
-<!--    user: {-->
-<!--      avatar: '头像路径',-->
-<!--      nickName: '张三'-->
-<!--    },-->
-<!--    backUrl: '/xjc-integratedmachine/wakeup/index'-->
-<!--  }-->
-<!--}-->
-
-
-<!--function jumpTo(path) {-->
-<!--  router.push({-->
-<!--    path: path,-->
-<!--    query: {name: 123}-->
-<!--  })-->
-<!--}-->
-
-<!--onMounted(() => {-->
-<!--  setHeadinfo()-->
-<!--})-->
-<!--</script>-->
-
 
 <style scoped lang="scss">
 p, div {
@@ -289,7 +584,7 @@ p, div {
     border-radius: 35px 35px 35px 35px;
     display: flex;
     //justify-content: space-around;
-    //flex-direction: column;
+    flex-direction: column;
     //align-items: center;
 
     .top-content {
@@ -297,7 +592,7 @@ p, div {
       height: 282px;
       border: 1px solid;
       display: flex;
-      justify-content: center;
+      justify-content: space-between;
       align-items: center;
 
       .top-content-right {
@@ -305,6 +600,7 @@ p, div {
         width: 1630px;
         height: 281px;
         border: 1px solid;
+        margin-left: 45px;
 
         .title {
           font-weight: bold;
@@ -334,11 +630,12 @@ p, div {
         }
 
         .text-box {
-          width: 100%;
+          width: 1124px;
           display: flex;
-          justify-content: space-around;
+          //justify-content: space-between;
           align-items: center;
           flex-wrap: wrap;
+          margin-top: 14px;
 
           p {
             margin-right: 20px;
@@ -351,12 +648,13 @@ p, div {
           align-items: center;
 
           .right-top-icon {
-            width: 100px;
+            width: 200px;
             height: 68px;
             border: 1px solid;
             display: flex;
             justify-content: space-between;
             margin-top: 24px;
+
             .item-img {
               display: flex;
               flex-direction: column;
@@ -368,6 +666,7 @@ p, div {
                 color: #515F6A;
 
               }
+
               img {
                 width: 36px;
                 height: 36px;
@@ -376,63 +675,179 @@ p, div {
             }
           }
         }
+
       }
     }
 
   }
 
-  .content-bottom {
-    width: 100%;
-    display: flex;
-    justify-content: space-between;
-    position: relative;
 
-    .draw {
-      width: 109px;
-      height: 170px;
-      margin-left: 100px;
+  .bottom-content {
+    margin-top: 25px;
+    //width:100px;
+    .tab-box {
+      display: flex;
+      padding-right: 279px;
 
       img {
-        width: 109px;
-        height: 170px;
+        width: 36px;
+        height: 36px;
+        margin-right: 12px;
       }
     }
 
-    .ai-rabit {
-      position: absolute;
-      right: 100px;
-      top: -50px;
+
+    .item-box {
+      text-align: center;
       display: flex;
+      justify-content: center;
       align-items: center;
+      width: 202px;
+      height: 65px;
+      box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.09);
+      border-radius: 5px 5px 0px 0px;
+      font-weight: 400;
+      font-size: 32px;
+      color: #979797;
+    }
 
-      .ai-rabit-text {
-        width: 345px;
-        height: 89px;
-        background: #E8EEF7;
-        font-weight: 300;
-        margin-bottom: 20px;
-        font-size: 22px;
-        color: #000000;
-        padding: 16px;
-        border-radius: 24px 24px 24px 24px;
-      }
-
-      img {
-        width: 178px;
-        height: 270px;
-      }
+    .item-box-active {
+      text-align: center;
+      color: #000000;
+      background: #FFFFFF;
+      font-weight: bold;
+      font-size: 32px;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      width: 202px;
+      height: 65px;
+      background: #FFFFFF;
+      box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.09);
+      border-radius: 5px 5px 0px 0px;
     }
   }
 
+  .editor-content div,
+  .editor-content span,
+  .editor-content p,
+  .editor-content h1,
+  .editor-content h2,
+  .editor-content h3,
+  .editor-content h4,
+  .editor-content h5,
+  .editor-content h6 {
+    font-size: 26px !important;
+    line-height: 37px !important;
+  }
+
+  .editor-content div,
+  .editor-content span,
+  .editor-content p {
+    text-indent: 2em !important;
+    text-align: left !important;
+  }
 }
 
-.temp {
-  width: 20vw;
-  height: 10vh;
-  background: #85eff5;
-  border: solid 1px #a2fffc;
-  border-radius: 10px;
-  cursor: pointer;
+.one-page {
+  width: 1832px;
+  height: 547px;
+  background: #FFFFFF;
+  border-radius: 0px 0px 35px 35px;
+  border: 1px solid #FFFFFF;
+  overflow: auto;
+  padding-left: 33px;
+  padding-right: 33px;
+  line-height: 32px;
+
+  .title {
+    height: 40px;
+    border-left: 8px #8CE349 solid;
+    margin-top: 33px;
+    margin-left: 33px;
+    font-weight: 400;
+    font-size: 28px;
+    color: #333333;
+    line-height: 40px;
+    padding-left: 11px;
+  }
+
+  .info {
+    text-indent: 2em;
+    font-weight: 400;
+    font-size: 28px;
+    color: #333333;
+    line-height: 40px;
+  }
+
+  .select-div {
+    width: 100%;
+    height: 100px;
+    font-weight: 400;
+    font-size: 30px;
+    color: #333333;
+    line-height: 40px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    margin-bottom: 21px;
+
+    .select-box {
+      width: 300px;
+      height: 90px;
+      border: 1px solid #CCCCCC;
+      line-height: 90px;
+      text-align: center;
+      margin-left: 10px;
+    }
+
+    .click-search {
+      width: 170px;
+      height: 90px;
+      background: linear-gradient(180deg, #73EE71 0%, #0ACB63 100%);
+      border-radius: 5px;
+      font-weight: 400;
+      font-size: 24px;
+      color: #FFFFFF;
+      margin-left: 20px;
+    }
+  }
+
+  ::v-deep .el-table .el-table__header-wrapper th, .el-table .el-table__fixed-header-wrapper th {
+    height: 74px !important;
+    font-size: 24px;
+    color: #1E410E;
+  }
+
+  ::v-deep .el-table tr {
+    height: 74px !important;
+    font-size: 20px;
+  }
+
+  ::v-deep .el-dialog__title {
+    font-size: 34px !important;
+  }
+
+  ::v-deep .el-dialog {
+    margin-top: 0px !important;
+  }
+
+  ::v-deep .el-dialog__headerbtn .el-dialog__close {
+    font-size: 30px !important;
+  }
+
+}
+.dict-dialog{
+  max-width: 570px;
+  height: 800px;
+  overflow: auto;
+  .dict-box {
+    //border: 1px solid red;
+    //background: #1ab394;
+    font-size: 24px;
+    line-height: 34px;
+    color: #333333;
+  }
 }
 
 </style>