Merge remote-tracking branch 'origin/master'

src/api/xjc-integratedmachine/environment/university.js

@@ -76,3 +76,10 @@ export function getUniversityByKeyword(data) {
         data: data
     })
 }
+export function getScoreInfo(data) {
+    return request({
+        url: '/integratedmachine/tsytj/university/getScoreInfo',
+        method: 'post',
+        data: data
+    })
+}

src/router/router_environment.js

@@ -158,9 +158,15 @@ const router = [
         path: '/xjc-integratedmachine/environment/ai_career_interview2',
         component: () => import('@/views/xjc-integratedmachine/environment/ai_career_interview2.vue'),
     },
+    //高校对比
     {
-        path: '/xjc-integratedmachine/environment/contrast_data',
-        component: () => import('@/views/xjc-integratedmachine/environment/contrast_data.vue'),
+        path: '/xjc-integratedmachine/environment/contrast_university',
+        component: () => import('@/views/xjc-integratedmachine/environment/contrast_university.vue'),
+    },
+    //专业对比
+    {
+        path: '/xjc-integratedmachine/environment/contrast_major',
+        component: () => import('@/views/xjc-integratedmachine/environment/contrast_major.vue'),
     }
 ]
 export default {

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

@@ -1,6 +1,4 @@
 <template>
-
-
     <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>
@@ -21,11 +19,13 @@ import {addCollection, getCollection, removeCollection} from '@/api/xjc-integrat
 import {ElMessage} from "element-plus";
 import {handleThemeStyle} from "@/utils/theme.js";
 import useSettingsStore from "@/store/modules/settings.js";
+import { defineExpose } from 'vue';
 const props = defineProps({
   collection: {
     contentType: null,
     contentId: null,
     contentVal:null,
+    source:null
   }
 })
 
@@ -40,71 +40,68 @@ function collection() {
     queryConnection()
   })
 }
