mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/learning-system-portal.git
synced 2025-12-09 10:56:44 +08:00
3213 lines
93 KiB
Vue
3213 lines
93 KiB
Vue
<template>
|
||
<div id="case-list-content">
|
||
<div style="margin-bottom: 30px; position: relative" class="case-banner">
|
||
<portal-header
|
||
@type1="handleType"
|
||
:type="queryCondition"
|
||
current="case"
|
||
textColor="#fff"
|
||
@emitInput="emitInput"
|
||
@showClass="showClass"
|
||
></portal-header>
|
||
|
||
<p
|
||
style="
|
||
position: absolute;
|
||
z-index: 10;
|
||
bottom: 20px;
|
||
left: 220px;
|
||
color: #fff;
|
||
"
|
||
>
|
||
案例专区隆重推出“AI案例专家”助力高效案例应用
|
||
</p>
|
||
</div>
|
||
<div class="xcontent2">
|
||
<!-- 新增的案例分类 -->
|
||
<!-- <div class="xcontent2-minor" style="margin-right:36px;">
|
||
<div class="course-title-style">
|
||
<div class="imgTilte">
|
||
<div>案例分类</div>
|
||
<div>COURSE</div>
|
||
</div>
|
||
</div>
|
||
<div class="course-list">
|
||
<div class="course-one" v-for="one in treeList" :key="one.id" @click.stop="handleOptionClick(one, 1, treeList)">
|
||
<div class="course-one-content">{{ one.name }}</div>
|
||
<div class="course-two" v-for="(twoList, twoIndex) in one.children" :key="twoList.id"
|
||
@click.stop="handleOptionClick(twoList, 2, one.children)"
|
||
:class="{ courseTwoActive: twoList.id == twoId || twoList.checked }" @mouseleave.stop="leaveIndex"
|
||
@mouseenter.stop="changeIndex(twoList.id)"
|
||
>
|
||
<el-popover class="popover" popper-class='coursePopperClass' placement="right-start" width="536"
|
||
:disabled="!twoList.children.length" :open-delay="0" :close-delay="0" trigger="hover" :visible-arrow="false"
|
||
@hide="leaveIndex" @show="changeIndex(twoList.id)" transition="none">
|
||
<div class="course-two-content" slot="reference">{{ twoList.name }}</div>
|
||
<div class="course-three-box">
|
||
<div class="course-three-box-title">
|
||
{{ twoList.name }}
|
||
</div>
|
||
<div style="padding: 0 40px;display: flex;flex-wrap: wrap;">
|
||
<div :class="threeList.checked ? 'threeActive' : ''" v-for="threeList in twoList.children"
|
||
:key="threeList.id" @click.stop="handleOptionClick(threeList, 3, twoList.children)"
|
||
class="course-three">
|
||
<span>{{ threeList.name }}</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</el-popover>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div> -->
|
||
<div class="xcontent2-main" style="margin-right: 30px">
|
||
<div class="left-div">
|
||
<div class="search-div">
|
||
<div class="searchbar" v-if="tagList.length > 0">
|
||
<div style="line-height: 30px">
|
||
<span class="item-title">搜索条件</span>
|
||
<el-tag
|
||
closable
|
||
v-for="(tag, tagIdx) in tagList"
|
||
:key="tagIdx"
|
||
@close="tagsClose(tag, tagIdx)"
|
||
>{{ tag.name }}</el-tag
|
||
>
|
||
</div>
|
||
</div>
|
||
<div class="search-item">
|
||
<div style="margin-top: 10px; display: flex; margin-bottom: 24px">
|
||
<div style="flex: 1">
|
||
<div class="field">
|
||
<div
|
||
style="
|
||
line-height: 25px;
|
||
padding-right: 10px;
|
||
padding-left: 0;
|
||
"
|
||
>
|
||
<!-- <img class="orgaicon" :src="`${webBaseUrl}/images/orgaimg.png`" alt=""> -->
|
||
<span class="item-title">组织领域</span>
|
||
<span class="item-line"></span>
|
||
</div>
|
||
<div
|
||
style="padding: 0"
|
||
:class="oneTagAll ? 'fieldactive' : ''"
|
||
@click="domainall(1)"
|
||
>
|
||
全部
|
||
</div>
|
||
<div class="fieldbox">
|
||
<div
|
||
:class="item.fielclass ? 'fieldactive' : ''"
|
||
@click="fieldswich(item, 1)"
|
||
v-for="(item, idx) in domain"
|
||
:key="'a' + idx"
|
||
>
|
||
{{ item.name }}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- <el-checkbox-group v-model="queryCondition.orgDomain" size="mini" @change="search()">
|
||
<el-checkbox-button :label="null">全部</el-checkbox-button>
|
||
<el-checkbox-button v-for="item in domain" :key="item.code" :label="item.code"> {{ item.name}}</el-checkbox-button>
|
||
</el-checkbox-group> -->
|
||
|
||
<!-- 二级分类 -->
|
||
<!-- <div class="field" v-if="twoList.length > 0" style="margin-top: 24px;">
|
||
<div style="line-height: 25px;padding-right: 10px;padding-left: 0;">
|
||
<span class="item-title">二级分类</span>
|
||
<span class="item-line"></span>
|
||
</div>
|
||
<div style="padding:0;" :class="twoTagAll ? 'fieldactive' : ''" @click="domainall(2)">全部</div>
|
||
<div class="fieldbox">
|
||
<div :class="item.fielclass ? 'fieldactive' : ''" @click="fieldswich(item, 2)"
|
||
v-for="(item, idx) in twoList" :key="'b' + idx">{{ item.name }}</div>
|
||
</div>
|
||
</div> -->
|
||
<!-- 三级分类 -->
|
||
<!-- <div class="field" v-if="threeList.length > 0" style="margin-top: 24px;">
|
||
<div style="line-height: 25px;padding-right: 10px;padding-left: 0;">
|
||
<span class="item-title">三级分类</span>
|
||
<span class="item-line"></span>
|
||
</div>
|
||
<div style="padding:0;" :class="threeTagAll ? 'fieldactive' : ''" @click="domainall(3)">全部</div>
|
||
<div class="fieldbox">
|
||
<div :class="item.fielclass ? 'fieldactive' : ''" @click="fieldswich(item, 3)"
|
||
v-for="(item, idx) in threeList" :key="'c' + idx">{{ item.name }}</div>
|
||
</div>
|
||
</div> -->
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- 专业分类 -->
|
||
<div class="search-div-collapse">
|
||
<div class="search-item">
|
||
<div style="margin-top: 10px; display: flex">
|
||
<div
|
||
style="
|
||
line-height: 25px;
|
||
padding-right: 10px;
|
||
white-space: nowrap;
|
||
"
|
||
>
|
||
<!-- <img class="orgaicon" :src="`${webBaseUrl}/images/specimg.png`" alt=""> -->
|
||
<span class="item-title">专业分类</span>
|
||
<span class="item-line"></span>
|
||
</div>
|
||
<div style="flex: 1" id="searchBox">
|
||
<div class="field">
|
||
<div
|
||
style="padding: 0"
|
||
:class="speciAll ? 'fieldactive' : ''"
|
||
@click="majorall()"
|
||
>
|
||
全部
|
||
</div>
|
||
<div class="fieldbox">
|
||
<div
|
||
:class="item.fielclass ? 'fieldactive' : ''"
|
||
@click="fieldmajor(item)"
|
||
v-for="(item, idx) in speciData"
|
||
:key="'d' + idx"
|
||
>
|
||
{{ item.name }}({{ item.explanation }})
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- <el-radio-group style="display:flex;" v-model="queryCondition.majorType" size="mini" @change="search()">
|
||
<el-radio-button :label="null">全部</el-radio-button>
|
||
<div>
|
||
<el-radio-button v-for="item in speciData" :key="item.code" :label="item.code" > {{ item.name }} </el-radio-button>
|
||
</div>
|
||
</el-radio-group> -->
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="searBox" v-if="searchwd">
|
||
<el-button type="text" id="closeSearchBtn" @click="closeSearch">
|
||
{{ word }}
|
||
<i
|
||
:class="showAll ? 'el-icon-arrow-up ' : 'el-icon-arrow-down'"
|
||
></i>
|
||
</el-button>
|
||
</div>
|
||
</div>
|
||
<div style="height: 30px; background-color: #f6f7fc"></div>
|
||
<div class="order-div" style="border-bottom: none">
|
||
<span class="quyer-tag">
|
||
<el-button
|
||
type="text"
|
||
class="order-class"
|
||
@click="searchexcellent('all')"
|
||
:class="{ actice: queryCondition.type == 'all' }"
|
||
>全部</el-button
|
||
>
|
||
<el-button
|
||
type="text"
|
||
class="order-class"
|
||
@click="searchexcellent('excellent')"
|
||
:class="{ actice: queryCondition.type == 'excellent' }"
|
||
>年度最佳</el-button
|
||
>
|
||
<el-button
|
||
type="text"
|
||
class="order-class"
|
||
@click="searchexcellent('recommend')"
|
||
:class="{ actice: queryCondition.type == 'recommend' }"
|
||
>推荐案例</el-button
|
||
>
|
||
<!-- <el-button type="text" class="order-class" @click="searchexcellent('hot')"
|
||
:class="{ actice: queryCondition.type == 'hot' }">最热</el-button>
|
||
<el-button type="text" class="order-class" @click="searchexcellent('new')"
|
||
:class="{ actice: queryCondition.type == 'new' }">最新</el-button> -->
|
||
</span>
|
||
<div
|
||
style="
|
||
flex: 1;
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
align-items: center;
|
||
"
|
||
>
|
||
<!-- <div style="margin-right: 20px;color: #6E7B84;font-size: 14px;">当前已检索 <span style="color:#387DF7;">
|
||
{{ caseList.count }}</span> 条数据</div> -->
|
||
<div v-if="caseTimeShow" class="pub_time" @click="searchTime">
|
||
<div class="text">发布时间</div>
|
||
<div class="triangle">
|
||
<div
|
||
:style="{
|
||
borderBottomColor:
|
||
pubTimeNum === 2 ? '#387DF7' : '#DCDFE6',
|
||
}"
|
||
class="up-triangle"
|
||
></div>
|
||
<div
|
||
:style="{
|
||
borderTopColor: pubTimeNum === 1 ? '#387DF7' : '#DCDFE6',
|
||
}"
|
||
class="down-triangle"
|
||
></div>
|
||
</div>
|
||
</div>
|
||
<div v-if="caseTimeShow" class="pub_time" @click="searchPageView">
|
||
<div class="text">浏览量</div>
|
||
<div class="triangle">
|
||
<div
|
||
:style="{
|
||
borderBottomColor:
|
||
pageViewNum === 2 ? '#387DF7' : '#DCDFE6',
|
||
}"
|
||
class="up-triangle"
|
||
></div>
|
||
<div
|
||
:style="{
|
||
borderTopColor: pageViewNum === 1 ? '#387DF7' : '#DCDFE6',
|
||
}"
|
||
class="down-triangle"
|
||
></div>
|
||
</div>
|
||
</div>
|
||
<el-select
|
||
v-if="caseTimeShow"
|
||
@change="yearsChange"
|
||
v-model="years"
|
||
multiple
|
||
collapse-tags
|
||
style="width: 147px; border-radius: 20px !important"
|
||
placeholder="全部年份"
|
||
>
|
||
<el-option
|
||
v-for="item in caseYears"
|
||
:key="item.value"
|
||
:label="item.label"
|
||
:value="item.value"
|
||
>
|
||
</el-option>
|
||
</el-select>
|
||
<div
|
||
:class="
|
||
queryCondition.type == 'collect'
|
||
? 'collect_active'
|
||
: 'collect'
|
||
"
|
||
@click="searchexcellent('collect')"
|
||
>
|
||
<div class="png"></div>
|
||
<div class="text">收藏案例</div>
|
||
</div>
|
||
<div
|
||
:class="queryCondition.type == 'time' ? 'time_active' : 'time'"
|
||
@click="searchexcellent('time')"
|
||
>
|
||
<div class="png"></div>
|
||
<div class="text">浏览记录</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="back_num" v-if="numIsFalse">
|
||
<div class="search_div_num">
|
||
当前已检索
|
||
<span style="color: #ff4040"> {{ this.caseList.count }}</span>
|
||
条数据
|
||
</div>
|
||
</div>
|
||
<div class="data-content">
|
||
<div
|
||
v-for="item in this.caseList.list"
|
||
:key="isTimeData ? item.browsingHistoryId : item.id"
|
||
class="case-list"
|
||
>
|
||
<div class="case-info">
|
||
<div class="case-info-cont">
|
||
<!-- <router-link :to="'/case/detail?id=' + item.id"> -->
|
||
<div
|
||
@click="toCaseDetail(item.id, item.refId)"
|
||
style="cursor: pointer"
|
||
>
|
||
<div v-if="isTime" class="case_text">
|
||
<span style="margin-right: 28px">阅读了案例</span>
|
||
<span>{{ item.eventTime }}</span>
|
||
</div>
|
||
<div class="case-info-title">
|
||
<div class="case-titdiv">
|
||
<div class="case-tittext">
|
||
<span
|
||
:style="{
|
||
maxWidth:
|
||
item.excellentTag &&
|
||
item.viewRankTags.length != 0
|
||
? '400px'
|
||
: item.viewRankTags.length != 0
|
||
? '500px'
|
||
: '',
|
||
}"
|
||
class="title-line-ellipsis"
|
||
:title="item.title"
|
||
>{{ item.title || item.contentInfo }}</span
|
||
>
|
||
</div>
|
||
<div class="case-activeText">
|
||
<!-- <span v-if="item.breCommend" class="comWords"
|
||
style="background-color:rgba(232, 139, 72);">荐</span>
|
||
<span v-if="item.excellent" class="comWords" style="background-color:red;">最佳</span> -->
|
||
<span
|
||
@click.stop="() => {}"
|
||
v-if="item.excellentTag"
|
||
class="comWords"
|
||
style="
|
||
width: 98px;
|
||
height: 24px;
|
||
background: #f99000;
|
||
border-radius: 2px;
|
||
font-weight: 400;
|
||
font-size: 12px;
|
||
color: #ffffff;
|
||
padding: 4px 10px;
|
||
cursor: auto;
|
||
"
|
||
>
|
||
{{ item.excellentTag }}
|
||
</span>
|
||
<span
|
||
@click.stop="toExcellent(tag)"
|
||
v-if="item.viewRankTags.length != 0"
|
||
v-for="tag in item.viewRankTags"
|
||
class="comWords"
|
||
style="
|
||
width: 98px;
|
||
height: 24px;
|
||
background: #f99000;
|
||
border-radius: 2px;
|
||
font-weight: 400;
|
||
font-size: 12px;
|
||
color: #ffffff;
|
||
padding: 4px 10px;
|
||
"
|
||
>
|
||
{{ tag.tagName }}
|
||
</span>
|
||
</div>
|
||
<div class="case-info-date portal-time">
|
||
<i class="el-icon-time"></i>
|
||
<time-show
|
||
v-if="item.id"
|
||
:time="item.sysCreateTime"
|
||
></time-show>
|
||
<span v-else>该案例已被删除</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- </router-link> -->
|
||
<div
|
||
v-if="!item.id"
|
||
style="height: 25px; padding-top: 14px"
|
||
></div>
|
||
<div v-if="item.id" style="height: 58px; padding-top: 14px">
|
||
<author
|
||
:avatar="item.authorInfo.avatar"
|
||
:name="item.authorInfo.name"
|
||
:info="item.authorInfo.orgInfo"
|
||
:sex="item.authorInfo.sex"
|
||
:authorTags="item.authorTags"
|
||
:aid="item.authorInfo.aid"
|
||
>
|
||
<template>
|
||
<div
|
||
v-if="item.breCommend"
|
||
style="
|
||
padding-top: 6px;
|
||
flex: 1;
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
color: #999;
|
||
font-size: 12px;
|
||
"
|
||
>
|
||
<span>{{ item.recommendOrgName }}推荐</span>
|
||
</div>
|
||
</template>
|
||
</author>
|
||
</div>
|
||
<!-- <router-link :to="'/case/detail?id=' + item.id"> -->
|
||
<div
|
||
v-if="item.id"
|
||
@click="toCaseDetail(item.id, item.refId)"
|
||
style="cursor: pointer"
|
||
>
|
||
<div class="keyword-text clearfix">
|
||
<div
|
||
style="color: #2974d6; font-weight: 450"
|
||
v-if="item.orgDomainParent"
|
||
>
|
||
{{ orgDomainTranslate(item.orgDomainParent) }}
|
||
</div>
|
||
<!-- <div style="color:#2974D6;font-weight: 450;" v-if="item.orgDomain">{{ orgDomainTranslate(item.orgDomain) }}</div> -->
|
||
<div
|
||
style="color: #2974d6; font-weight: 450"
|
||
v-for="(item, idx) in item.majorType"
|
||
:key="idx"
|
||
>
|
||
{{ majorTypeTranslate(item) }}
|
||
</div>
|
||
<div v-if="item.keyword1 && item.keyword1 != 'null'">
|
||
{{ item.keyword1 }}
|
||
</div>
|
||
<div v-if="item.keyword2 && item.keyword2 != 'null'">
|
||
{{ item.keyword2 }}
|
||
</div>
|
||
<div v-if="item.keyword3 && item.keyword3 != 'null'">
|
||
{{ item.keyword3 }}
|
||
</div>
|
||
<div v-if="item.keyword4 && item.keyword4 != 'null'">
|
||
{{ item.keyword4 }}
|
||
</div>
|
||
<div v-if="item.keyword5 && item.keyword5 != 'null'">
|
||
{{ item.keyword5 }}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- </router-link> -->
|
||
<div
|
||
v-if="item.id"
|
||
class="case-info-summary two-line-ellipsis"
|
||
@click="toCaseDetail(item.id, item.refId)"
|
||
>
|
||
{{ item.summary }}
|
||
<!-- <router-link :to="'/case/detail?id='+item.id"> -->
|
||
<!-- {{displayAll(item)}} -->
|
||
<!-- </router-link> -->
|
||
<!-- <span style="color:#588afc;cursor:pointer;" v-if="item.summary.length>150" @click.stop="changeIsAll(item)"> -->
|
||
<!-- {{item.isAll?'收起':'展开'}} -->
|
||
<!-- </span> -->
|
||
</div>
|
||
<div
|
||
v-if="item.id"
|
||
style="display: flex; justify-content: flex-end"
|
||
>
|
||
<div style="margin: 8px 0">
|
||
<interactBar
|
||
@deleteFavorite="deleteFavorite"
|
||
:type="3"
|
||
:data="item"
|
||
:comments="false"
|
||
:shares="true"
|
||
></interactBar>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div v-if="this.caseList.showPagCount > queryCondition.pageSize">
|
||
<pagination
|
||
:size="queryCondition.pageSize"
|
||
:total="caseList.count"
|
||
:page="queryCondition.pageIndex"
|
||
layout="total, prev, pager, next, jumper"
|
||
@change-page="currentChange"
|
||
></pagination>
|
||
</div>
|
||
</div>
|
||
<div class="pagination-div">
|
||
<!-- <span class="pag-text" @click="loadMore()" v-if="moreState == 1">加载更多</span>
|
||
<span class="pag-text-msg" v-else-if="moreState == 2">数据加载中</span>
|
||
<span class="pag-text-msg" v-else-if="moreState == 3">没有更多数据了</span> -->
|
||
<span class="notcoures" v-if="this.caseList.list.length == 0">
|
||
<img :src="`${webBaseUrl}/images/nocase.png`" alt="" />
|
||
<h5>暂无案例，请优先学习其它案例吧～</h5>
|
||
</span>
|
||
<!-- <span class="pag-text-msg" v-else-if="isSeach">没有查询到相关内容</span> -->
|
||
</div>
|
||
<div v-if="isSeach" style="height: 382px"></div>
|
||
</div>
|
||
</div>
|
||
<!-- 打开排行榜 -->
|
||
<div class="xcontent2-minor">
|
||
<div id="fixd-box">
|
||
<AICaseConsult />
|
||
<router-link class="the_charts" to="/case/charts">
|
||
<div class="text">排行榜</div>
|
||
<div class="icon">></div>
|
||
</router-link>
|
||
<div>
|
||
<div
|
||
class="portal-ranking ranking-bg"
|
||
style="padding: 20px 15px; max-height: 222px"
|
||
>
|
||
<div style="display: flex; justify-content: space-between">
|
||
<p class="ranking-title">好评榜</p>
|
||
<el-dropdown trigger="click" @command="positiveReview">
|
||
<span class="el-dropdown-link">
|
||
{{ favorableName
|
||
}}<i class="el-icon-arrow-down el-icon--right"></i>
|
||
</span>
|
||
<el-dropdown-menu slot="dropdown">
|
||
<el-dropdown-item command="total">总</el-dropdown-item>
|
||
<el-dropdown-item command="quarter">季度</el-dropdown-item>
|
||
</el-dropdown-menu>
|
||
</el-dropdown>
|
||
</div>
|
||
<ul class="ranking-data">
|
||
<li
|
||
v-for="(item, index) in Positive"
|
||
:key="index"
|
||
class="title-line-ellipsis"
|
||
style="cursor: pointer; margin-top: 15px; line-height: 22px"
|
||
>
|
||
<router-link :to="'/case/detail?id=' + item.caseId">
|
||
<span class="portal-right-text blue-one" v-if="index == 0">
|
||
<img
|
||
:src="`${webBaseUrl}/images/listblue01.png`"
|
||
alt=""
|
||
/>
|
||
</span>
|
||
<span class="portal-right-text blue-tow" v-if="index == 1">
|
||
<img
|
||
:src="`${webBaseUrl}/images/listblue02.png`"
|
||
alt=""
|
||
/>
|
||
</span>
|
||
<span
|
||
class="portal-right-text blue-three"
|
||
v-if="index == 2"
|
||
>
|
||
<img
|
||
:src="`${webBaseUrl}/images/listblue03.png`"
|
||
alt=""
|
||
/>
|
||
</span>
|
||
<!-- <span class="portal-right-text" v-if="index == 3">
|
||
<img :src="`${webBaseUrl}/images/list04.png`" alt="">
|
||
</span>
|
||
<span class="portal-right-text" v-if="index == 4">
|
||
<img :src="`${webBaseUrl}/images/list05.png`" alt="">
|
||
</span> -->
|
||
<span class="portal-title-desc" style="font-size: 14px">{{
|
||
item.caseTitle
|
||
}}</span>
|
||
</router-link>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
<div
|
||
class="portal-ranking ranking-bg1"
|
||
style="padding: 20px 15px; max-height: 222px; margin-top: 20px"
|
||
>
|
||
<div style="display: flex; justify-content: space-between">
|
||
<p class="ranking-title">人气榜</p>
|
||
<el-dropdown trigger="click" @command="popularityReview">
|
||
<span class="el-dropdown-link">
|
||
{{ popularityName
|
||
}}<i class="el-icon-arrow-down el-icon--right"></i>
|
||
</span>
|
||
<el-dropdown-menu slot="dropdown">
|
||
<el-dropdown-item command="total">总</el-dropdown-item>
|
||
<el-dropdown-item command="quarter">季度</el-dropdown-item>
|
||
</el-dropdown-menu>
|
||
</el-dropdown>
|
||
</div>
|
||
<ul class="ranking-data">
|
||
<li
|
||
v-for="(item, index) in Popularity"
|
||
:key="index"
|
||
class="title-line-ellipsis"
|
||
style="cursor: pointer; margin-top: 15px; line-height: 22px"
|
||
>
|
||
<router-link :to="'/case/detail?id=' + item.caseId">
|
||
<span
|
||
class="portal-right-text orange-one"
|
||
v-if="index == 0"
|
||
>
|
||
<img :src="`${webBaseUrl}/images/list-01.png`" alt="" />
|
||
</span>
|
||
<span
|
||
class="portal-right-text orange-tow"
|
||
v-if="index == 1"
|
||
>
|
||
<img :src="`${webBaseUrl}/images/list02.png`" alt="" />
|
||
</span>
|
||
<span
|
||
class="portal-right-text orange-three"
|
||
v-if="index == 2"
|
||
>
|
||
<img :src="`${webBaseUrl}/images/list03.png`" alt="" />
|
||
</span>
|
||
<span class="portal-right-text" v-if="index == 3">
|
||
<img :src="`${webBaseUrl}/images/list04.png`" alt="" />
|
||
</span>
|
||
<span class="portal-right-text" v-if="index == 4">
|
||
<img :src="`${webBaseUrl}/images/list05.png`" alt="" />
|
||
</span>
|
||
<span class="portal-title-desc" style="font-size: 14px">{{
|
||
item.caseTitle
|
||
}}</span>
|
||
</router-link>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
<div
|
||
v-if="recommendRank.length > 0"
|
||
class="portal-ranking ranking-bg2"
|
||
style="margin-top: 20px; padding: 20px 15px; max-height: 222px"
|
||
>
|
||
<p class="ranking-title">推荐榜</p>
|
||
<ul class="ranking-data">
|
||
<li
|
||
v-for="(item, index) in recommendRank"
|
||
:key="index"
|
||
class="title-line-ellipsis"
|
||
style="cursor: pointer; margin-top: 15px; line-height: 22px"
|
||
>
|
||
<router-link :to="'/case/detail?id=' + item.caseId">
|
||
<span class="portal-right-text blue-one" v-if="index == 0">
|
||
<img
|
||
:src="`${webBaseUrl}/images/listred01 .png`"
|
||
alt=""
|
||
/>
|
||
</span>
|
||
<span class="portal-right-text blue-tow" v-if="index == 1">
|
||
<img :src="`${webBaseUrl}/images/listred02.png`" alt="" />
|
||
</span>
|
||
<span
|
||
class="portal-right-text blue-three"
|
||
v-if="index == 2"
|
||
>
|
||
<img :src="`${webBaseUrl}/images/listred03.png`" alt="" />
|
||
</span>
|
||
<span class="portal-title-desc" style="font-size: 14px">{{
|
||
item.caseTitle
|
||
}}</span>
|
||
</router-link>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div style="height: 50px"></div>
|
||
<el-dialog
|
||
class="protocol"
|
||
:close-on-click-modal="false"
|
||
:visible.sync="protocolDialogVisible"
|
||
width="30%"
|
||
:show-close="false"
|
||
>
|
||
<div class="protocol-title">案例查阅及使用用户协议</div>
|
||
<div class="protocol-content">
|
||
  本专区内案例为BOE各组织沉淀的通用案例、