-//查询详情中学校是否被加入对比列表
-function isContrast (){
-  let isValA = sessionStorage.getItem('contrastA') && JSON.parse(sessionStorage.getItem('contrastA')) || false
-  let isValB = sessionStorage.getItem('contrastB') && JSON.parse(sessionStorage.getItem('contrastB')) || false
-  // console.log('isValA',isValA.id,isValB.id,"isValB",props.collection.contentId)
-  // debugger;
-  if(isValA && props.collection.contentId === isValA.id){
-    isContrastVal.value = true;
-  }else if(isValB && props.collection.contentId === isValB.id){
-    isContrastVal.value = true;
+let SESSION_COLLECT_KEY = 'contrastList'
+function getSource (source){
+  console.log("11111",source);
+  if(props.collection.source === 'pro_details_video' || source ===  'pro_details_video'){
+    SESSION_COLLECT_KEY = 'majorList'
   }else {
+    SESSION_COLLECT_KEY = 'contrastList'
+  }
+}
+//查询详情中学校是否被加入对比列表
+function isContrast (val,source){
+  let collectArrayStr = window.sessionStorage.getItem(SESSION_COLLECT_KEY);
+  // 如果有值
+  if(collectArrayStr){
+    let collectArray = JSON.parse(collectArrayStr);
+    isContrastVal.value = collectArrayStr.includes(JSON.stringify(val.value));
+  }
+  // 如果没有值
+  else{
     isContrastVal.value = false;
   }
-  // console.log("isContrastVal.value",isContrastVal.value)
 }
+
 function contrastAdd(){
-  let isValA = sessionStorage.getItem('contrastA') || false;
-  let isValB = sessionStorage.getItem('contrastB')|| false;
-//加入对比；
- if(isValA && isValB){
-   ElMessage({
-     type: 'success',
-     message: '对比列表已有两组学校数据',
-   })
- }else if(isValA && !isValB){
-   sessionStorage.setItem('contrastB',JSON.stringify(props.collection.contentVal));
-   ElMessage({
-     type: 'success',
-     message: '加入对比成功，可以去对比列表查看',
-   })
- }else if(!isValA){
-   sessionStorage.setItem('contrastA',JSON.stringify(props.collection.contentVal));
-   ElMessage({
-     type: 'success',
-     message: '成功加入对比列表',
-   })
- }
-  isContrast()
+  let contrastArrayStr = sessionStorage.getItem(SESSION_COLLECT_KEY)
+  if(contrastArrayStr){
+    let contrastArray = JSON.parse(contrastArrayStr);
+    if(contrastArray.includes(JSON.stringify(props.collection.contentVal))){
+      ElMessage.error('已加入，不可以在加入对比列表')
+    }else{
+      if(contrastArray.length == 2){
+        ElMessage.error('对比列表已满')
+      }else{
+        contrastArray.push(props.collection.contentVal);
+        window.sessionStorage.setItem(SESSION_COLLECT_KEY,  JSON.stringify(contrastArray));
+        isContrastVal.value = true;
+        ElMessage.success('加入对比成功');
+      }
+    }
+  }
+  // 如果没有值
+  else{
+    let contrastArray = new Array();
+  contrastArray.push(props.collection.contentVal);
+  window.sessionStorage.setItem(SESSION_COLLECT_KEY, JSON.stringify(contrastArray));
+  isContrastVal.value = true;
+  ElMessage.success('加入对比成功');
+  }
 }
 function contrastCancel(){
-  let isValA = sessionStorage.getItem('contrastA') && JSON.parse(sessionStorage.getItem('contrastA')) || false;
-  let isValB = sessionStorage.getItem('contrastB') && JSON.parse(sessionStorage.getItem('contrastB'))|| false;
-  //取消对比；
-
-  if(isContrastVal.value){
-    // console.log("1",isValA,props.collection.contentId,)
-    if(isValA && props.collection.contentId === isValA.id){
-      sessionStorage.removeItem('contrastA');
+  let collectArrayStr = window.sessionStorage.getItem(SESSION_COLLECT_KEY);
+  // 如果有值
+  if(collectArrayStr){
+    let collectArray = JSON.parse(collectArrayStr);
+    if(collectArrayStr.includes(JSON.stringify(props.collection.contentVal))){
+      let index = collectArray.indexOf(props.collection.contentVal);
+      collectArray.splice(index, 1);
+      window.sessionStorage.setItem(SESSION_COLLECT_KEY, JSON.stringify(collectArray));
       isContrastVal.value = false;
-      // console.log("1")
-      ElMessage({
-        type: 'info',
-        message: '已取消对比',
-      })
-    }else if(isValB && props.collection.contentId === isValB.id){
-      sessionStorage.removeItem('contrastB');
-      isContrastVal.value = false;
-      // console.log("2")
-      ElMessage({
-        type: 'info',
-        message: '已取消对比',
-      })
+      ElMessage.success('取消对比成功')
     }
-  }console.log("isContrastVal",isContrastVal.value)
-  isContrast()
+  }
 }
 function queryConnection() {
   let data = {
@@ -116,9 +113,7 @@ function queryConnection() {
   })
 }
 onMounted(() => {
-  nextTick(() => {
-    isContrast()
-  })
+  getSource()
 })
 function cancle_collection() {
   let data = {
@@ -128,6 +123,9 @@ function cancle_collection() {
     queryConnection()
   })
 }
+defineExpose({
+  isContrast,getSource
+})
 
 </script>
 

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

@@ -7,7 +7,9 @@
       <div class="head-title">
         <div v-if="headinfo.title">{{headinfo.title}}</div>
       </div>
-      <img v-show="headinfo.contrast" class="contrast" src="@/assets/images/environment/contrast-btn.png" @click="contrastTo">
+      <div class="contrast-box">
+        <img  v-show="headinfo.contrast" class="contrast" src="@/assets/images/environment/contrast-btn.png" @click="contrastTo">
+      </div>
       <div class="head-right" v-if="!headinfo.isLogin">
         <div class="right-user">
           <img  src="@/assets/images/wakeup/user.png" @click="backTo" alt="404">
@@ -16,13 +18,10 @@
         <el-button class="head-right-btn1" v-else @click="homeUrlTo">首页</el-button>
         <el-button class="head-right-btn2" @click="exit">退出登录</el-button>
       </div>
-<!--      </div>-->
     </div>
-
 </template>
 
 <script setup>
-
     import {ElMessage} from "element-plus";
     import {defineEmits} from "vue";
     const {proxy} = getCurrentInstance()
@@ -39,8 +38,12 @@
       }else {
         router.go(-1);
       }
-      emit('backTo');
-
+      // emit('backTo');
+      // clearData()
+    }
+    function clearData(){
+      sessionStorage.removeItem('contrastList');
+      sessionStorage.removeItem('majorList');
     }
     function homeUrlTo() {
         router.push({
@@ -48,9 +51,15 @@
         })
     }
     function contrastTo(){
-      const isValA = sessionStorage.getItem('contrastA');
-      const isValB = sessionStorage.getItem('contrastB');
-      if(isValA && isValB){
+      let contrastList = [];
+      if(props.headinfo.contrastType === 'major'){
+        console.log("major")
+         contrastList = JSON.parse(sessionStorage.getItem('majorList'));
+      }else if(props.headinfo.contrastType === 'university'){
+        console.log("university")
+         contrastList = JSON.parse(sessionStorage.getItem('contrastList'));
+      }
+      if(contrastList && contrastList.length <= 2 ){
        //暂无
       }else {
         ElMessage({
@@ -59,10 +68,20 @@
         })
         return;
       }
-      router.push({
-        path: '/xjc-integratedmachine/environment/contrast_data'
-      })
+
+      if(props.headinfo.contrastType === 'major'){
+        router.push({
+          path: '/xjc-integratedmachine/environment/contrast_major'
+        })
+      }else if(props.headinfo.contrastType === 'university'){
+        router.push({
+          path: '/xjc-integratedmachine/environment/contrast_university'
+        })
+      }
+
+
     }
+
     function exit() {
         proxy.$modal.confirm('您确认退出吗').then(function () {
             router.push({
@@ -103,10 +122,13 @@
         font-size: 48px;
         color: #060606;
       }
-      .contrast{
+      .contrast-box{
         width: 209px;
         height: 80px;
-        margin-top: 15px;
+        img{
+          width: 209px;
+          height: 80px;
+        }
       }
       .head-right{
           width:750px;

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

@@ -0,0 +1,956 @@
+<template>
+    <div class="contrast_university">
+        <head-component :headinfo=headinfo @backTo="backTo"></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">
+                        院校数据
+                    </div>
+                    <div :class="[twoPage?'item-box-active':'item-box']" @click="showPage(2)">
+                        <img v-if="twoPage" src="@/assets/images/environment/score-h.png">
+                        <img v-else src="@/assets/images/environment/score.png">
+                        录取分数线
+                    </div>
+                </div>
+            </div>
+            <div class="content-right">
+                <div class="one-page" v-show="onePage">
+                    <table class="table table-bordered">
+                        <thead>
+                        <tr class="one-tr">
+                            <td class="first-title">大学名称</td>
+                            <td v-for="(item,index) in contrastData" :key="index">{{ item.name }}</td>
+                        </tr>
+                        </thead>
+                        <tbody>
+                        <tr v-show="false"></tr>
+                        <tr class="two-tr">
+                            <td>基本信息</td>
+                            <td class="text-td" v-for="(item,index) in contrastData" :key="index">
+                                <p>创建时间：<span>{{ item.ctime }}</span></p>
+                                <p>所在地区：<span>{{ item.areaname }}</span></p>
+                                <p>院校隶属：<span>{{ item.subjection }}</span></p>
+                                <p class="text-td-p">院校类型：<span>  <dict-tag :options="school_category"
+                                                                            :value="item.categoryid"/></span></p>
+                            </td>
+                        </tr>
+                        <tr>
+                            <td>院校特色</td>
+                            <td v-for="(item,index) in contrastData" :key="index">
+                                <div class="school-level-box">
+                                    <p class="school-level" style="background-color: #B3FC7C" v-show="item.nef==='1'">
+                                        985</p>
+                                    <p class="school-level" style="background-color: #BBF88D" v-show="item.too==='1'">
+                                        211</p>
+                                    <p class="school-level" style="background-color: #8CE349"
+                                       v-show="item.istopschool==='1'">
+                                        一流大学</p>
+                                    <p class="school-level" style="background-color: #9DFF51"
+                                       v-show="item.istopsubject==='1'">
+                                        一流学科</p>
+                                    <p class="school-level" style="background-color: #8ADFC4" v-show="item.self==='1'">
+                                        强</p>
+                                    <p class="school-level" style="background-color: #1EC590"
+                                       v-show="item.graduate==='1'">研</p>
+                                </div>
+                            </td>
+                        </tr>
+                        <tr>
+                            <td>学校性质</td>
+                            <td v-for="(item,index) in contrastData" class="text-td ">
+                                <dict-tag :options="property" :value="item.property"/>
+                            </td>
+                        </tr>
+                        <tr>
+                            <td>学校地址</td>
+                            <td v-for="(item,index) in contrastData" :key="index" class="text-td">{{ item.address }}
+                            </td>
+                        </tr>
+                        </tbody>
+                    </table>
+                </div>
+                <div class="two-page" v-show="twoPage">
+<!--                  <table class="table table-bordered">-->
+<!--                    <thead>-->
+<!--                    <tr class="one-tr">-->
+<!--                      <td class="first-title">大学名称</td>-->
+<!--                      <td v-for="(item,index) in contrastData" :key="index">{{ item.name }}</td>-->
+<!--                    </tr>-->
+<!--                    </thead>-->
+<!--                    <tbody>-->
+<!--                    <tr v-show="false"></tr>-->
+<!--                    <tr class="two-tr">-->
+<!--                      <td>录取分数线</td>-->
+<!--&lt;!&ndash;                      <td><div v-for="(item,index) in contrastData" :key="index">&ndash;&gt;-->
+<!--&lt;!&ndash;                        {{ item.name }}&ndash;&gt;-->
+<!--&lt;!&ndash;                      </div></td>&ndash;&gt;-->
+<!--                      <td><div v-for="(item,index) in dbForm" :key="index">-->
+<!--                        {{ item.name }}-->
+<!--                      </div></td>-->
+<!--                    </tr>-->
+<!--                    </tbody>-->
+<!--                  </table>-->
+<!--                    对比 孙一石-->
+                    <select v-model="dbForm.area">
+                        <option v-for="dict in gk_province" :key="dict.value" :value="dict.value">{{dict.label}}
+                        </option>
+                    </select>
+                    <select v-model="dbForm.category">
+                        <option v-for="dict in candidate_category" :key="dict.value" :value="dict.value">
+                            {{dict.label}}
+                        </option>
+                    </select>
+                    <button @click="dbResult">对比结果</button>
+                </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>
+
+</template>
+
+<script setup>
+    import headComponent from '@/views/xjc-integratedmachine/components/head_component.vue'
+    import Drag_component from "@/views/xjc-integratedmachine/components/drag_component.vue";
+    import {ref} from "vue";
+    import {getUniversityByKeyword, getScoreInfo} from "@/api/xjc-integratedmachine/environment/university.js";
+
+
+    const router = useRouter()
+
+    const onePage = ref(true)
+    const twoPage = ref(false)
+    const threePage = ref(false)
+    const contrastList = ref(false)
+
+    const form = ref({
+        areaid: null,
+        areaname: null,
+        educationlevel: null,
+        educationlevelName: null,
+        characteristic: null,
+        characteristicName: null,
+        name: null
+    })
+    const keyInput = ref(false);
+    const headinfo = ref({})
+
+    function setHeadinfo() {
+        headinfo.value = {
+            title: '高校信息查询',
+            user: {
+                avatar: '头像路径',
+                nickName: '张三'
+            },
+            backUrl: '/xjc-integratedmachine/environment/index',
+            homeUrl: '/xjc-integratedmachine/environment/index'
+        }
+    }
+
+    //切换tabs
+    const showPage = (val) => {
+        if (val === 1) {
+            onePage.value = true;
+            twoPage.value = false;
+            threePage.value = false;
+        } else if (val === 2) {
+            onePage.value = false;
+            twoPage.value = true;
+            threePage.value = false;
+        } else if (val === 3) {
+            onePage.value = false;
+            twoPage.value = false;
+            threePage.value = true;
+        }
+    }
+
+    function jumpTo(path) {
+        router.push({
+            path: path,
+            query: {name: 123}
+        })
+    }
+
+    function backTo() {
+        sessionStorage.removeItem('contrastA');
+        sessionStorage.removeItem('contrastB');
+    }
+
+    onMounted(() => {
+        setHeadinfo()
+
+    })
+
+    const contrastData = ref({})
+
+    function getData() {
+        const contrastList = sessionStorage.getItem('contrastList') && JSON.parse(sessionStorage.getItem('contrastList'));
+        contrastData.value = contrastList;
+        console.log("{{contrastA.name}}", contrastData.value)
+    }
+
+    const universityList = ref([])
+
+    // 定义一个函数，用于将关键词变为红色
+    function highlightKeywords(text, keywords) {
+        // 遍历关键词列表
+        keywords.forEach(keyword => {
+            // 使用正则表达式匹配关键词，并替换为带有红色样式的HTML标签
+            // 这里使用全局匹配标志'g'，以确保替换所有出现的关键词
+            console.log("keywords", keywords)
+            let regex = new RegExp(keyword, 'g');
+            text = text.replace(regex, `<span style="color: #0DE6A1;">${keyword}</span>`);
+            console.log("text", text)
+        });
+        return text;
+    }
+
+    function byKeyword() {
+        getUniversityByKeyword(form.value).then(resp => {
+            resp.list.map(item => {
+                item.selected = false;
+                let keyWord = form.value.name
+                item.name = highlightKeywords(item.name, [keyWord]);
+                console.log(" item.name", item.name)
+                // 遍历数据数组，并处理每个字符串
+            })
+
+            universityList.value = resp.list
+        })
+    }
+
+
+    function toDetail(row) {
+        router.push({
+            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,
+        school_category,
+        property,
+        candidate_category
+    } = proxy.useDict('gk_province', 'educationlevel', 'school_category', 'characteristic', 'property', 'candidate_category')
+
+
+    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
+        })
+    }
+    //对比 孙一石 2025-08-15
+    const dbForm = ref({})
+
+    function dbResult(e) {
+        let univercity = JSON.parse(sessionStorage.getItem("contrastList"))
+        if (univercity.length != 2) {
+            alert("选择2个学校啊,现在是" + univercity.length)
+        } else {
+            dbForm.value.university0 = univercity[0].oldid
+            dbForm.value.university1 = univercity[1].oldid
+        }
+        getScoreInfo(dbForm.value).then(resp => {
+            console.log(resp)
+        })
+    }
+
+    onMounted(() => {
+        setHeadinfo()
+        getData()
+        const contrastData = JSON.parse(sessionStorage.getItem('contrastList'));
+        if (contrastData) {
+            contrastList.value = contrastData
+        }
+      // dbResult();
+    })
+</script>
+
+
+<style scoped lang="scss">
+    p, div {
+        margin: 0;
+        padding: 0;
+    }
+
+    .contrast_university {
+        background: url('@/assets/images/login/login-home-background.png') no-repeat;
+        background-size: 1920px 1080px;
+        z-index: 10;
+        width: 100%;
+        height: 1080px;
+
+        .page-content {
+            width: 100%;
+            position: absolute;
+            top: 100px;
+            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 {
+                    width: 244px;
+                    height: 80px;
+                    color: #B3B3B3;
+                    display: flex;
+                    align-items: center;
+                    margin-right: 5px;
+                    font-weight: bold;
+                    font-size: 20px;
+                    background: #C8FFED;
+
+                    img {
+                        width: 28px;
+                        height: 28px;
+                        margin-right: 10px;
+                        margin-left: 40px;
+                    }
+                }
+
+                .item-box-active {
+                    width: 244px;
+                    height: 80px;
+                    background: #1EC590;
+                    font-weight: bold;
+                    font-size: 20px;
+                    display: flex;
+                    color: #FFFFFF;
+                    line-height: 40px;
+                    margin-right: 5px;
+                    align-items: center;
+
+                    img {
+                        width: 28px;
+                        height: 28px;
+                        margin-right: 10px;
+                        margin-left: 40px;
+                    }
+                }
+            }
+
+            .content-right {
+                width: 1615px;
+                height: 926px;
+                background: #FFFFFF;
+                border-radius: 35px 35px 35px 35px;
+                margin-top: 13px;
+                margin-right: 24px;
+
+                .one-page {
+                    display: flex;
+                    justify-content: center;
+                    align-items: center;
+
+                    .table {
+                        width: 1526px;
+                        height: 887px;
+                        margin-top: 25px;
+
+                        tr:nth-child(1) {
+                            font-weight: 400;
+                            font-size: 32px;
+                            color: #FFFFFF;
+                            text-align: center;
+
+                            td:nth-child(1) {
+                                width: 290px;
+                                height: 100px;
+                                background: #1E410E;
+                                border-radius: 32px 4px 4px 4px;
+                                border: 8px solid #E0EEF4;
+
+                            }
+
+                            td:nth-child(2) {
+                                width: 620px;
+                                height: 100px;
+                                background: #1EC590;
+                                border-top: 8px solid #E0EEF4;
+                                border-right: 8px solid #E0EEF4;
+                                border-bottom: 8px solid #E0EEF4;
+                            }
+
+                            td:nth-child(3) {
+                                width: 616px;
+                                height: 119px;
+                                background: #8CE349;
+                                border-radius: 4px 32px 4px 4px;
+                                border-top: 8px solid #E0EEF4;
+                                border-right: 8px solid #E0EEF4;
+                                border-bottom: 8px solid #E0EEF4;
+
+                            }
+                        }
+
+                        tr:nth-child(2) {
+                            td:nth-child(1) {
+                                height: 290px;
+                                border-radius: 0px 0px 0px 0px;
+                                background: #1E410E;
+                                border-left: 8px solid #E0EEF4;
+                                border-right: 8px solid #E0EEF4;
+                                border-bottom: 8px solid #E0EEF4;
+                                font-weight: 400;
+                                font-size: 32px;
+                                color: #FFFFFF;
+                                text-align: center;
+                            }
+
+                            td:nth-child(2) {
+                                width: 620px;
+                                height: 290px;
+                                background: #FFFFFF;
+                                border-radius: 4px 4px 4px 4px;
+                                //border-top: 8px solid #E0EEF4;
+                                border-bottom: 8px solid #E0EEF4;
+                                border-right: 8px solid #E0EEF4;
+                                font-weight: 400;
+                                font-size: 32px;
+                                color: #333333;
+                                line-height: 52px;
+                            }
+
+                            td:nth-child(3) {
+                                width: 620px;
+                                height: 290px;
+                                background: #FFFFFF;
+                                border-radius: 4px 4px 4px 4px;
+                                border-bottom: 8px solid #E0EEF4;
+                                border-right: 8px solid #E0EEF4;
+                                font-weight: 400;
+                                font-size: 32px;
+                                color: #333333;
+                                line-height: 52px;
+                            }
+                        }
+
+                        tr:nth-child(3) {
+                            td:nth-child(1) {
+                                width: 290px;
+                                height: 180px;
+                                background: #1E410E;
+                                border-radius: 4px 4px 4px 4px;
+                                border-left: 8px solid #E0EEF4;
+                                border-right: 8px solid #E0EEF4;
+                                border-bottom: 8px solid #E0EEF4;
+                                font-weight: 400;
+                                font-size: 32px;
+                                color: #FFFFFF;
+                                text-align: center;
+                            }
+
+                            td:nth-child(2) {
+                                width: 620px;
+                                height: 210px;
+                                background: #FFFFFF;
+                                border-radius: 4px 4px 4px 4px;
+                                border-bottom: 8px solid #E0EEF4;
+                                border-right: 8px solid #E0EEF4;
+                            }
+
+                            td:nth-child(3) {
+                                width: 620px;
+                                height: 210px;
+                                background: #FFFFFF;
+                                border-radius: 4px 4px 4px 4px;
+                                border-bottom: 8px solid #E0EEF4;
+                                border-right: 8px solid #E0EEF4;
+                            }
+                        }
+
+                        tr:nth-child(4) {
+                            td:nth-child(1) {
+                                width: 290px;
+                                height: 110px;
+                                background: #1E410E;
+                                border-radius: 4px 4px 4px 4px;
+                                border-left: 8px solid #E0EEF4;
+                                border-right: 8px solid #E0EEF4;
+                                border-bottom: 8px solid #E0EEF4;
+                                font-weight: 400;
+                                font-size: 32px;
+                                color: #FFFFFF;
+                                line-height: 16px;
+                                text-align: center;
+                            }
+
+                            td:nth-child(2) {
+                                width: 620px;
+                                height: 119px;
+                                background: #FFFFFF;
+                                border-radius: 4px 4px 4px 4px;
+                                border-bottom: 8px solid #E0EEF4;
+                                border-right: 8px solid #E0EEF4;
+                                font-weight: 400;
+                                font-size: 32px;
+                                color: #333333;
+                                line-height: 52px;
+                            }
+
+                            td:nth-child(3) {
+                                width: 620px;
+                                height: 119px;
+                                background: #FFFFFF;
+                                border-radius: 4px 4px 4px 4px;
+                                border-bottom: 8px solid #E0EEF4;
+                                border-right: 8px solid #E0EEF4;
+                                font-weight: 400;
+                                font-size: 32px;
+                                color: #333333;
+                                line-height: 52px;
+                            }
+                        }
+
+                        tr:nth-child(5) {
+                            td:nth-child(1) {
+                                width: 290px;
+                                height: 100px;
+                                background: #1E410E;
+                                border-radius: 4px 4px 4px 32px;
+                                border-left: 8px solid #E0EEF4;
+                                border-right: 8px solid #E0EEF4;
+                                border-bottom: 8px solid #E0EEF4;
+                                font-weight: 400;
+                                font-size: 32px;
+                                color: #FFFFFF;
+                                line-height: 16px;
+                                text-align: center;
+                            }
+
+                            td:nth-child(2) {
+                                width: 290px;
+                                height: 100px;
+                                border-right: 8px solid #E0EEF4;
+                                border-bottom: 8px solid #E0EEF4;
+                                font-weight: 400;
+                                font-size: 32px;
+                                color: #333333;
+                                line-height: 52px;
+                            }
+
+                            td:nth-child(3) {
+                                width: 290px;
+                                height: 100px;
+                                border-right: 8px solid #E0EEF4;
+                                border-bottom: 8px solid #E0EEF4;
+                                border-radius: 4px 4px 32px 4px;
+                                font-weight: 400;
+                                font-size: 32px;
+                                color: #333333;
+                                line-height: 52px;
+                            }
+                        }
+
+                        .school-level-box {
+                            display: flex;
+                            justify-content: left;
+                            //margin-top: 32px;
+                            flex-wrap: wrap;
+                            width: 620px;
+                            padding-left: 30px;
+
+                            .school-level {
+                                margin-right: 20px;
+                                width: 174px;
+                                height: 54px;
+                                background: #B3FC7C;
+                                border-radius: 5px 5px 5px 5px;
+                                font-weight: bold;
+                                font-size: 20px;
+                                color: #000000;
+                                line-height: 54px;
+                                text-align: center;
+                                margin-top: 10px;
+                            }
+                        }
+
+                        .text-td {
+                            //text-align: center;
+                            width: 300px;
+                            //border: 1px solid;
+                            padding-left: 150px;
+
+                            .text-td-p {
+                                display: flex;
+                                //justify-content: center;
+                            }
+                        }
+                    }
+                }
+
+                .two-page {
+                    display: flex;
+                    flex-direction: column;
+                    align-items: center;
+
+                    .table {
+                        width: 1526px;
+                        height: 887px;
+                        margin-top: 25px;
+
+                        .one-tr {
+                            font-weight: 400;
+                            font-size: 32px;
+                            color: #FFFFFF;
+                            text-align: center;
+
+                            td:nth-child(1) {
+                                width: 290px;
+                                height: 100px;
+                                background: #1E410E;
+                                border-radius: 32px 4px 4px 4px;
+                                border: 8px solid #E0EEF4;
+
+                            }
+
+                            td:nth-child(2) {
+                                width: 620px;
+                                height: 100px;
+                                background: #1EC590;
+                                border-top: 8px solid #E0EEF4;
+                                border-right: 8px solid #E0EEF4;
+                                border-bottom: 8px solid #E0EEF4;
+                            }
+
+                            td:nth-child(3) {
+                                width: 616px;
+                                height: 119px;
+                                background: #8CE349;
+                                border-radius: 4px 32px 4px 4px;
+                                border-top: 8px solid #E0EEF4;
+                                border-right: 8px solid #E0EEF4;
+                                border-bottom: 8px solid #E0EEF4;
+
+                            }
+                        }
+
+                        .two-tr {
+                            td:nth-child(1) {
+                                height: 290px;
+                                border-radius: 0px 0px 0px 0px;
+                                background: #1E410E;
+                                border-left: 8px solid #E0EEF4;
+                                border-right: 8px solid #E0EEF4;
+                                //border-bottom: 8px solid #E0EEF4;
+                                font-weight: 400;
+                                font-size: 32px;
+                                color: #FFFFFF;
+                                text-align: center;
+                            }
+
+                            td:nth-child(2) {
+                                width: 620px;
+                                height: 290px;
+                                background: #FFFFFF;
+                                border-radius: 4px 4px 4px 4px;
+                                //border-top: 8px solid #E0EEF4;
+                                border-bottom: 8px solid #E0EEF4;
+                                border-right: 8px solid #E0EEF4;
+                                font-weight: 400;
+                                font-size: 32px;
+                                color: #333333;
+                                line-height: 52px;
+                            }
+
+                            td:nth-child(3) {
+                                width: 620px;
+                                height: 290px;
+                                background: #FFFFFF;
+                                border-radius: 4px 4px 4px 4px;
+                                border-bottom: 8px solid #E0EEF4;
+                                border-right: 8px solid #E0EEF4;
+                                font-weight: 400;
+                                font-size: 32px;
+                                color: #333333;
+                                line-height: 52px;
+                            }
+                        }
+
+                        tr:nth-child(3) {
+                            td:nth-child(1) {
+                                width: 290px;
+                                height: 180px;
+                                background: #1E410E;
+                                border-radius: 4px 4px 4px 4px;
+                                border-left: 8px solid #E0EEF4;
+                                border-right: 8px solid #E0EEF4;
+                                //border-bottom: 8px solid #E0EEF4;
+                                font-weight: 400;
+                                font-size: 32px;
+                                color: #FFFFFF;
+                                text-align: center;
+                            }
+
+                            td:nth-child(2) {
+                                width: 620px;
+                                height: 210px;
+                                background: #FFFFFF;
+                                border-radius: 4px 4px 4px 4px;
+                                border-bottom: 8px solid #E0EEF4;
+                                border-right: 8px solid #E0EEF4;
+                            }
+
+                            td:nth-child(3) {
+                                width: 620px;
+                                height: 210px;
+                                background: #FFFFFF;
+                                border-radius: 4px 4px 4px 4px;
+                                border-bottom: 8px solid #E0EEF4;
+                                border-right: 8px solid #E0EEF4;
+                            }
+                        }
+
+                        tr:nth-child(4) {
+                            td:nth-child(1) {
+                                width: 290px;
+                                height: 110px;
+                                background: #1E410E;
+                                border-radius: 4px 4px 4px 4px;
+                                border-left: 8px solid #E0EEF4;
+                                border-right: 8px solid #E0EEF4;
+                                //border-bottom: 8px solid #E0EEF4;
+                                font-weight: 400;
+                                font-size: 32px;
+                                color: #FFFFFF;
+                                line-height: 16px;
+                                text-align: center;
+                            }
+
+                            td:nth-child(2) {
+                                width: 620px;
+                                height: 119px;
+                                background: #FFFFFF;
+                                border-radius: 4px 4px 4px 4px;
+                                border-bottom: 8px solid #E0EEF4;
+                                border-right: 8px solid #E0EEF4;
+                                font-weight: 400;
+                                font-size: 32px;
+                                color: #333333;
+                                line-height: 52px;
+                            }
+
+                            td:nth-child(3) {
+                                width: 620px;
+                                height: 119px;
+                                background: #FFFFFF;
+                                border-radius: 4px 4px 4px 4px;
+                                border-bottom: 8px solid #E0EEF4;
+                                border-right: 8px solid #E0EEF4;
+                                font-weight: 400;
+                                font-size: 32px;
+                                color: #333333;
+                                line-height: 52px;
+                            }
+                        }
+
+                        tr:nth-child(5) {
+                            td:nth-child(1) {
+                                width: 290px;
+                                height: 100px;
+                                background: #1E410E;
+                                border-radius: 4px 4px 4px 32px;
+                                border-left: 8px solid #E0EEF4;
+                                border-right: 8px solid #E0EEF4;
+                                //border-bottom: 8px solid #E0EEF4;
+                                font-weight: 400;
+                                font-size: 32px;
+                                color: #FFFFFF;
+                                line-height: 16px;
+                                text-align: center;
+                            }
+
+                            td:nth-child(2) {
+                                width: 290px;
+                                height: 100px;
+                                border-right: 8px solid #E0EEF4;
+                                border-bottom: 8px solid #E0EEF4;
+                                font-weight: 400;
+                                font-size: 32px;
+                                color: #333333;
+                                line-height: 52px;
+                            }
+
+                            td:nth-child(3) {
+                                width: 290px;
+                                height: 100px;
+                                border-right: 8px solid #E0EEF4;
+                                border-bottom: 8px solid #E0EEF4;
+                                border-radius: 4px 4px 32px 4px;
+                                font-weight: 400;
+                                font-size: 32px;
+                                color: #333333;
+                                line-height: 52px;
+                            }
+                        }
+
+                        .school-level-box {
+                            display: flex;
+                            justify-content: left;
+                            //margin-top: 32px;
+                            flex-wrap: wrap;
+                            width: 620px;
+                            padding-left: 30px;
+
+                            .school-level {
+                                margin-right: 20px;
+                                width: 174px;
+                                height: 54px;
+                                background: #B3FC7C;
+                                border-radius: 5px 5px 5px 5px;
+                                font-weight: bold;
+                                font-size: 20px;
+                                color: #000000;
+                                line-height: 54px;
+                                text-align: center;
+                                margin-top: 10px;
+                            }
+                        }
+
+                        .text-td {
+                            text-align: center;
+
+                            .text-td-p {
+                                display: flex;
+                                justify-content: center;
+                            }
+                        }
+                    }
+
+                }
+            }
+        }
+
+    }
+
+    .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/pro_details_video.vue

@@ -8,7 +8,7 @@
             <div class="right-top">
               <p class="title">{{ entity.name }}</p>
               <div class="right-top-icon">
-<!--                <collectionComponent :collection="collection_data"></collectionComponent>-->
+                <collectionComponent ref="collectionRef" :collection="collection_data"></collectionComponent>
               </div>
             </div>
             <div class="content-info">
@@ -55,28 +55,28 @@
           </div>
           <div class="one-page" v-show="onePage">
             <p class="title">专业解读</p>
-            <div  v-html="entity.describe"></div>
+            <div class="info"  v-html="entity.describe"></div>
           </div>
           <div class="one-page" v-show="twoPage">
             <p class="title">开设院校</p>
-            <div v-for="(item,index) in kaishe_list">
-              {{ entity.name }}
+            <div class="info"  v-for="(item,index) in kaishe_list">
+              {{ item.name }}
             </div>
           </div>
           <div class="one-page" v-show="threePage">
             <p class="title">学科评估</p>
-            <div v-for="(item,index) in pinggu_list">
+            <div class="info"   v-for="(item,index) in pinggu_list">
               {{ item.name }}
             </div>
           </div>
           <div class="one-page" v-show="fourPage">
             <p class="title">就业前景</p>
-            <div v-html="entity.employment">
+            <div class="info"   v-html="entity.employment">
             </div>
           </div>
           <div class="one-page" v-show="fivePage">
             <p class="title">专业视频</p>
-            <div ref="videoContainer" class="video-container">
+            <div  ref="videoContainer" class="video-container"  v-if="entity.path">
               <video ref="videoPlayer" id="playerId" class="video-js vjs-default-skin" controls preload="auto"
                      :data-setup="{}">
                 <!-- 可以在这里插入source标签以指定你的视频源 -->
@@ -86,61 +86,24 @@
           </div>
         </div>
         </div>
-
-<!--      专业详情视频-->
-<!--      <collectionComponent :collection="collection"></collectionComponent>-->
-<!--      <br>-->
-<!--      <div>-->
-<!--        专业代码:{{ entity.code }},-->
-<!--        学历层次:-->
-<!--        <dict-tag :options="educationlevel" :value="entity.bkzk"/>-->
-<!--        ,休学年限{{ entity.years }},{{ entity.degree }}-->
-<!--      </div>-->
-<!--      <br>-->
-<!--      开设课程-->
-<!--      <br>-->
-<!--      <div>-->
-<!--        {{ entity.course }}-->
-<!--      </div>-->
-<!--      <br>-->
-<!--      相近专业-->
-<!--      <br>-->
-<!--      <div v-for="(item,index) in similar_list">-->
-<!--        {{ item.name }}-->
-<!--      </div>-->
-<!--      <br>-->
-
-<!--      <el-card style="width:80%;">-->
-<!--        <div @click="changeTab('zyjd')">专业解读</div>-->
-<!--        <div @click="changeTab('ksyx')">开设院校</div>-->
-<!--        <div @click="changeTab('xkpg')">学科评估</div>-->
-<!--        <div @click="changeTab('jyqj')">就业前景</div>-->
-<!--        <div @click="changeTab('zysp')">专业视频</div>-->
-<!--      </el-card>-->
-
-<!--      <div v-show="tabIndex == 'zyjd'" v-html="entity.describe"></div>-->
-<!--      <div v-show="tabIndex == 'ksyx'">-->
-<!--        <div v-for="(item,index) in kaishe_list">-->
-<!--          {{ entity.name }}-->
-<!--        </div>-->
-<!--      </div>-->
-<!--      <div v-show="tabIndex == 'xkpg'">-->
-<!--        <div v-for="(item,index) in pinggu_list">-->
-<!--          {{ item.name }}-->
-<!--        </div>-->
-<!--      </div>-->
-<!--      <div v-show="tabIndex == 'jyqj'" v-html="entity.employment">-->
-<!--      </div>-->
-<!--      <div v-show="tabIndex == 'zysp'">-->
-<!--        <div ref="videoContainer" class="video-container">-->
-<!--          <video ref="videoPlayer" id="playerId" class="video-js vjs-default-skin" controls preload="auto"-->
-<!--                 :data-setup="{}">-->
-<!--            &lt;!&ndash; 可以在这里插入source标签以指定你的视频源 &ndash;&gt;-->
-<!--            <source :src="entity.path" type="video/mp4">-->
-<!--          </video>-->
-<!--        </div>-->
-<!--      </div>-->
     </div>
+    <el-dialog
+        v-model="fivePage"
+        @before-close="dialogBeforeClose"
+        destroy-on-close
+        title="专业视频"
+        width="1832px"
+        height="915px"
+        center
+        align-center
+        v-if="entity.path"
+    >
+      <div class="video-content" >
+        <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>
 
@@ -152,6 +115,8 @@ import {specialtyDetail} from '@/api/xjc-integratedmachine/environment/specialty
 import {ref} from "vue";
 import headComponent from '@/views/xjc-integratedmachine/components/head_component.vue'
 import Drag_component from "@/views/xjc-integratedmachine/components/drag_component.vue";
+import {handleThemeStyle} from "@/utils/theme.js";
+import useSettingsStore from "@/store/modules/settings.js";
 
 const {proxy} = getCurrentInstance()
 const {educationlevel} = proxy.useDict('educationlevel')
@@ -176,34 +141,34 @@ function setHeadinfo(){
     backUrl : '/xjc-integratedmachine/environment/query_universitydb_conditions',
     homeUrl:'/xjc-integratedmachine/environment/index',
     contrast:true,
+    contrastType:'major'
   }
 }
+
 onMounted(() => {
   setHeadinfo()
+
 })
-function changeTab(path) {
-  tabIndex.value = path
-  if (path == 'zysp') {
-    const player = videojs(playerId, {autoplay: true});
-    player.src(entity.value.path);
-    player.on("ended", () => {
-    })
-  }
-}
 
 const param = route.query
 
-const collection = ref({
-  contentType: 2,
-  contentId: param.id
-})
 
 
 const entity = ref({})
 const kaishe_list = ref([])
 const pinggu_list = ref([])
 const similar_list = ref([])
-
+const collectionRef = ref(null)
+const collection_data = ref({})
+function setCollection_data(){
+  collection_data.value = {
+    contentType: 2,
+    contentId: param.id,
+    contentVal: entity.value,
+    source:'pro_details_video'
+  }
+  console.log("entity.value",entity.value)
+}
 function detail() {
   specialtyDetail({
     id: param.id
@@ -212,8 +177,16 @@ function detail() {
     kaishe_list.value = resp.kaishe_list
     pinggu_list.value = resp.pinggu_list
     similar_list.value = resp.similar_list
+    entity.value.kaishe_list = kaishe_list
   })
+setTimeout(() => {
+    setCollection_data();
+    collectionRef.value.isContrast(entity.value);
+    collectionRef.value.getSource('pro_details_video');
+  }, 500);
 }
+
+
 const showPage = (val) => {
   if (val === 1) {
     onePage.value = true;
@@ -268,13 +241,18 @@ const showPage = (val) => {
     fourPage.value = false;
     fivePage.value = false;
   }
-  //清空数据
-  form.area = '';
-  form.areanam = '';
-  form.university = '';
-  form.categoryName = '';
 }
 detail()
+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;
+}
 
 
 </script>
@@ -308,20 +286,15 @@ p, div {
     background: rgba(255, 255, 255, 0.4);
     border-radius: 35px 35px 35px 35px;
     display: flex;
-    //justify-content: space-around;
     flex-direction: column;
-    //align-items: center;
 
     .top-content {
       width: 1832px;
-      height: 300px;
       display: flex;
-      justify-content: space-between;
-      //align-items: center;
       flex-direction: column;
       .top-content-right {
         margin-left: 45px;
-        width: 1630px;
+        width: 1782px;
         margin-left: 45px;
 
         .title {
@@ -329,14 +302,11 @@ p, div {
           font-size: 36px;
           color: #1E410E;
           line-height: 24px;
-          //margin-top: 63px;
         }
 
         .school-level-box {
           display: flex;
           justify-content: left;
-          //margin-top: 32px;
-
           .school-level {
             margin-right: 20px;
             width: 174px;
@@ -353,13 +323,6 @@ p, div {
 
         .text-box {
           width: 1124px;
-          border:1px solid;
-          //display: flex;
-          ////justify-content: space-between;
-          //align-items: center;
-          //flex-wrap: wrap;
-          //margin-top: 14px;
-
           p {
             margin-right: 20px;
           }
@@ -373,7 +336,6 @@ p, div {
           .right-top-icon {
             width: 200px;
             height: 68px;
-            border: 1px solid;
             display: flex;
             justify-content: space-between;
             margin-top: 24px;
@@ -393,7 +355,6 @@ p, div {
               img {
                 width: 36px;
                 height: 36px;
-                border: 1px solid;
               }
             }
           }
@@ -403,8 +364,6 @@ p, div {
 
       .content-info{
         display: flex;
-
-        //justify-content: space-around;
         p{
           width: 200px;
           margin-right: 10px;
@@ -416,7 +375,6 @@ p, div {
       }
       .info-box{
         margin-left: 33px;
-        height: 300px;
         .title {
           height: 40px;
           border-left: 8px #8CE349 solid;
@@ -432,13 +390,14 @@ p, div {
            font-weight: 400;
            font-size: 20px;
            color: #333333;
-          display: flex;
-          justify-content: space-around;
-          flex-wrap: wrap;
+           display: flex;
+           //justify-content: space-around;
+           flex-wrap: wrap;
 
           .info-item{
             width: 244px;
             height: 80px;
+            margin-left: 10px;
             background: #FFFFFF;
             border-radius: 5px 5px 5px 5px;
             border: 1px solid #A2F57F;
@@ -465,14 +424,10 @@ p, div {
 
   .bottom-content {
     margin-top: 10px;
-    //border: 1px solid;
-    //margin-top: 25px;
-    //width:100px;
-    height: 30px;
+    height: 500px;
     .tab-box {
       display: flex;
       padding-right: 279px;
-
       img {
         width: 36px;
         height: 36px;
@@ -526,13 +481,13 @@ p, div {
   //  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;
-  //}
+
+  .editor-content div,
+  .editor-content span,
+  .editor-content p {
+    text-indent: 2em !important;
+    text-align: left !important;
+  }
 }
 
 .one-page {
@@ -542,10 +497,8 @@ p, div {
   border-radius: 0px 0px 35px 35px;
   border: 1px solid #FFFFFF;
   overflow: auto;
-  padding-left: 33px;
-  padding-right: 33px;
   line-height: 32px;
-
+  padding-top: 10px;
   .title {
     height: 40px;
     border-left: 8px #8CE349 solid;
@@ -627,8 +580,6 @@ p, div {
   height: 800px;
   overflow: auto;
   .dict-box {
-    //border: 1px solid red;
-    //background: #1ab394;
     font-size: 24px;
     line-height: 34px;
     color: #333333;

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

@@ -133,7 +133,7 @@ const headinfo = ref({})
 
 function setHeadinfo() {
   headinfo.value = {
-    title: '高校信息查询',
+    title: '专业信息查询',
     user: {
       avatar: '头像路径',
       nickName: '张三'

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

@@ -106,7 +106,7 @@ div,p{
       .two-page-result {
         display: flex;
         flex-wrap: wrap;
-        justify-content: space-between;
+        //justify-content: space-between;
         align-items: center;
 
         .item-result-box-active {

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

@@ -103,7 +103,7 @@ div,p{
       .two-page-result {
         display: flex;
         flex-wrap: wrap;
-        justify-content: space-between;
+        //justify-content: space-between;
         align-items: center;
 
         .item-result-box-active {

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

@@ -26,11 +26,11 @@
           <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>
+              <span style="margin-left: 3px">{{form.areaname}}</span>
+
+              <span ><span v-show="form.educationlevelName" style="margin-right: 3px;margin-left: 3px">|</span>{{form.educationlevelName}}</span>
+
+              <span ><span style="margin-right: 3px;margin-left: 3px" v-show="form.characteristicName">|</span>{{form.characteristicName}}</span>
             </p>
             <img @click="search" style="z-index:10" src="@/assets/images/environment/search-btn.png">
           </div>

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

@@ -9,7 +9,7 @@
             <div class="right-top">
               <p class="title">{{ entity.name }}</p>
               <div class="right-top-icon">
-                <collectionComponent :collection="collection_data"></collectionComponent>
+                <collectionComponent ref="collectionRef" :collection="collection_data"></collectionComponent>
               </div>
             </div>
             <div class="school-level-box">
@@ -139,6 +139,11 @@
           </div>
           <div class="one-page" v-show="eightPage">
             <p class="title">学校视频</p>
+            <div class="video-content" style="display: flex;justify-content: center" v-if="entity.path">
+              <video ref="videoPlayer" video preload="auto" autoplay muted controls width="1000" height="400">
+                <source :src="entity.path" type="video/mp4">
+              </video>
+            </div>
           </div>
         </div>
       </div>
@@ -146,7 +151,7 @@
     </div>
   </div>
   <el-dialog
-      v-model="sixPage"
+      v-model="sixPageDialog"
       destroy-on-close
       title=""
       width="90%"
@@ -154,8 +159,9 @@
       style="width: 90%;height: 910px;"
       center
       align-center
+      :show-close="false"
   >
-    <div class="one-page" style="width: 1658px" v-show="sixPage">
+    <div class="one-page" style="width: 1658px;height: 880px;" v-show="sixPage">
       <div class="select-div">
         <p>招生地区:</p>
         <p class="select-box" @click="showAreaChooseHandler">
@@ -172,7 +178,7 @@
         </p>
         <p class="select-box click-search" @click="getPlan">点击查询</p>
       </div>
-      <el-table :data="jh_tableData">
+      <el-table :data="jh_tableData" style="height: 640px;margin-bottom: 20px;">
         <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"/>
@@ -180,19 +186,22 @@
         <el-table-column label="计划招生人数" align="center" key="plannum" prop="plannum"/>
         <el-table-column label="学费" align="center" key="fee" prop="fee"/>
       </el-table>
+      <div class="footer-div">
+        <el-button type="success" class="close-box click-close" @click="sixPageDialog = false">关闭</el-button>
+      </div>
     </div>
   </el-dialog>
   <el-dialog
-      v-model="fivePage"
-      destroy-on-close
+      v-model="fivePageDialog"
       title=""
       width="90%"
       height="910px"
       style="width: 90%;height: 910px;"
       center
       align-center
+      :show-close="false"
   >
-    <div class="one-page" style="width: 1658px" v-show="fivePage">
+    <div class="one-page" style="width: 1658px;height: 880px;" v-show="fivePage">
       <div class="select-div">
         <p>招生地区:</p>
         <p class="select-box" @click="showAreaChooseHandler">
@@ -207,18 +216,37 @@
         </p>
         <p class="select-box click-search" @click="getScore">点击查询</p>
       </div>
-      <el-table :data="kf_tableData">
+      <el-table :data="kf_tableData" style="height: 640px;margin-bottom: 20px;">
         <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 class="footer-div">
+        <el-button type="success" class="close-box click-close" @click="fivePageDialog = false">关闭</el-button>
+      </div>
+    </div>
+  </el-dialog>
+  <el-dialog
+      v-model="eightPageDialog"
+      @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>
     <!--招生地区-->
-    <el-dialog v-model="showAreaChoose" width="600px" append-to-body>
+    <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
@@ -241,22 +269,6 @@
         <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>
@@ -315,6 +327,11 @@ const twoPage = ref(false)
 const threePage = ref(false)
 const fourPage = ref(false)
 const fivePage = ref(false)
+const fivePageDialog = ref(false)
+const sixPageDialog = ref(false)
+const eightPageDialog = ref(false)
+
+
 const sixPage = ref(false)
 const senvenPage = ref(false)
 const eightPage = ref(false)
@@ -329,6 +346,7 @@ function setHeadinfo(){
     backUrl : '/xjc-integratedmachine/environment/query_universitydb_conditions',
     homeUrl:'/xjc-integratedmachine/environment/index',
     contrast:true,
+    contrastType:'university',
   }
 }
 
@@ -338,6 +356,7 @@ function setCollection_data(){
     contentType: 1,
     contentId: param.id,
     contentVal: entity.value,
+    source:'university_details_video'
   }
 }
 
@@ -351,6 +370,7 @@ function detail() {
     //看看收藏
     queryConnection()
     setCollection_data()
+    collectionRef.value.isContrast(entity,);
   })
 }
 
@@ -518,6 +538,7 @@ const showPage = (val) => {
     sixPage.value = false
     senvenPage.value = false
     eightPage.value = false;
+    fivePageDialog.value = true;
   } else if (val === 6) {
     onePage.value = false;
     twoPage.value = false;
@@ -527,6 +548,7 @@ const showPage = (val) => {
     sixPage.value = true
     senvenPage.value = false
     eightPage.value = false;
+    sixPageDialog.value = true;
   } else if (val === 7) {
     onePage.value = false;
     twoPage.value = false;
@@ -545,6 +567,7 @@ const showPage = (val) => {
     sixPage.value = false
     senvenPage.value = false;
     eightPage.value = true;
+    eightPageDialog.value = true;
   }
   //清空数据
   form.area = '';
@@ -552,14 +575,12 @@ const showPage = (val) => {
   form.university = '';
   form.categoryName = '';
 }
-
+const collectionRef = ref(null)
 onMounted(() => {
   proxy.getConfigKey('sys_resource_root2').then(res => {
     baseUrl.value = res.msg;
   })
-
   setHeadinfo()
-
 })
 </script>
 
@@ -655,9 +676,10 @@ p, div {
           align-items: center;
 
           .right-top-icon {
-            width: 200px;
+            width: 130px;
             height: 68px;
             display: flex;
+            margin-right: 30px;
             justify-content: space-between;
             margin-top: 24px;
 
@@ -665,18 +687,17 @@ p, div {
               display: flex;
               flex-direction: column;
               align-items: center;
-
+              width:68px;
               p {
                 font-weight: 400;
                 font-size: 20px;
                 color: #515F6A;
-
               }
 
               img {
                 width: 36px;
                 height: 36px;
-                border: 1px solid;
+                //border: 1px solid;
               }
             }
           }
@@ -797,7 +818,7 @@ p, div {
     justify-content: center;
     align-items: center;
     margin-bottom: 21px;
-
+    margin-top: 10px;
     .select-box {
       width: 300px;
       height: 90px;
@@ -818,7 +839,30 @@ p, div {
       margin-left: 20px;
     }
   }
+  .footer-div{
+    width:100%;
+    display: flex;
+    justify-content: space-around;
+    .close-box {
+      width: 300px;
+      height: 90px;
+      border: 1px solid #CCCCCC;
+      line-height: 90px;
+      text-align: center;
+      margin-left: 10px;
+    }
 
+    .click-close {
+      width: 170px;
+      height: 66px;
+      //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;

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

@@ -4,12 +4,14 @@
     <div class="page-content">
       <div class="page-img-box">
         <div class="box-content">
-          <div class="school-box" v-for="(item,index) in tableData" :key="index">
+          <div class="school-box" v-for="(item,index) in tableData" :key="index" @click="handleDetail(item)">
             <img src="@/assets/images/environment/contrast.png"/>
             <div class="right-box">
               <div class="right-top">
                 <div class="right-top-title">{{ item.name }}</div>
-                <div class="right-top-details" @click="handleDetail(item)">详情 ></div>
+                <div class="right-top-details">详情
+                  <img style="width: 24px;height: 24px" src="@/assets/images/environment/details_icon.png"/>
+                  </div>
               </div>
               <p class="info"><span>创建时间:</span><span>{{
                   item.ctime
@@ -91,6 +93,7 @@ function setHeadinfo() {
     backUrl: '/xjc-integratedmachine/environment/query_universitydb_conditions',
     homeUrl: '/xjc-integratedmachine/environment/index',
     contrast:true,
+    contrastType:'university',
   }
 }
 
@@ -155,6 +158,7 @@ p, div {
             width: 154px;
             height: 154px;
             //border: 1px solid;
+            margin-left: 13px;
           }
 
           .right-box {
@@ -180,6 +184,10 @@ p, div {
                 font-weight: 400;
                 font-size: 20px;
                 color: #515F6A;
+                display: flex;
+                justify-content: space-around;
+                align-items: center;
+                margin-right: 30px;
               }
             }
 

vite.config.js

@@ -47,7 +47,7 @@ export default defineConfig(({ mode, command }) => {
         // https://cn.vitejs.dev/config/#server-proxy
         '/dev-api': {
           // target: 'http://localhost:8080',
-          target: 'http://192.168.3.100:8080',//临时11
+          target: 'http://192.168.3.100:8080',//服务器
           changeOrigin: true,
           rewrite: (p) => p.replace(/^\/dev-api/, '')
         }