|
||
组织案例、卓越绩效案例、管理案例、 职级晋升案例、企业文化案例等。
|
||
案例内容记录作者亲历的、真实的、已完成的、
|
||
典型工作事件，提炼解决具体问题的心得、思路经验、方法等。
|
||
仅供BOE员工查询、学习、交流使用，未经允许不得以任何方式外传。
|
||
</div>
|
||
<span slot="footer" class="dialog-footer">
|
||
<el-checkbox
|
||
label="我已阅读并同意。"
|
||
@change="protocolCheck"
|
||
style="float: left"
|
||
></el-checkbox>
|
||
<el-tooltip
|
||
:disabled="!protocolConfirmButton"
|
||
effect="light"
|
||
content="请先勾选‘我已阅读并同意。’"
|
||
placement="bottom"
|
||
>
|
||
<span
|
||
><el-button
|
||
type="primary"
|
||
:disabled="protocolConfirmButton"
|
||
@click="protocolConfirm"
|
||
>确 定</el-button
|
||
></span
|
||
>
|
||
</el-tooltip>
|
||
</span>
|
||
</el-dialog>
|
||
</div>
|
||
<portal-footer></portal-footer>
|
||
<portalFloatTools></portalFloatTools>
|
||
<!-- U课堂弹窗 -->
|
||
<div class="u-class">
|
||
<el-dialog :visible.sync="showUClass" width="833px">
|
||
<div class="ClassBoxContent">
|
||
<img src="../../../assets/images/u_class.png" alt="" class="img" />
|
||
<div class="ContentBox">
|
||
<div class="left">
|
||
<div class="title">U选小课堂</div>
|
||
<div class="jy">项目简介</div>
|
||
<div class="msg">
|
||
于22年首推，是一个面向全集团员工开放的职业通识类数字化培养项目，旨在帮助员工开阔眼界、加厚职业素养。在原有外部精选通用力课程基础上，2023年引入创新专区，以新鲜的话题、新颖的形式，带给全员丰富、有趣的学习体验。
|
||
</div>
|
||
<div class="bottom"></div>
|
||
</div>
|
||
<div class="right">
|
||
<div class="tyl" @click="tylClick">
|
||
<div class="tyl_title">
|
||
<img
|
||
src="../../../assets/images/dc.png"
|
||
alt=""
|
||
class="tyl_title_img"
|
||
/>
|
||
<span class="tyl_title_msg">通用力专区</span>
|
||
</div>
|
||
<div class="tyl_jy">加厚职业素养，轻学习、快成长！</div>
|
||
<div class="tyl_msg">
|
||
内容涵盖：领导力、市场营销、职场技能、财务知识、法律常识、人力资源、经典国学、人文社科
|
||
</div>
|
||
</div>
|
||
<div class="text_msg">创新力专区课程版权已到期！</div>
|
||
<!-- <div class="cyl" @click="cylClick">
|
||
<div class="tyl_title">
|
||
<img src="../../../assets/images/cyl.png" alt="" class="tyl_title_img" />
|
||
<span class="tyl_title_msg">创新力专区</span>
|
||
</div>
|
||
<div class="tyl_jy">激发创新潜力，拓视野、促思考！</div>
|
||
<div class="tyl_msg">
|
||
内容涵盖：组合创新、单点破局、错位竞争、分形创新、第二曲线、数字化、元宇宙<br/>
|
||
创新力专区课程版权将于2024年4月16日到期，逾期将无法继续访问，请尽快完成学习
|
||
</div>
|
||
</div> -->
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</el-dialog>
|
||
</div>
|
||
<!-- <AICall :dialogVisible="showAICall" @close="onClose" />-->
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import { mapGetters } from "vuex";
|
||
import portalHeader from "@/components/PortalHeader.vue";
|
||
import portalFooter from "@/components/PortalFooter.vue";
|
||
import portalFloatTools from "@/components/PortalFloatTools.vue";
|
||
import interactBar from "@/components/Portal/interactBar.vue";
|
||
import timeShow from "@/components/Portal/datetimeShow.vue";
|
||
import author from "@/components/Portal/authorInfo.vue";
|
||
import apiCase from "@/api/modules/cases.js";
|
||
import apiUser from "@/api/system/user.js";
|
||
import apiSearchterm from "@/api/modules/searchterm.js";
|
||
import { deepClone } from "../../../utils";
|
||
import apiDict from "@/api/modules/dict.js";
|
||
import apiType from "@/api/modules/type.js";
|
||
import { cutFullName } from "@/utils/tools.js";
|
||
import apiPlace from "@/api/phase2/place.js";
|
||
import AICall from "@/views/portal/case/AICall.vue";
|
||
import AICaseConsult from "@/views/portal/case/components/AICaseConsult.vue";
|
||
export default {
|
||
name: "case",
|
||
components: {
|
||
portalHeader,
|
||
portalFooter,
|
||
portalFloatTools,
|
||
interactBar,
|
||
timeShow,
|
||
author,
|
||
AICall,
|
||
AICaseConsult,
|
||
},
|
||
data() {
|
||
return {
|
||
timeoutId: null,
|
||
isTimeData: false,
|
||
articlePageList: [],
|
||
caseTimeShow: true,
|
||
isTime: false,
|
||
numIsFalse: true,
|
||
switch: {
|
||
total: "总",
|
||
quarter: "季度",
|
||
},
|
||
favorableName: "季度",
|
||
popularityName: "季度",
|
||
pubTimeNum: 1,
|
||
pageViewNum: 0,
|
||
twoId: "",
|
||
treeList: [],
|
||
caseType: process.env.VUE_APP_CASE_TYPE, //类型
|
||
caseYears: [],
|
||
refId: "", //消息跳转案例的id
|
||
selectList: [], //点击选中的list
|
||
twoList: [], //二级分类{type:12}
|
||
threeList: [], //三级分类{type:13}
|
||
showUClass: false,
|
||
fileBaseUrl: process.env.VUE_APP_FILE_BASE_URL,
|
||
resonimg: {},
|
||
domain: [], //组织领域
|
||
domainAll: [], //全部的组织领域
|
||
speciData: [], //专业分类
|
||
moreState: 1, // 1 加载更多 2 加载中 3无数据
|
||
isSeach: false,
|
||
searchwd: false,
|
||
showAll: true, //是否展开全部
|
||
initHeight: 40, //原始 高度
|
||
searchRecords: [], //热门搜索词
|
||
caseList: {
|
||
count: 0,
|
||
list: [],
|
||
showPagCount: 0,
|
||
},
|
||
ankingList: [], //排行数据1
|
||
Popularity: [], //排行数据2
|
||
Positive: [], //排行数据3
|
||
recommendRank: [],
|
||
protocolDialogVisible: false,
|
||
protocolConfirmButton: true,
|
||
years: [],
|
||
queryCondition: {
|
||
pageIndex: 1,
|
||
pageSize: 5,
|
||
// orderField: "excellent",
|
||
majorType: "", //专业分类code
|
||
// orderAsc: false,
|
||
// isTop: true,
|
||
excellent: true,
|
||
keyWord: "",
|
||
orgDomainDtos: [],
|
||
caseType: "",
|
||
authorName: "",
|
||
notInIds: [],
|
||
type: "all",
|
||
userId: "",
|
||
parent: "",
|
||
children: [],
|
||
name: "",
|
||
years: [],
|
||
// 随机
|
||
// notInIds: [],//重复的id
|
||
orderField: "id",
|
||
orderAsc: false, //排序
|
||
sysType1: "",
|
||
sysType2: "",
|
||
sysType3: "",
|
||
},
|
||
keyWord: "",
|
||
anking: 2,
|
||
queryExpand: true, // true更多，false收起
|
||
category: 0,
|
||
type2: 0,
|
||
type3: 0,
|
||
isFind: false,
|
||
fielclassjor: true,
|
||
localSessionKey: this.$xpage.constants.localCaseFiltersKey,
|
||
};
|
||
},
|
||
watch: {
|
||
"$route.query.keyword": {
|
||
handler(newval) {
|
||
if (newval && this.keyWord != newval) {
|
||
this.keyWord = newval;
|
||
this.search(true);
|
||
}
|
||
},
|
||
immediate: true,
|
||
},
|
||
// years() {
|
||
// this.search(true)
|
||
// }
|
||
},
|
||
computed: {
|
||
...mapGetters(["userInfo", "portalCase"]),
|
||
word: function () {
|
||
if (this.showAll == false) {
|
||
//对文字进行处理
|
||
return "展开";
|
||
} else {
|
||
return "收起";
|
||
}
|
||
},
|
||
isMore() {
|
||
let isOk = true;
|
||
if (this.caseList.list.length === this.caseList.count) {
|
||
isOk = false;
|
||
}
|
||
return isOk;
|
||
},
|
||
tagList() {
|
||
//列表属性，用于计算
|
||
let list = [];
|
||
if (this.keyWord) {
|
||
list.push({
|
||
type: "0",
|
||
code: "keyword",
|
||
name: this.keyWord,
|
||
checked: true,
|
||
});
|
||
}
|
||
this.domain.forEach((one) => {
|
||
var twoChildChecked = false; //是否有下级
|
||
one.list.forEach((two) => {
|
||
if (two.fielclass) {
|
||
twoChildChecked = true;
|
||
}
|
||
var threeChildChecked = false;
|
||
two.list.forEach((three) => {
|
||
if (three.fielclass) {
|
||
list.push(three);
|
||
threeChildChecked = true;
|
||
}
|
||
});
|
||
if (two.fielclass && !threeChildChecked) {
|
||
list.push(two);
|
||
}
|
||
});
|
||
if (one.fielclass && !twoChildChecked) {
|
||
list.push(one);
|
||
}
|
||
});
|
||
this.speciData.forEach((item) => {
|
||
if (item.fielclass) {
|
||
list.push(item);
|
||
}
|
||
});
|
||
this.treeList.forEach((one) => {
|
||
var twoChildChecked = false; //是否有下级
|
||
one.children &&
|
||
one.children.forEach((two) => {
|
||
if (two.checked) {
|
||
twoChildChecked = true;
|
||
}
|
||
var threeChildChecked = false;
|
||
two.children &&
|
||
two.children.forEach((three) => {
|
||
if (three.checked) {
|
||
list.push(three);
|
||
threeChildChecked = true;
|
||
}
|
||
});
|
||
if (two.checked && !threeChildChecked) {
|
||
list.push(two);
|
||
}
|
||
});
|
||
if (one.checked && !twoChildChecked) {
|
||
list.push(one);
|
||
}
|
||
});
|
||
// console.log(list,'计算属性');
|
||
|
||
return list;
|
||
},
|
||
oneTagAll() {
|
||
return !this.domain.some((item) => item.fielclass);
|
||
},
|
||
twoTagAll() {
|
||
return !this.twoList.some((item) => item.fielclass);
|
||
},
|
||
threeTagAll() {
|
||
return !this.threeList.some((item) => item.fielclass);
|
||
},
|
||
speciAll() {
|
||
return !this.speciData.some((item) => item.fielclass);
|
||
},
|
||
},
|
||
beforeRouteLeave(to, from, next) {
|
||
const isScroll = "caseDetail,caseCharts,caseExcellent";
|
||
if (!isScroll.includes(to.name)) {
|
||
// console.log('我是外')
|
||
this.queryCondition.pageIndex = 1;
|
||
this.search();
|
||
// window.location.reload()
|
||
// this.$destroy()
|
||
} else {
|
||
sessionStorage.setItem("pagesScroll", JSON.stringify(window.pageYOffset));
|
||
}
|
||
window.removeEventListener("scroll", this.handleScroll);
|
||
next();
|
||
},
|
||
beforeRouteEnter(to, from, next) {
|
||
if (from.name !== "caseDetail") {
|
||
// console.log('我是内')
|
||
}
|
||
next((vm) => {
|
||
vm.$nextTick(() => {
|
||
window.scrollTo({
|
||
left: 0,
|
||
top: JSON.parse(sessionStorage.getItem("pagesScroll")),
|
||
});
|
||
sessionStorage.removeItem("pagesScroll");
|
||
vm.allRequests();
|
||
});
|
||
});
|
||
},
|
||
created() {
|
||
(() => {
|
||
const allData = {
|
||
0: {
|
||
orderField: "id",
|
||
orderAsc: false,
|
||
},
|
||
1: {
|
||
orderField: "id",
|
||
orderAsc: true,
|
||
},
|
||
2: {
|
||
orderField: "title",
|
||
orderAsc: false,
|
||
},
|
||
3: {
|
||
orderField: "title",
|
||
orderAsc: true,
|
||
},
|
||
4: {
|
||
orderField: "sysCreateTime",
|
||
orderAsc: false,
|
||
},
|
||
5: {
|
||
orderField: "sysCreateTime",
|
||
orderAsc: true,
|
||
},
|
||
6: {
|
||
orderField: "authorId",
|
||
orderAsc: false,
|
||
},
|
||
7: {
|
||
orderField: "authorId",
|
||
orderAsc: true,
|
||
},
|
||
8: {
|
||
orderField: "authorName",
|
||
orderAsc: false,
|
||
},
|
||
9: {
|
||
orderField: "authorName",
|
||
orderAsc: true,
|
||
},
|
||
};
|
||
const allArr = Object.keys(allData);
|
||
let recordsArr = JSON.parse(sessionStorage.getItem("recordsArr")) || [];
|
||
let difference = allArr.filter(
|
||
(element) => !recordsArr.includes(element)
|
||
);
|
||
if (recordsArr.length === allArr.length) {
|
||
difference = [...allArr];
|
||
recordsArr = [];
|
||
}
|
||
let random = Math.floor(Math.random() * difference.length);
|
||
for (let i = 0; i < difference.length; i++) {
|
||
if (i == random) {
|
||
recordsArr.push(difference[i]);
|
||
break;
|
||
}
|
||
}
|
||
sessionStorage.setItem("recordsArr", JSON.stringify(recordsArr));
|
||
const dataList = (data) => {
|
||
this.queryCondition.orderField = data.orderField;
|
||
this.queryCondition.orderAsc = data.orderAsc;
|
||
};
|
||
dataList(allData[random]);
|
||
})();
|
||
},
|
||
mounted() {
|
||
let $this = this;
|
||
// if(this.speciData.length==0){
|
||
// this.specialized();
|
||
// }
|
||
// if(this.domain.length==0){
|
||
// this.getdomain();
|
||
// }
|
||
let isBack = false;
|
||
if (window.history && window.history.pushState) {
|
||
history.pushState(null, null, document.URL); //这里有没有都无所谓，最好是有以防万一
|
||
isBack = true;
|
||
}
|
||
// console.log(isBack, 'isBack');
|
||
// Promise.all([apiType.items("org_domain"), apiCase.majorTypes()]).then(rs => {
|
||
// 90是测试环境，155是生产环境
|
||
// console.log(this.caseType);
|
||
|
||
Promise.all([
|
||
apiType.treeList(1, Number(this.caseType ?? 155), 1),
|
||
apiCase.majorTypes(),
|
||
]).then((rs) => {
|
||
if (rs[0].code == 200) {
|
||
const { records } = rs[0].data;
|
||
records.forEach((item) => {
|
||
item.fielclass = false;
|
||
item.type = "org_domain";
|
||
item.list = item.children ? item.children : [];
|
||
if (Array.isArray(item.children)) {
|
||
item.list.forEach((sub) => {
|
||
sub.list = sub.children ? sub.children : [];
|
||
sub.fielclass = false;
|
||
if (Array.isArray(sub.children)) {
|
||
sub.list.forEach((three) => {
|
||
three.list = three.children ? three.children : [];
|
||
three.fielclass = false;
|
||
});
|
||
}
|
||
});
|
||
}
|
||
});
|
||
this.domain = records;
|
||
}
|
||
if (rs[1].status == 200) {
|
||
rs[1].result.forEach((item) => {
|
||
item.fielclass = false;
|
||
item.type = "major_type";
|
||
});
|
||
this.speciData = rs[1].result;
|
||
}
|
||
this.loadLocalFilters();
|
||
this.$nextTick(function () {
|
||
$this.initHeight = document.getElementById("searchBox").offsetHeight;
|
||
$this.closeSearch();
|
||
});
|
||
this.search();
|
||
});
|
||
|
||
if (!this.portalCase.readProtocol) {
|
||
this.protocolDialogVisible = true;
|
||
}
|
||
this.keyWord = this.$route.query.keyword;
|
||
if (this.keyWord != "") {
|
||
this.isSeach = true;
|
||
}
|
||
// 从消息多个案例跳转到本页面
|
||
this.refId = this.$route.query.recommendId;
|
||
if (this.refId) {
|
||
this.queryCondition.type = "recommend";
|
||
}
|
||
this.loadTypeData(); //加载分类
|
||
this.getAnkingData();
|
||
this.searchterm();
|
||
//打开排行榜下边的两个
|
||
this.getPopularity();
|
||
this.getPositive();
|
||
this.getQueryRecommendRank();
|
||
this.couresreso();
|
||
// window.addEventListener("scroll", this.handleScroll);
|
||
// 获取年
|
||
this.getYears();
|
||
this.allRequests();
|
||
},
|
||
beforeDestroy() {
|
||
// window.removeEventListener("scroll", this.handleScroll);
|
||
// console.log('销毁了');
|
||
},
|
||
methods: {
|
||
// 是否展示入口
|
||
allRequests() {
|
||
window.addEventListener("scroll", this.handleScroll);
|
||
},
|
||
deleteFavorite(e) {
|
||
this.search();
|
||
},
|
||
positiveReview(e) {
|
||
this.favorableName = this.switch[e];
|
||
this.getPositive();
|
||
},
|
||
popularityReview(e) {
|
||
this.popularityName = this.switch[e];
|
||
this.getPopularity();
|
||
},
|
||
handleType(msg) {
|
||
// this.queryCondition.type = msg
|
||
},
|
||
handleOptionClick(treeItem) {
|
||
this.treeList.forEach((one) => {
|
||
one.checked = false;
|
||
if (one.id == treeItem.id) {
|
||
one.checked = true;
|
||
this.queryCondition.sysType2 = "";
|
||
this.queryCondition.sysType3 = "";
|
||
this.queryCondition.sysType1 = one.id;
|
||
}
|
||
one.children.forEach((two) => {
|
||
two.checked = false;
|
||
if (two.id == treeItem.id) {
|
||
two.checked = true;
|
||
this.queryCondition.sysType1 = "";
|
||
this.queryCondition.sysType3 = "";
|
||
this.queryCondition.sysType2 = two.id;
|
||
}
|
||
two.children.forEach((three) => {
|
||
three.checked = false;
|
||
if (three.id == treeItem.id) {
|
||
three.checked = true;
|
||
this.queryCondition.sysType1 = "";
|
||
this.queryCondition.sysType2 = "";
|
||
this.queryCondition.sysType3 = three.id;
|
||
}
|
||
});
|
||
});
|
||
});
|
||
this.getCaseData();
|
||
},
|
||
// 移入
|
||
changeIndex(twoId) {
|
||
this.twoId = twoId;
|
||
},
|
||
// 移除
|
||
leaveIndex() {
|
||
this.twoId = "";
|
||
},
|
||
// 加载分类
|
||
async loadTypeData() {
|
||
try {
|
||
const { result, status } = await apiType.tree(1);
|
||
if (status === 200) {
|
||
result.forEach((one) => {
|
||
one.checked = false;
|
||
if (!one.children) one.children = [];
|
||
one.children &&
|
||
one.children.forEach((two) => {
|
||
two.checked = false;
|
||
if (!two.children) two.children = [];
|
||
two.children &&
|
||
two.children.forEach((three) => {
|
||
three.checked = false;
|
||
if (!three.children) three.children = [];
|
||
});
|
||
});
|
||
});
|
||
this.treeList = result;
|
||
}
|
||
} catch (error) {
|
||
// console.log(error);
|
||
}
|
||
},
|
||
getYears() {
|
||
apiCase.caseYears().then((res) => {
|
||
if (res.status == 200) {
|
||
const { result } = res;
|
||
// console.log(result);
|
||
this.caseYears = result.map((year) => ({
|
||
value: year,
|
||
label: year,
|
||
}));
|
||
}
|
||
});
|
||
},
|
||
// 查看率的时间
|
||
toCaseDetail(id, refId) {
|
||
if (!id) {
|
||
this.$message.error("该案例已被删除");
|
||
return;
|
||
}
|
||
apiCase.details(id, true).then((res) => {
|
||
if (res.status == 200) {
|
||
if (refId) {
|
||
apiCase.startReadTimer(refId);
|
||
}
|
||
this.$router.push({ path: "/case/detail", query: { id } });
|
||
} else {
|
||
this.$message.error(res.message);
|
||
}
|
||
});
|
||
},
|
||
toExcellent(item) {
|
||
this.$router.push({
|
||
path: "/case/excellent",
|
||
query: {
|
||
majorId: item.majorId,
|
||
majorName: item.majorName,
|
||
riseRankTime: item.riseRankTime.split(" ")[0],
|
||
},
|
||
});
|
||
},
|
||
tylClick() {
|
||
window.open("https://m.qingxuetang.com/x/?appId=qxtcorp306130");
|
||
},
|
||
cylClick() {
|
||
window.open("https://u.boe.com/pc/course?keyword=创新力专区");
|
||
},
|
||
showClass(flag) {
|
||
if (flag) {
|
||
this.showUClass = flag;
|
||
}
|
||
},
|
||
saveLocalFilters() {
|
||
let typeCodeList = [];
|
||
this.tagList.forEach((item) => {
|
||
typeCodeList.push({
|
||
type: item.type,
|
||
code: item.code,
|
||
name: item.name,
|
||
});
|
||
});
|
||
let typeCodeString = JSON.stringify(typeCodeList);
|
||
sessionStorage.setItem(this.localSessionKey, typeCodeString);
|
||
},
|
||
loadLocalFilters(t) {
|
||
let hasData = sessionStorage.getItem(this.localSessionKey);
|
||
if (hasData) {
|
||
let typeCodeList = JSON.parse(hasData);
|
||
typeCodeList.forEach((item) => {
|
||
if (item.type == "0") {
|
||
this.keyWord = item.name;
|
||
} else if (item.type == "major_type") {
|
||
this.speciData.some((m) => {
|
||
if (m.code == item.code) {
|
||
m.fielclass = true;
|
||
return true;
|
||
}
|
||
return false;
|
||
});
|
||
} else if (item.type == "org_domain") {
|
||
this.domain.some((m) => {
|
||
if (m.code == item.code) {
|
||
m.fielclass = true;
|
||
return true;
|
||
}
|
||
return false;
|
||
});
|
||
}
|
||
});
|
||
}
|
||
},
|
||
majorall() {
|
||
this.queryCondition.majorType = "";
|
||
this.speciData.forEach((item) => {
|
||
item.fielclass = false;
|
||
});
|
||
this.search(true);
|
||
},
|
||
// 组织领域全部
|
||
domainall(type) {
|
||
// console.log(this.selectList, 999);
|
||
if (type == 1) {
|
||
// 清空一下所有的
|
||
this.domain.forEach((item) => {
|
||
item.fielclass = false;
|
||
item?.list?.forEach((sub) => {
|
||
sub.fielclass = false;
|
||
sub?.list.forEach((subsub) => {
|
||
subsub.fielclass = false;
|
||
});
|
||
});
|
||
});
|
||
this.twoList = [];
|
||
this.threeList = [];
|
||
} else if (type == 2) {
|
||
this.twoList.forEach((item) => {
|
||
item.fielclass = false;
|
||
});
|
||
// 清空当前元素的三级的
|
||
this.domain.forEach((item) => {
|
||
if (this.selectList.code == item.code) {
|
||
item?.list?.forEach((sub) => {
|
||
sub?.list?.forEach((three) => {
|
||
three.fielclass = false;
|
||
});
|
||
});
|
||
}
|
||
});
|
||
this.threeList = [];
|
||
} else if (type == 3) {
|
||
this.threeList.forEach((item) => {
|
||
item.fielclass = false;
|
||
});
|
||
}
|
||
this.search(true);
|
||
},
|
||
fieldmajor(item) {
|
||
//专业分类
|
||
item.fielclass = !item.fielclass;
|
||
this.search(true);
|
||
},
|
||
//组织领域
|
||
fieldswich(item, level) {
|
||
item.fielclass = !item.fielclass;
|
||
// 清空下边的为false的时候
|
||
if (!item.fielclass) {
|
||
if (Array.isArray(item.list)) {
|
||
item.list.forEach((subItem) => {
|
||
subItem.fielclass = false;
|
||
if (subItem.list) {
|
||
subItem.list.forEach((sub) => {
|
||
sub.fielclass = false;
|
||
});
|
||
}
|
||
});
|
||
}
|
||
if (level == 1) {
|
||
this.twoList = [];
|
||
this.threeList = [];
|
||
}
|
||
if (level == 2) {
|
||
this.threeList = [];
|
||
}
|
||
this.search(true);
|
||
return;
|
||
}
|
||
|
||
if (level === 1) {
|
||
this.twoList = [];
|
||
this.threeList = [];
|
||
this.twoList.push(...item.list);
|
||
// 全选根据他判断清楚三级
|
||
this.selectList = item;
|
||
} else if (level === 2) {
|
||
this.threeList = [];
|
||
this.threeList.push(...item.list);
|
||
} else if (level === 3) {
|
||
}
|
||
|
||
this.search(true);
|
||
},
|
||
banJump() {
|
||
if (this.resonimg.JumpUrl) {
|
||
window.open(this.resonimg.JumpUrl);
|
||
}
|
||
},
|
||
couresreso() {
|
||
let key = "case";
|
||
apiPlace.detail(key).then((res) => {
|
||
let lmj = JSON.parse(res.result.content);
|
||
this.resonimg = lmj[0];
|
||
});
|
||
},
|
||
specialized() {
|
||
let $this = this;
|
||
apiCase.majorTypes().then((res) => {
|
||
if (res.status == 200) {
|
||
if (res.status == 200) {
|
||
res.result.forEach((item) => {
|
||
item.fielclass = false;
|
||
item.type = "major_type";
|
||
});
|
||
}
|
||
this.speciData = res.result;
|
||
this.loadLocalFilters(1);
|
||
//this.Profess=res.result;
|
||
this.$nextTick(function () {
|
||
$this.initHeight =
|
||
document.getElementById("searchBox").offsetHeight;
|
||
$this.closeSearch();
|
||
});
|
||
}
|
||
});
|
||
},
|
||
// jumcasedet(item) {
|
||
// this.$router.push({ path: '/case/detail', query: { id: item.id } });
|
||
// },
|
||
// debounce(func, wait) {
|
||
// // 非立即执行
|
||
// let timeout;
|
||
// return function () {
|
||
// let context = this;
|
||
// let args = arguments;
|
||
// if (timeout) clearTimeout(timeout);
|
||
// timeout = setTimeout(() => {
|
||
// func.apply(context, args);
|
||
// }, wait);
|
||
// };
|
||
// },
|
||
//展示全部
|
||
displayAll(item) {
|
||
if (!item.isAll && item.summary && item.summary.length > 150) {
|
||
return item.summary.slice(0, 150) + "...";
|
||
}
|
||
return item.summary;
|
||
},
|
||
changeIsAll(item) {
|
||
item.isAll = !item.isAll;
|
||
},
|
||
closeSearch() {
|
||
this.showAll = !this.showAll;
|
||
var searchBoxHeght = document.getElementById("searchBox");
|
||
//console.log(this.initHeight,'this.initHeight');
|
||
if (this.initHeight > 100) {
|
||
this.searchwd = true;
|
||
}
|
||
//console.log(het,'het');
|
||
if (this.showAll) {
|
||
//searchBoxHeght.style.height = "auto";
|
||
searchBoxHeght.style.maxHeight = this.initHeight + "px";
|
||
} else {
|
||
searchBoxHeght.style.maxHeight = 70 + "px";
|
||
}
|
||
},
|
||
getAnkingData() {
|
||
apiCase.usernameList(5).then((res) => {
|
||
if (res.status == 200) {
|
||
this.ankingList = res.result;
|
||
}
|
||
});
|
||
},
|
||
// getPopularity() {
|
||
// apiCase.queryPraises(5).then(res => {
|
||
// if (res.status == 200) {
|
||
// this.Popularity = res.result;
|
||
// // console.log(this.Popularity)
|
||
// }
|
||
// });
|
||
// },
|
||
// getPositive() {
|
||
// apiCase.queryComments(5).then(res => {
|
||
// if (res.status == 200) {
|
||
// this.Positive = res.result;
|
||
// console.log(res);
|
||
// }
|
||
// });
|
||
// },
|
||
// 无用
|
||
async getdomain() {
|
||
let key = "org_domain";
|
||
await apiDict.items("org_domain").then((res) => {
|
||
if (res.status == 200) {
|
||
res.result.forEach((item) => {
|
||
item.fielclass = false;
|
||
item.type = key;
|
||
});
|
||
this.domain = res.result;
|
||
this.loadLocalFilters(2);
|
||
// if(res.result.length > 0) {
|
||
// this.orgDomainLevel(res.result)
|
||
// }
|
||
}
|
||
});
|
||
},
|
||
//删除，不再使用
|
||
// getProfess() {
|
||
// let key = "major_type";
|
||
// apiDict.items(key).then(res => {
|
||
// if (res.status == 200) {
|
||
// this.Profess = res.result;
|
||
// }
|
||
// });
|
||
// },
|
||
// orgDomainLevel(organization) {
|
||
// this.orgData = [];
|
||
// organization.forEach(item=>{
|
||
// this.orgData.push(item);
|
||
// if(item.list && item.list != "" && item.list.length > 0){
|
||
// item.list.forEach(it =>{
|
||
// this.orgData.push(it);
|
||
// })
|
||
// }
|
||
// })
|
||
// },
|
||
orgDomainTranslate(code) {
|
||
// 组织领域翻译
|
||
if (code == "") {
|
||
return;
|
||
}
|
||
//console.log(code,'code')
|
||
//console.log(this.domain,'this.domain')
|
||
let name = "";
|
||
let data = this.domain.find((item) => {
|
||
return item.code == code;
|
||
});
|
||
if (data) {
|
||
name = data.name;
|
||
}
|
||
return name;
|
||
},
|
||
majorTypeTranslate(code) {
|
||
// 专业分类翻译
|
||
let name = "";
|
||
let data = this.speciData.find((item) => item.code == code);
|
||
if (data) {
|
||
name = data.name;
|
||
}
|
||
return name;
|
||
},
|
||
emitInput(val) {
|
||
this.keyWord = val;
|
||
this.isSeach = true;
|
||
this.search(true);
|
||
},
|
||
searchTime() {
|
||
this.pubTimeNum++;
|
||
if (this.pubTimeNum > 2) {
|
||
this.pubTimeNum = 0;
|
||
}
|
||
if (this.pubTimeNum != 0) {
|
||
this.pageViewNum = 0;
|
||
}
|
||
this.queryCondition.orderField = "sysCreateTime";
|
||
this.queryCondition.orderAsc =
|
||
this.pubTimeNum == 2 ? true : this.pubTimeNum == 1 ? false : "";
|
||
this.search(true);
|
||
},
|
||
searchPageView() {
|
||
this.pageViewNum++;
|
||
if (this.pageViewNum > 2) {
|
||
this.pageViewNum = 0;
|
||
}
|
||
if (this.pageViewNum != 0) {
|
||
this.pubTimeNum = 0;
|
||
}
|
||
this.queryCondition.orderField = "views";
|
||
this.queryCondition.orderAsc =
|
||
this.pageViewNum == 2 ? true : this.pageViewNum == 1 ? false : "";
|
||
this.search(true);
|
||
},
|
||
yearsChange(e) {
|
||
this.search(true);
|
||
},
|
||
searchexcellent(num) {
|
||
this.isTimeData = false;
|
||
this.isTime = false;
|
||
this.caseTimeShow = true;
|
||
this.pubTimeNum = 0;
|
||
this.pageViewNum = 0;
|
||
this.queryCondition.orderField = "";
|
||
this.queryCondition.orderAsc = "";
|
||
// if(this.queryCondition.type==num){
|
||
// this.queryCondition.excellent =false;
|
||
// this.queryCondition.type = '';
|
||
// this.search(true)
|
||
// return
|
||
// }
|
||
this.queryCondition.excellent = false;
|
||
this.queryCondition.type = num;
|
||
this.years = [];
|
||
if (num == "excellent") {
|
||
this.queryCondition.excellent = true;
|
||
this.queryCondition.type = num;
|
||
}
|
||
if (num == "all" || num == "recommend") {
|
||
this.pubTimeNum = 1;
|
||
this.queryCondition.orderField = "sysCreateTime";
|
||
this.queryCondition.orderAsc = false;
|
||
}
|
||
if (num == "time") {
|
||
this.isTime = true;
|
||
this.caseTimeShow = false;
|
||
this.isTimeData = true;
|
||
}
|
||
if (num == "collect") {
|
||
this.caseTimeShow = false;
|
||
}
|
||
if (this.timeoutId) {
|
||
clearTimeout(this.timeoutId);
|
||
this.timeoutId = null;
|
||
}
|
||
this.search(true);
|
||
// this.getCaseData();
|
||
},
|
||
// searchData(num) {
|
||
// // if(num == 1){
|
||
// // this.queryCondition.excellent = !this.queryCondition.excellent;
|
||
// // this.getCaseData();
|
||
// // }
|
||
// this.queryCondition.pageIndex = 1;
|
||
// this.queryCondition.type = num;
|
||
// this.getCaseData();
|
||
// },
|
||
// 滚动请求
|
||
handleScroll() {
|
||
let innerw = document.querySelector("#fixd-box");
|
||
// let innerHeight = document.querySelector("#case-list-content")
|
||
// .clientHeight;
|
||
// let outerHeight = document.documentElement.clientHeight;
|
||
let outerWidth = innerw.clientWidth;
|
||
let scrollTop = document.documentElement.scrollTop;
|
||
// if (outerHeight + scrollTop + 350 >= innerHeight) {
|
||
// if (this.moreState == 1) {
|
||
// this.debounce(this.loadMore(), 5000);
|
||
// }
|
||
// }
|
||
if (scrollTop > 260) {
|
||
document.querySelector("#fixd-box").style.cssText =
|
||
"position: fixed;top: 10px;width:" + outerWidth + "px";
|
||
} else {
|
||
document.querySelector("#fixd-box").style.cssText = "position: static";
|
||
}
|
||
},
|
||
useHotword(item) {
|
||
this.keyWord = item.keyword;
|
||
this.search();
|
||
},
|
||
searchterm() {
|
||
apiSearchterm.list(5, 3).then((res) => {
|
||
if (res.status === 200) {
|
||
this.searchRecords = res.result;
|
||
}
|
||
});
|
||
},
|
||
// 监听滚动发请求
|
||
// loadMore() {
|
||
// this.queryCondition.pageIndex += 1;
|
||
// this.getCaseData();
|
||
// },
|
||
protocolCheck(obj) {
|
||
this.protocolConfirmButton = !obj;
|
||
},
|
||
protocolConfirm() {
|
||
this.protocolDialogVisible = false;
|
||
this.$store.dispatch("portal/SetReadProtocol", true);
|
||
},
|
||
// handleSizeChange(item) {
|
||
// this.queryCondition.pageSize = item;
|
||
// },
|
||
// handleCurrentChange(item) {
|
||
// this.queryCondition.pageIndex = item;
|
||
// },
|
||
getAllFielclass() {
|
||
//获取全部选中的标签
|
||
let newlist = JSON.parse(JSON.stringify(this.domain));
|
||
return newlist.filter((one) => {
|
||
one.list = one.list.filter((two) => {
|
||
// if (!two.fielclass) {
|
||
// one.list = []
|
||
// }
|
||
two.list = two.list.filter((three) => {
|
||
// if (!three.fielclass) {
|
||
// two.list = []
|
||
// }
|
||
return three.fielclass;
|
||
});
|
||
return two.fielclass;
|
||
});
|
||
return one.fielclass;
|
||
});
|
||
},
|
||
// 改变分页
|
||
currentChange(val) {
|
||
this.caseList.showPagCount = 0;
|
||
this.queryCondition.pageIndex = val;
|
||
this.search();
|
||
},
|
||
// 查询
|
||
search(num = false) {
|
||
// 记录查询的数据
|
||
if (this.keyWord) {
|
||
apiSearchterm.save({ keyword: this.keyWord, type: 3 });
|
||
}
|
||
if (!this.isFind) {
|
||
this.isFind = true;
|
||
}
|
||
if (num) {
|
||
this.caseList.showPagCount = 0;
|
||
this.queryCondition.pageIndex = 1;
|
||
}
|
||
if (this.keyWord != this.queryCondition.keyWord) {
|
||
this.queryCondition.keyWord = this.keyWord;
|
||
// this.tagList.forEach((tag, index) => {
|
||
// this.tagsClose(tag, index);
|
||
// });
|
||
}
|
||
if (this.queryCondition.majorType == 0) {
|
||
this.queryCondition.majorType = "";
|
||
}
|
||
this.getCaseData();
|
||
},
|
||
|
||
async getCaseData() {
|
||
this.saveLocalFilters(); //存储本地刷新有记录
|
||
let majorTypeList = [];
|
||
let allFielclass = JSON.parse(JSON.stringify(this.getAllFielclass()));
|
||
// 获取树状id
|
||
this.queryCondition.orgDomainDtos = allFielclass.map((item) => {
|
||
item.list = item.list.map((two) => {
|
||
two.list = two.list.map((three) => {
|
||
return {
|
||
parent: three.code,
|
||
};
|
||
});
|
||
return {
|
||
parent: two.code,
|
||
children: two.list || [],
|
||
};
|
||
});
|
||
return {
|
||
parent: item.code,
|
||
children: item.list || [],
|
||
};
|
||
});
|
||
// console.log(JSON.stringify(this.queryCondition.orgDomainDtos));
|
||
|
||
// 专业分类的id
|
||
this.tagList.forEach((tag) => {
|
||
if (tag.type == "0") {
|
||
this.queryCondition.keyWord = tag.name;
|
||
} else if (tag.type == "major_type") {
|
||
majorTypeList.push(tag.code);
|
||
}
|
||
});
|
||
this.queryCondition.majorType = majorTypeList.join(",");
|
||
//设置年
|
||
this.queryCondition.years = this.years.map((item) => parseInt(item));
|
||
|
||
// 设置最佳案例为true或是false
|
||
if (this.queryCondition.type == "excellent") {
|
||
this.queryCondition.excellent = true;
|
||
} else {
|
||
this.queryCondition.excellent = false;
|
||
}
|
||
|
||
//this.getTags();
|
||
// if (this.queryCondition.pageIndex == 1) {
|
||
// this.caseList.list = [];
|
||
// }
|
||
this.moreState = 2;
|
||
// this.queryCondition.pubTimeNum = this.pubTimeNum
|
||
// this.queryCondition.pageViewNum = this.pageViewNum
|
||
this.numIsFalse = true;
|
||
if (this.queryCondition.type == "collect") {
|
||
const params = {
|
||
pageIndex: this.queryCondition.pageIndex,
|
||
pageSize: 5,
|
||
orderField: this.queryCondition.orderField,
|
||
orderAsc: this.queryCondition.orderAsc,
|
||
};
|
||
await apiCase.queryFavoriteCaseOfIndex(params).then((res) => {
|
||
if (res.status == 200) {
|
||
if (res.result.list.length > 0) {
|
||
this.isSeach = false;
|
||
res.result.list.forEach((item) => {
|
||
item.majorType = item.majorType
|
||
? item.majorType.split(",")
|
||
: [];
|
||
item.isAll = false;
|
||
item.authorInfo = {
|
||
aid: "",
|
||
name: "",
|
||
orgInfo: "",
|
||
avatar: "",
|
||
sex: null,
|
||
};
|
||
});
|
||
res.result.list.forEach((item) => {
|
||
item.viewRankTags = item.viewRankTags?.slice(0, 2) || [];
|
||
});
|
||
this.caseList.list = res.result.list;
|
||
this.getCaseUserData(res.result.list);
|
||
// 给所有的赋值
|
||
this.caseList.count = res.result.count;
|
||
this.caseList.showPagCount = res.result.count;
|
||
this.timeoutId = setTimeout(() => {
|
||
this.numIsFalse = false;
|
||
}, 3000);
|
||
}
|
||
}
|
||
});
|
||
return;
|
||
}
|
||
if (this.queryCondition.type == "time") {
|
||
// const data = {
|
||
// pageIndex: this.queryCondition.pageIndex,
|
||
// pageSize: 5,
|
||
// contentType: 3,
|
||
// aid: this.userInfo.aid||'965342027497607168',
|
||
// hidden: '',
|
||
// eventKey: 'readCase'
|
||
// }
|
||
// await apiCase.queryViewRecord(data).then(res=>{
|
||
// if(res.status == 200){
|
||
// if(res.result.list.length > 0){
|
||
// let ids = res.result.list.map(item=>item.contentId);
|
||
// const noReapetIds = [...new Set(ids)];
|
||
// this.articlePageList = res.result.list;
|
||
// this.getCase(noReapetIds,res.result.list)
|
||
// this.caseList.count = res.result.count;
|
||
// this.caseList.showPagCount = res.result.count;
|
||
// }
|
||
// }
|
||
// })
|
||
const params = {
|
||
pageIndex: this.queryCondition.pageIndex,
|
||
};
|
||
await apiCase.browsingHistory(params).then((res) => {
|
||
if (res.status == 200) {
|
||
if (res.result.list.length > 0) {
|
||
this.isSeach = false;
|
||
res.result.list.forEach((item) => {
|
||
item.majorType = item.majorType
|
||
? item.majorType.split(",")
|
||
: [];
|
||
item.isAll = false;
|
||
item.authorInfo = {
|
||
aid: "",
|
||
name: "",
|
||
orgInfo: "",
|
||
avatar: "",
|
||
sex: null,
|
||
};
|
||
});
|
||
res.result.list.forEach((item) => {
|
||
item.viewRankTags = item.viewRankTags?.slice(0, 2) || [];
|
||
});
|
||
this.caseList.list = res.result.list;
|
||
this.getCaseUserData(res.result.list);
|
||
this.caseList.count = res.result.count;
|
||
this.caseList.showPagCount = res.result.count;
|
||
this.timeoutId = setTimeout(() => {
|
||
this.numIsFalse = false;
|
||
}, 3000);
|
||
}
|
||
}
|
||
});
|
||
return;
|
||
}
|
||
await apiCase
|
||
.queryListV2(this.queryCondition)
|
||
.then((res) => {
|
||
if (res.status == 200) {
|
||
if (res.result.list.length > 0) {
|
||
this.isSeach = false;
|
||
res.result.list.forEach((item) => {
|
||
item.majorType = item.majorType
|
||
? item.majorType.split(",")
|
||
: [];
|
||
item.isAll = false;
|
||
item.authorInfo = {
|
||
aid: "",
|
||
name: "",
|
||
orgInfo: "",
|
||
avatar: "",
|
||
sex: null,
|
||
};
|
||
});
|
||
// this.caseList.list.push(...res.result.list);
|
||
this.moreState = 1;
|
||
if (res.result.count === res.result.list.length) {
|
||
this.moreState = 3;
|
||
}
|
||
} else {
|
||
this.moreState = 3;
|
||
}
|
||
if (res.result.list.length === 0) {
|
||
this.moreState = 3;
|
||
this.isSeach = false;
|
||
}
|
||
console.log(res?.result?.list, "有没有数据1");
|
||
res.result.list.forEach((item) => {
|
||
item.viewRankTags = item.viewRankTags?.slice(0, 2) || [];
|
||
});
|
||
console.log(res?.result?.list, "有没有数据2");
|
||
this.caseList.list = res.result.list;
|
||
this.getCaseUserData(res.result.list);
|
||
// 给所有的赋值
|
||
this.caseList.count = res.result.count;
|
||
this.caseList.showPagCount = res.result.count;
|
||
this.timeoutId = setTimeout(() => {
|
||
this.numIsFalse = false;
|
||
}, 3000);
|
||
} else {
|
||
this.$message.error(res.message);
|
||
}
|
||
})
|
||
.catch((err) => {
|
||
// console.log(err);
|
||
this.timeoutId = setTimeout(() => {
|
||
this.numIsFalse = false;
|
||
}, 3000);
|
||
});
|
||
|
||
// await apiCase.queryList(this.queryCondition).then(res => {
|
||
// if (res.status == 200) {
|
||
// if (res.result.list.length > 0) {
|
||
// this.isSeach = false;
|
||
// res.result.list.forEach(item => {
|
||
// item.majorType = item.majorType.split(",");
|
||
// item.isAll = false;
|
||
// item.authorInfo = {
|
||
// aid: "",
|
||
// name: "",
|
||
// orgInfo: "",
|
||
// avatar: "",
|
||
// sex: null
|
||
// };
|
||
// });
|
||
// this.caseList.list.push(...res.result.list);
|
||
// this.caseList.count = res.result.count;
|
||
// this.getCaseUserData(res.result.list);
|
||
// this.moreState = 1;
|
||
// if (res.result.count === res.result.list.length) {
|
||
// this.moreState = 3;
|
||
// }
|
||
// } else {
|
||
// this.moreState = 3;
|
||
// }
|
||
// } else {
|
||
// this.$message.error(res.message);
|
||
// }
|
||
// })
|
||
// .catch(err => {
|
||
// console.log(err);
|
||
// });
|
||
},
|
||
getCase(ids, list) {
|
||
apiCase.ids(ids).then((res) => {
|
||
if (res.status == 200) {
|
||
this.isSeach = false;
|
||
const listData = [];
|
||
list.forEach((item, index) => {
|
||
res.result.some((con) => {
|
||
if (con.id == item.contentId) {
|
||
item.info = con;
|
||
con.eventTime = item.eventTime;
|
||
listData.push(con);
|
||
if (typeof item.info.majorType == "string") {
|
||
item.info.majorType = item.info.majorType.split(",");
|
||
}
|
||
return true;
|
||
} else {
|
||
return false;
|
||
}
|
||
});
|
||
});
|
||
listData.forEach((item) => {
|
||
item.info = {};
|
||
item.deleted = false;
|
||
item.authorInfo = {
|
||
aid: "",
|
||
name: "",
|
||
orgInfo: "",
|
||
avatar: "",
|
||
sex: null,
|
||
};
|
||
item.isAll = false;
|
||
});
|
||
setTimeout(() => {
|
||
this.numIsFalse = false;
|
||
}, 3000);
|
||
this.getCaseUserData(listData);
|
||
this.caseList.list = listData;
|
||
console.log(listData, "this.caseList.list");
|
||
}
|
||
});
|
||
},
|
||
// getTags() {
|
||
// this.searchTags = [];
|
||
// let caseData = deepClone(this.queryCondition);
|
||
// for (let i in caseData) {
|
||
// if (
|
||
// caseData[i] !== "" &&
|
||
// i !== "pageIndex" &&
|
||
// i !== "pageSize" &&
|
||
// i !== "orderField" &&
|
||
// i !== "orderAsc" &&
|
||
// i !== "isTop" &&
|
||
// caseData[i] !== null &&
|
||
// caseData[i] !== undefined
|
||
// ) {
|
||
// if (caseData[i] == "0") {
|
||
// return;
|
||
// }
|
||
// if(i == 'majorType'){
|
||
// this.searchTags.push({ type:'majorType',value:this.majorTypeTranslate(caseData[i])})
|
||
// }
|
||
// if(i == 'orgDomain'){
|
||
// this.searchTags.push({type:'orgDomain',value:this.orgDomainTranslate(caseData[i])})
|
||
// }
|
||
// if(i == 'keyWord'){
|
||
// this.searchTags.push({type:'keyWord',value:caseData[i]})
|
||
// }
|
||
// }
|
||
// }
|
||
// },
|
||
// 清楚数组的元素
|
||
// clear(tag) {
|
||
// if (tag.type == 'org_domain') {
|
||
// this.twoList = [];
|
||
// this.threeList = [];
|
||
// }
|
||
// if (tag.type == 1) {
|
||
// console.log(111);
|
||
// this.threeList = [];
|
||
// }
|
||
// },
|
||
tagsClose(tag, index) {
|
||
// 课程分类
|
||
if (tag.hasOwnProperty("checked")) {
|
||
tag.checked = false;
|
||
this.queryCondition.sysType1 = "";
|
||
this.queryCondition.sysType2 = "";
|
||
this.queryCondition.sysType3 = "";
|
||
} else {
|
||
// 案例分类
|
||
tag.fielclass = false;
|
||
}
|
||
if (tag.type == 0) {
|
||
this.keyWord = "";
|
||
}
|
||
// if(tag.type=='org_domain'){
|
||
// console.log(tag)
|
||
// this.domain.some((m,idx)=>{
|
||
// if(m.code=tag.code){
|
||
// m.fielclass=false;
|
||
// return true;
|
||
// }
|
||
// return false;
|
||
// })
|
||
// }else if(tag.type=='major_type'){
|
||
// this.speciData.some((m,idx)=>{
|
||
// if(m.code=tag.code){
|
||
// m.fielclass=false;
|
||
// return true;
|
||
// }
|
||
// return false;
|
||
// })
|
||
// }else if(tag.type=='keyWord'){
|
||
// this.queryCondition.keyWord = "";
|
||
// this.keyWord = "";
|
||
// }
|
||
//this.fieldData.splice(index,1);
|
||
//this.getCaseData();
|
||
this.search(true);
|
||
},
|
||
getCaseUserData(caseList) {
|
||
let ids = caseList.map((item, index) => {
|
||
return item.authorId;
|
||
});
|
||
//不能为空
|
||
if (!ids.length) return;
|
||
|
||
const noReapetIds = [...new Set(ids)];
|
||
apiUser.getByIds(noReapetIds).then((res) => {
|
||
if (res.status == 200) {
|
||
caseList.forEach((item, index) => {
|
||
res.result.some((author) => {
|
||
if (author.aid == item.authorId) {
|
||
item.authorInfo = author;
|
||
author.orgInfo = cutFullName(author.orgInfo, 1);
|
||
return true;
|
||
} else {
|
||
return false;
|
||
}
|
||
});
|
||
});
|
||
} else {
|
||
this.$message.error(res.message);
|
||
}
|
||
});
|
||
},
|
||
getPopularity() {
|
||
// apiCase.queryPraises(5).then(res => {
|
||
// if (res.status == 200) {
|
||
// this.Popularity = res.result.slice(0,3);
|
||
// // if (res.result.length < 5) {
|
||
// // for (let i = 0; i = (5 - res.result.length); i++) {
|
||
// // this.Popularity.push({
|
||
// // authorName: '',
|
||
// // count: 1,
|
||
// // id: '',
|
||
// // title: '',
|
||
// // })
|
||
// // }
|
||
// // }
|
||
|
||
// }
|
||
// });
|
||
apiCase
|
||
.queryPraisesNew(3, this.popularityName == "季度" ? 1 : 2)
|
||
.then((res) => {
|
||
if (res.status == 200) {
|
||
this.Popularity = res.result;
|
||
}
|
||
});
|
||
},
|
||
getPositive() {
|
||
// apiCase.queryComments(5).then(res => {
|
||
// if (res.status == 200) {
|
||
// this.Positive = res.result.slice(0,3);
|
||
// // if (res.result.length < 5) {
|
||
// // for (let i = 0; i = (5 - res.result.length); i++) {
|
||
// // this.Positive.push({
|
||
// // authorName: '',
|
||
// // count: 1,
|
||
// // id: '',
|
||
// // title: '',
|
||
// // })
|
||
// // }
|
||
|
||
// // }
|
||
// }
|
||
// });
|
||
apiCase
|
||
.queryCommentsNew(3, this.favorableName == "季度" ? 3 : 4)
|
||
.then((res) => {
|
||
if (res.status == 200) {
|
||
this.Positive = res.result;
|
||
}
|
||
});
|
||
},
|
||
|
||
getQueryRecommendRank() {
|
||
apiCase.queryRecommendRank(3).then((res) => {
|
||
if (res.status == 200) {
|
||
this.recommendRank = res.result;
|
||
}
|
||
});
|
||
},
|
||
|
||
jumpRouter(item) {
|
||
// console.log(item)
|
||
this.$router.push(`/case/detail?id=${item.id}`);
|
||
},
|
||
// 案例立即咨询
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
.el-dropdown-link {
|
||
cursor: pointer;
|
||
font-weight: 400;
|
||
font-size: 14px;
|
||
color: rgba(51, 51, 51, 0.9);
|
||
}
|
||
|
||
.el-icon--right {
|
||
margin-left: 14px !important;
|
||
}
|
||
|
||
.the_charts {
|
||
position: relative;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
margin-bottom: 10px;
|
||
font-size: 17px;
|
||
max-width: 400px;
|
||
min-width: 260px;
|
||
height: 47px;
|
||
background: #ddedff;
|
||
border-radius: 8px;
|
||
|
||
.text {
|
||
font-size: 17px;
|
||
color: #387df7;
|
||
}
|
||
|
||
.icon {
|
||
position: absolute;
|
||
font-size: 17px;
|
||
color: #387df7;
|
||
right: 25px;
|
||
top: 50%;
|
||
transform: translateY(-50%);
|
||
}
|
||
}
|
||
|
||
// 课程分类
|
||
.course-title-style {
|
||
position: relative;
|
||
height: 100px;
|
||
background-image: url("../../../../public/images/courseBg.png");
|
||
background-repeat: no-repeat;
|
||
background-size: 100% 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.imgTilte {
|
||
& div:first-child {
|
||
padding-left: 40px;
|
||
font-size: 30px;
|
||
color: #ffffff;
|
||
}
|
||
|
||
& div:last-child {
|
||
padding-left: 40px;
|
||
font-size: 20px;
|
||
color: #ffffff;
|
||
opacity: 0.5;
|
||
font-family: ArialMT !important;
|
||
}
|
||
}
|
||
}
|
||
|
||
// 三级列表
|
||
.course-list {
|
||
background-color: #fff;
|
||
|
||
.course-one {
|
||
position: relative;
|
||
|
||
.course-one-content {
|
||
cursor: pointer;
|
||
line-height: 38px;
|
||
height: 38px;
|
||
padding-left: 40px;
|
||
background: linear-gradient(270deg, #f0f7ff 0%, #ddedff 100%);
|
||
}
|
||
|
||
// 二级的高亮
|
||
.courseTwoActive {
|
||
color: #387df7;
|
||
border-image: linear-gradient(
|
||
90deg,
|
||
rgba(47, 101, 236, 1),
|
||
rgba(228, 236, 255, 1)
|
||
)
|
||
1 1 !important;
|
||
}
|
||
|
||
.course-two {
|
||
position: relative;
|
||
border-bottom: 1px solid;
|
||
border-image: linear-gradient(
|
||
333deg,
|
||
rgba(243, 243, 243, 1),
|
||
rgba(227, 227, 227, 1)
|
||
)
|
||
1 1;
|
||
|
||
.course-two-content {
|
||
cursor: pointer;
|
||
height: 38px;
|
||
line-height: 38px;
|
||
font-size: 16px;
|
||
padding-left: 40px;
|
||
}
|
||
}
|
||
|
||
.popover {
|
||
background: linear-gradient(
|
||
180deg,
|
||
rgba(78, 166, 255, 0.2) 0%,
|
||
rgba(78, 166, 255, 0) 100%
|
||
);
|
||
}
|
||
}
|
||
}
|
||
|
||
.u-class {
|
||
::v-deep .el-dialog {
|
||
border-radius: 15px;
|
||
|
||
.el-dialog__headerbtn .el-dialog__close {
|
||
color: white;
|
||
position: absolute;
|
||
z-index: 99;
|
||
right: 15px;
|
||
}
|
||
}
|
||
|
||
::v-deep .el-dialog__body {
|
||
padding: 0px;
|
||
}
|
||
|
||
.ClassBoxContent {
|
||
width: 100%;
|
||
height: 396px;
|
||
// background: red;
|
||
border-radius: 15px;
|
||
|
||
.ContentBox {
|
||
width: 100%;
|
||
height: 100%;
|
||
position: absolute;
|
||
z-index: 9;
|
||
display: flex;
|
||
|
||
.left,
|
||
.right {
|
||
height: calc(100% - 30px);
|
||
}
|
||
|
||
.left {
|
||
padding-left: 30px;
|
||
width: 48%;
|
||
margin-top: -32px;
|
||
|
||
.title {
|
||
width: 200px;
|
||
height: 59px;
|
||
line-height: 59px;
|
||
text-align: center;
|
||
margin-left: -8px;
|
||
font-size: 38px;
|
||
color: white;
|
||
margin-top: 42.97px;
|
||
padding-top: 5px;
|
||
text-shadow: 0 6px 3px rgba(96, 85, 243, 0.4);
|
||
}
|
||
|
||
.jy {
|
||
color: white;
|
||
font-size: 20px;
|
||
margin-top: 87.53px;
|
||
font-weight: 400;
|
||
}
|
||
|
||
.msg {
|
||
margin-top: 5px;
|
||
color: rgba(255, 255, 255, 0.85);
|
||
width: 326px;
|
||
text-align: justify;
|
||
line-height: 20px;
|
||
}
|
||
|
||
.bottom {
|
||
width: 100px;
|
||
height: 1px;
|
||
background: rgba(255, 255, 255, 0.85);
|
||
margin-top: 40px;
|
||
}
|
||
}
|
||
|
||
.right {
|
||
// padding-left: 10px;
|
||
width: 50%;
|
||
|
||
.tyl {
|
||
cursor: pointer;
|
||
width: calc(100% - 20px);
|
||
background: rgba(255, 255, 255, 0.95);
|
||
box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.1);
|
||
border-radius: 4px;
|
||
height: 160px;
|
||
margin-top: 163px;
|
||
|
||
.tyl_title {
|
||
width: 100%;
|
||
padding-left: 20px;
|
||
padding-top: 20px;
|
||
|
||
.tyl_title_img {
|
||
width: 18px;
|
||
height: 18px;
|
||
}
|
||
|
||
.tyl_title_msg {
|
||
font-size: 20px;
|
||
margin-left: 10px;
|
||
color: #333333;
|
||
font-weight: 600;
|
||
}
|
||
}
|
||
|
||
.tyl_jy {
|
||
margin-top: 6.5px;
|
||
font-size: 14px;
|
||
font-weight: 600;
|
||
padding-left: 20px;
|
||
color: #333333;
|
||
}
|
||
|
||
.tyl_msg {
|
||
width: 350.36px;
|
||
margin-top: 13px;
|
||
margin-left: 20px;
|
||
font-size: 14px;
|
||
color: #666666;
|
||
font-weight: 400;
|
||
letter-spacing: 0;
|
||
text-align: justify;
|
||
}
|
||
}
|
||
|
||
.tyl:hover {
|
||
border: 0.96px solid rgba(140, 105, 242, 1);
|
||
box-shadow: 7px 5px 6px 0px rgba(76, 31, 221, 0.3);
|
||
}
|
||
|
||
.text_msg {
|
||
margin: 43px 0 0 222px;
|
||
font-size: 14px;
|
||
color: #000;
|
||
}
|
||
|
||
.cyl {
|
||
cursor: pointer;
|
||
width: calc(100% - 20px);
|
||
background: rgba(255, 255, 255, 0.95);
|
||
box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.1);
|
||
border-radius: 4px;
|
||
height: 180px;
|
||
margin-top: 10px;
|
||
|
||
.tyl_title {
|
||
width: 100%;
|
||
padding-left: 20px;
|
||
padding-top: 20px;
|
||
|
||
.tyl_title_img {
|
||
width: 18px;
|
||
height: 18px;
|
||
}
|
||
|
||
.tyl_title_msg {
|
||
font-size: 20px;
|
||
margin-left: 10px;
|
||
color: #333333;
|
||
font-weight: 600;
|
||
}
|
||
}
|
||
|
||
.tyl_jy {
|
||
margin-top: 6.5px;
|
||
font-size: 14px;
|
||
font-weight: 600;
|
||
padding-left: 20px;
|
||
color: #333333;
|
||
}
|
||
|
||
.tyl_msg {
|
||
width: 350.36px;
|
||
margin-top: 13px;
|
||
margin-left: 20px;
|
||
font-size: 14px;
|
||
color: #666666;
|
||
font-weight: 400;
|
||
letter-spacing: 0;
|
||
text-align: justify;
|
||
}
|
||
}
|
||
|
||
.cyl:hover {
|
||
border: 0.96px solid rgba(140, 105, 242, 1);
|
||
box-shadow: 7px 5px 6px 0px rgba(76, 31, 221, 0.24);
|
||
}
|
||
}
|
||
}
|
||
|
||
.img {
|
||
width: 835px;
|
||
height: 428px;
|
||
margin-left: -1px;
|
||
margin-top: -1px;
|
||
position: absolute;
|
||
top: 0px;
|
||
}
|
||
}
|
||
}
|
||
|
||
.fieldbox {
|
||
display: flex;
|
||
white-space: nowrap;
|
||
flex-wrap: wrap;
|
||
|
||
div {
|
||
padding: 0 15px;
|
||
display: inline-block;
|
||
font-size: 14px;
|
||
line-height: 25px;
|
||
color: #3d3d3d;
|
||
font-weight: 500;
|
||
}
|
||
|
||
.fieldactive {
|
||
color: #387df7;
|
||
}
|
||
}
|
||
|
||
.field {
|
||
display: flex;
|
||
white-space: nowrap;
|
||
|
||
// flex-wrap: wrap;
|
||
div {
|
||
padding: 0 15px;
|
||
// display: inline-block;
|
||
font-size: 14px;
|
||
line-height: 25px;
|
||
color: #3d3d3d;
|
||
font-weight: 500;
|
||
}
|
||
|
||
.fieldactive {
|
||
color: #387df7;
|
||
}
|
||
}
|
||
|
||
::v-deep .el-checkbox-button.is-checked .el-checkbox-button__inner {
|
||
box-shadow: none !important;
|
||
}
|
||
|
||
::v-deep .el-checkbox-button.is-checked .el-checkbox-button__inner {
|
||
color: #387df7 !important;
|
||
background-color: #fff !important;
|
||
}
|
||
|
||
::v-deep .el-checkbox-button--mini .el-checkbox-button__inner {
|
||
font-size: 14px;
|
||
}
|
||
|
||
::v-deep .el-checkbox-button .el-checkbox-button__inner {
|
||
border: none !important;
|
||
}
|
||
|
||
.notcoures {
|
||
text-align: center;
|
||
|
||
img {
|
||
width: 360px;
|
||
height: 226px;
|
||
}
|
||
|
||
h5 {
|
||
font-size: 14px;
|
||
color: #333333;
|
||
font-weight: 400;
|
||
}
|
||
}
|
||
|
||
.orgaicon {
|
||
width: 22px;
|
||
height: 22px;
|
||
vertical-align: middle;
|
||
margin-right: 8px;
|
||
|
||
img {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.course-resources {
|
||
margin-top: 26px;
|
||
|
||
img {
|
||
width: 100%;
|
||
height: 100%;
|
||
border-radius: 8px;
|
||
}
|
||
}
|
||
|
||
.case-banner {
|
||
height: 240px;
|
||
background: url("../../../../public/images/case-banner.png");
|
||
}
|
||
|
||
::v-deep .el-checkbox {
|
||
.el-checkbox__input {
|
||
.el-checkbox__inner {
|
||
border: 1px solid #3e3c3c;
|
||
}
|
||
}
|
||
}
|
||
|
||
::v-deep .el-radio-button {
|
||
margin-right: -5px;
|
||
}
|
||
|
||
::v-deep .el-button {
|
||
border-radius: 0px;
|
||
}
|
||
|
||
.case-titdiv {
|
||
line-height: 30px;
|
||
display: flex;
|
||
|
||
.case-tittext {
|
||
font-size: 18px;
|
||
font-weight: 600;
|
||
color: #333333;
|
||
max-width: 67%;
|
||
}
|
||
|
||
.case-activeText {
|
||
line-height: 27.5px;
|
||
|
||
.comWords {
|
||
color: white;
|
||
font-size: 12px;
|
||
border-radius: 2px;
|
||
padding: 2px 4px;
|
||
margin-left: 15px;
|
||
}
|
||
}
|
||
}
|
||
|
||
::v-deep .interact-bar .interact-bar-btns .interact-bar-btn {
|
||
margin-left: 0;
|
||
margin-right: 20px;
|
||
}
|
||
|
||
.clearfix:after {
|
||
content: "020";
|
||
display: block;
|
||
height: 0;
|
||
clear: both;
|
||
visibility: hidden;
|
||
}
|
||
|
||
.keyword-text {
|
||
div {
|
||
padding: 0px 8px;
|
||
margin-top: 5px;
|
||
float: left;
|
||
line-height: 24px;
|
||
font-size: 12px;
|
||
border-radius: 2px;
|
||
margin-right: 8px;
|
||
color: #2c68ff;
|
||
height: 24px;
|
||
background: rgba(44, 104, 255, 0.06);
|
||
}
|
||
}
|
||
|
||
.searBox {
|
||
text-align: center;
|
||
margin: 0px auto 0 auto;
|
||
}
|
||
|
||
#searchBox {
|
||
overflow: hidden;
|
||
}
|
||
|
||
::v-deep .title-line-ellipsis {
|
||
// width: 100%;
|
||
display: -webkit-box;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
-webkit-box-orient: vertical;
|
||
-webkit-line-clamp: 1;
|
||
box-sizing: border-box;
|
||
word-break: break-all;
|
||
}
|
||
|
||
::v-deep .el-card__body {
|
||
padding: 0;
|
||
}
|
||
|
||
::v-deep .bacolor:nth-child(odd) {
|
||
background-color: #f6f6f6;
|
||
padding: 0 5px;
|
||
}
|
||
|
||
::v-deep .bacolor:nth-child(even) {
|
||
background-color: #fff;
|
||
padding: 0 5px;
|
||
}
|
||
|
||
::v-deep .el-card {
|
||
border: none;
|
||
border-radius: 0px;
|
||
// border: 1px solid #ebeef5;
|
||
}
|
||
|
||
::v-deep .el-radio-button__inner,
|
||
.el-radio-group {
|
||
vertical-align: top;
|
||
}
|
||
|
||
::v-deep .el-radio-button__inner {
|
||
background: none;
|
||
}
|
||
|
||
::v-deep .el-radio-button:first-child .el-radio-button__inner {
|
||
border-left: none;
|
||
|
||
// border-radius: 4px 0 0 4px;
|
||
//box-shadow: none!important;
|
||
}
|
||
|
||
::v-deep.item-title {
|
||
margin: 15px 10px 10px 0;
|
||
font-size: 16px !important;
|
||
font-weight: 400;
|
||
color: #6b7c85;
|
||
line-height: 25px;
|
||
}
|
||
|
||
.item-line {
|
||
padding-left: 2px;
|
||
height: 20px;
|
||
// background: #ddd;
|
||
}
|
||
|
||
.portal-content {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
.searchbar {
|
||
background-color: #ffffff;
|
||
}
|
||
|
||
.fixed {
|
||
position: fixed;
|
||
top: 0px;
|
||
background-color: #f0f0f0;
|
||
z-index: 999;
|
||
height: 50px;
|
||
}
|
||
|
||
.protocol {
|
||
.protocol-title {
|
||
font-size: 20px;
|
||
font-weight: 600;
|
||
text-align: center;
|
||
margin-bottom: 25px;
|
||
}
|
||
|
||
.protocol-content {
|
||
font-size: 14px;
|
||
line-height: 25px;
|
||
}
|
||
}
|
||
|
||
.left-div {
|
||
border: none;
|
||
|
||
.quyer-tag {
|
||
// margin-left: 10px;
|
||
.order-class {
|
||
padding: 0px 12px;
|
||
color: #6e7b84;
|
||
line-height: 32px;
|
||
border-radius: 0px;
|
||
|
||
.el-icon--right {
|
||
margin-left: 0;
|
||
}
|
||
}
|
||
|
||
.actice {
|
||
border: 0px;
|
||
background: #387df7;
|
||
color: #fff;
|
||
font-size: 14px;
|
||
border-radius: 4px;
|
||
}
|
||
}
|
||
|
||
/* 分页div */
|
||
.pagination-div {
|
||
text-align: center;
|
||
padding: 10px 0;
|
||
|
||
.pag-text {
|
||
}
|
||
}
|
||
|
||
.order-div {
|
||
padding: 34px 40px 20px 40px;
|
||
background-color: #fff;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
// margin-bottom: ;
|
||
.pub_time {
|
||
display: flex;
|
||
margin-right: 25px;
|
||
align-items: center;
|
||
cursor: pointer;
|
||
|
||
.text {
|
||
font-size: 14px;
|
||
color: #333333;
|
||
}
|
||
|
||
.triangle {
|
||
margin-left: 5px;
|
||
|
||
.up-triangle {
|
||
width: 0;
|
||
height: 0;
|
||
border-left: 4px solid transparent;
|
||
border-right: 4px solid transparent;
|
||
border-bottom: 6px solid #dcdfe6;
|
||
margin-bottom: 2px;
|
||
}
|
||
|
||
.down-triangle {
|
||
width: 0;
|
||
height: 0;
|
||
border-left: 4px solid transparent;
|
||
border-right: 4px solid transparent;
|
||
border-top: 6px solid #dcdfe6;
|
||
}
|
||
}
|
||
}
|
||
|
||
.time {
|
||
position: relative;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
margin-left: 15px;
|
||
width: 116px;
|
||
height: 38px;
|
||
border-radius: 4px;
|
||
|
||
// background: #04243C;
|
||
&:hover {
|
||
// background: #387DF7;
|
||
border: 1px solid #387df7;
|
||
|
||
.text {
|
||
// color: #fff;
|
||
}
|
||
|
||
// .png{
|
||
// background: url('../../../assets/images/case/wighttime.png') no-repeat;
|
||
// }
|
||
}
|
||
|
||
.png {
|
||
width: 18px;
|
||
height: 18px;
|
||
background: url("../../../../public/images/browse.png") no-repeat;
|
||
background-size: 100%;
|
||
margin-right: 9px;
|
||
}
|
||
|
||
.text {
|
||
font-size: 14px;
|
||
color: #333333;
|
||
}
|
||
}
|
||
|
||
.time::before {
|
||
content: "";
|
||
position: absolute;
|
||
top: 0;
|
||
left: 0;
|
||
width: 100%;
|
||
height: 100%;
|
||
background: #04243c;
|
||
opacity: 0.05;
|
||
z-index: 1;
|
||
border-radius: 4px;
|
||
}
|
||
|
||
.time_active {
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
margin-left: 15px;
|
||
width: 116px;
|
||
height: 38px;
|
||
background: #387df7;
|
||
border-radius: 4px;
|
||
|
||
.png {
|
||
width: 20px;
|
||
height: 20px;
|
||
background: url("../../../assets/images/case/wighttime.png") no-repeat;
|
||
background-size: 100%;
|
||
margin-right: 9px;
|
||
}
|
||
|
||
.text {
|
||
font-size: 14px;
|
||
color: #fff;
|
||
}
|
||
}
|
||
|
||
.collect {
|
||
position: relative;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
margin-left: 15px;
|
||
width: 116px;
|
||
height: 38px;
|
||
border-radius: 4px;
|
||
|
||
// background: #04243C;
|
||
&:hover {
|
||
// background: #387DF7;
|
||
border: 1px solid #387df7;
|
||
|
||
.text {
|
||
// color: #fff;
|
||
}
|
||
|
||
// .png{
|
||
// background: url('../../../assets/images/case/wight.png') no-repeat;
|
||
// }
|
||
}
|
||
|
||
.png {
|
||
width: 18px;
|
||
height: 18px;
|
||
background: url("../../../../public/images/collect.png") no-repeat;
|
||
background-size: 100%;
|
||
margin-right: 9px;
|
||
}
|
||
|
||
.text {
|
||
font-size: 14px;
|
||
color: #333333;
|
||
}
|
||
}
|
||
|
||
.collect::before {
|
||
content: "";
|
||
position: absolute;
|
||
top: 0;
|
||
left: 0;
|
||
width: 100%;
|
||
height: 100%;
|
||
background: #04243c;
|
||
opacity: 0.05;
|
||
z-index: 1;
|
||
border-radius: 4px;
|
||
}
|
||
|
||
.collect_active {
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
margin-left: 15px;
|
||
width: 116px;
|
||
height: 38px;
|
||
background: #387df7;
|
||
border-radius: 4px;
|
||
|
||
.png {
|
||
width: 18px;
|
||
height: 18px;
|
||
background: url("../../../assets/images/case/wight.png") no-repeat;
|
||
background-size: 100%;
|
||
margin-right: 9px;
|
||
}
|
||
|
||
.text {
|
||
font-size: 14px;
|
||
color: #fff;
|
||
}
|
||
}
|
||
}
|
||
|
||
.back_num {
|
||
background: #ffffff;
|
||
display: flex;
|
||
justify-content: center;
|
||
padding: 0 40px;
|
||
|
||
.search_div_num {
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
width: 100%;
|
||
height: 38px;
|
||
background: #ddedff;
|
||
border-radius: 4px;
|
||
border: 1px solid #387df7;
|
||
color: #387df7;
|
||
}
|
||
}
|
||
|
||
.data-content {
|
||
background-color: #fff;
|
||
padding: 5px 50px;
|
||
|
||
::v-deep .interact-bar-btns {
|
||
.interact-bar-btn {
|
||
text-align: right;
|
||
min-width: 78px !important;
|
||
margin-right: 0;
|
||
}
|
||
}
|
||
|
||
.case-list:last-child {
|
||
border-bottom: none;
|
||
}
|
||
|
||
.case-list {
|
||
border-bottom: 1px solid rgba(153, 153, 153, 0.2);
|
||
margin-top: 10px;
|
||
margin-bottom: 25px;
|
||
padding-left: 5px;
|
||
padding-right: 5px;
|
||
}
|
||
|
||
.case-image {
|
||
width: 230px;
|
||
height: 170px;
|
||
float: left;
|
||
border: 1px solid #eee;
|
||
}
|
||
|
||
.case-info {
|
||
.case-info-cont {
|
||
.case_text {
|
||
font-size: 14px;
|
||
font-weight: 400;
|
||
color: #666666;
|
||
margin-bottom: 8px;
|
||
}
|
||
|
||
.case-info-title {
|
||
font-size: 15px;
|
||
color: #333;
|
||
font-weight: 600;
|
||
height: 30px;
|
||
|
||
.case-info-date {
|
||
flex: 1;
|
||
text-align: right;
|
||
font-weight: normal;
|
||
|
||
// font-size: 12px;
|
||
// height: 30px;
|
||
// font-weight: 200;
|
||
// color: #8590a6;
|
||
i {
|
||
margin-right: 5px;
|
||
}
|
||
}
|
||
}
|
||
|
||
.case-info-summary {
|
||
margin-top: 16px;
|
||
cursor: pointer;
|
||
margin-bottom: 5px;
|
||
word-break: break-all;
|
||
line-height: 24px;
|
||
font-size: 14px;
|
||
color: #333330;
|
||
font-weight: 400;
|
||
}
|
||
|
||
.case-info-tools {
|
||
height: 30px;
|
||
|
||
.case-info-tools-auth {
|
||
float: left;
|
||
font-size: 13px;
|
||
color: #999999;
|
||
|
||
img {
|
||
margin-right: 10px;
|
||
width: 30px;
|
||
border: 1px solid #eee;
|
||
border-radius: 50%;
|
||
vertical-align: middle;
|
||
}
|
||
}
|
||
|
||
.case-info-tools-btns {
|
||
float: right;
|
||
|
||
.case-info-tools-btn {
|
||
margin: 0 0 0 15px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.search-div {
|
||
background: #fff;
|
||
padding: 30px 40px;
|
||
|
||
.search-keyword {
|
||
line-height: 30px;
|
||
|
||
.tip {
|
||
font-size: 12px;
|
||
color: #999999;
|
||
// margin-bottom: 20px;
|
||
}
|
||
}
|
||
|
||
.search-item {
|
||
cursor: pointer;
|
||
// margin-bottom: 10px;
|
||
// padding: 10px 0;
|
||
}
|
||
|
||
// .search-item:not(:last-child) {
|
||
// // border-bottom: 1px solid #dfdfdf;
|
||
// }
|
||
}
|
||
|
||
.search-div-collapse {
|
||
display: block;
|
||
}
|
||
|
||
.search-div-expand {
|
||
display: none;
|
||
}
|
||
|
||
.search-div-more {
|
||
text-align: center;
|
||
}
|
||
}
|
||
</style>
|