# Conflicts:
#	src/views/portal/case/Index.vue
This commit is contained in:
lmj
2022-06-08 14:05:44 +08:00
2 changed files with 282 additions and 271 deletions

View File

@@ -109,7 +109,7 @@
<!-- 推荐案例2版 -->
<div class="modules">
<div class="modules-title">
<span class="modules-text">推荐案例</span>
<span class="quyer-tag">
<a :class="caseList.orderType==2?'current':''" @click="changeCaseOrder(2)">最热</a>
@@ -122,9 +122,9 @@
<div class="casetwo" :body-style="{ padding: '0px' }">
<!-- <div class="case-top"></div> -->
<div class="case-conent">
<div class="case-time">
<!-- <div class="case-time">
{{ca.sysCreateTime.substring(0,10)}}
</div>
</div> -->
<a :href="'case/detail?id='+ca.id" >
<span class="case-title one-line-ellipsis">
{{ca.title}}
@@ -135,17 +135,13 @@
</a>
<div class="case-inter">
<interactBar style="width:180px" :type="3" :readonly="true" :data="ca" :shares="false" :views="false"></interactBar>
</div>
<div style="height:40px">
<authorInfo :avatar="ca.authorInfo.avatar" :name="ca.authorInfo.name" :info="ca.authorInfo.orgInfo" :sex="ca.authorInfo.sex"></authorInfo></div>
</div>
<div style="height:40px;margin-top:10px">
<authorInfo :avatar="ca.authorInfo.avatar" :name="ca.authorInfo.name" :info="ca.authorInfo.orgInfo" :sex="ca.authorInfo.sex"></authorInfo></div>
</div>
</div>
</div>
</div>
</div>
<!-- 推荐案例 -->
<!-- <div class="modules">
@@ -194,7 +190,7 @@
</el-col>
</el-row>
</div> -->
<!-- 推荐文章 -->
<div class="modules">
<!--内容块-->
@@ -472,20 +468,44 @@ export default {
let userIds = [];
res.result.forEach(item => {
item.authorInfo = { aid: '', name: '', orgInfo: '', avatar: '', code: '',sex:null };
if (item.authorId && item.authorId != '') {
userIds.push(item.authorId);
}
});
this.caseList.list = res.result;
this.loadAuthorInfo(res.result, userIds);
this.loadCaseAuthorInfo(res.result, userIds);
}
this.caseList.list = res.result;
// this.caseList.list = res.result;
} else {
console.log('加载案例错误:' + res.error);
}
});
},
loadCaseAuthorInfo(list, ids) {
//加载作者信息,头像,机构信息
if (ids.length == 0) {
return;
}
const noReapetIds = [...new Set(ids)];
apiUser.getByIds(ids).then(res => {
if (res.status == 200) {
list.forEach((item, index) => {
res.result.some(author => {
if (author.aid == item.authorId) {
item.authorInfo = author;
return true;
} else {
return false;
}
});
});
} else {
console.log('加载用户信息失败:' + res.error);
//this.$message.error(res.message);
}
});
},
getArticleData() {
let $this = this;
this.articleList.list = [];
@@ -678,7 +698,7 @@ export default {
width: 100%;
border-bottom: 1px solid #f3f3f3;
}
}
}
// .qa-dai{

View File

@@ -93,29 +93,19 @@
</div>
</router-link>
</div>
<div style="height:35px">
<author :avatar="item.authorInfo.avatar" :name="item.authorInfo.name" :info="item.authorInfo.orgInfo" :sex="item.authorInfo.sex"></author>
</div>
<!-- <router-link :to="'/case/detail?id='+item.id"> -->
<!-- class="case-info-summary" -->
<div style="height:35px">
<author :avatar="item.authorInfo.avatar" :name="item.authorInfo.name" :info="item.authorInfo.orgInfo" :sex="item.authorInfo.sex"></author>
</div>
<div class="case-info-summary">
<router-link :to="'/case/detail?id='+item.id">
<!-- {{item.summary}} -->
{{displayAll(item)}}
</router-link>
<span style="color:#588afc" v-if="item.summary.length>190" @click="changeIsAll(item)">
{{item.isAll?'收起':'展开'}}
</span>
</div>
<!-- </router-link> -->
<!-- <div class="button-wrap" v-if="needShowExpande">
<div class="exp-but" @click="expandeClick" v-if="!expande">展开
</div>
<div class="exp-but" @click="expandeClick" v-else>收起</div>
</div> -->
<div style="display: flex;justify-content: space-between;">
<div>
<interactBar :type="0" :shares="false" :data="item" :readonly="false"></interactBar> </div>
</div>
@@ -238,24 +228,31 @@
</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 { 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 apiDict from "@/api/modules/dict.js";
export default {
name: 'index',
components: { portalHeader, portalFooter, portalFloatTools, interactBar,timeShow ,author},
name: "index",
components: {
portalHeader,
portalFooter,
portalFloatTools,
interactBar,
timeShow,
author
},
computed: {
...mapGetters(['userInfo','portalCase']),
word: function() {
...mapGetters(["userInfo", "portalCase"]),
word: function() {
if (this.showAll == false) {
//对文字进行处理
return "展开";
@@ -265,43 +262,43 @@ export default {
},
isMore() {
let isOk = true;
if(this.caseList.list.length === this.caseList.count) {
isOk = false;
}
return isOk;
if (this.caseList.list.length === this.caseList.count) {
isOk = false;
}
return isOk;
}
},
data() {
return {
moreState:1,// 1 加载更多 2 加载中 3无数据
isSeach:false,
searchwd:true,
showAll:true,//是否展开全部
searchRecords:[],
caseList:{
count:0,
list:[]
moreState: 1, // 1 加载更多 2 加载中 3无数据
isSeach: false,
searchwd: true,
showAll: true, //是否展开全部
searchRecords: [],
caseList: {
count: 0,
list: []
},
ankingList:[],
Popularity:[],
Positive:[],
domain:[],
Profess:[],
ankingList: [],
Popularity: [],
Positive: [],
domain: [],
Profess: [],
optionsList: [], //分类数据
protocolDialogVisible: false,
protocolConfirmButton:true,
queryCondition:{
pageIndex:1,
pageSize:10,
isTop:true,
orderField:'comments',
protocolConfirmButton: true,
queryCondition: {
pageIndex: 1,
pageSize: 10,
isTop: true,
orderField: "comments",
// breCommend:null,
keyWord:'',
majorType:null,//专业分类
orgDomain:null,// 组织领域
keyWord: "",
majorType: null, //专业分类
orgDomain: null, // 组织领域
orderAsc: false
},
keyWord:'',
keyWord: "",
anking: 2,
queryExpand: true, // true更多false收起
category: 0,
@@ -316,12 +313,12 @@ export default {
this.$nextTick(function() {
this.closeSearch();
});
if(!this.portalCase.readProtocol){
if (!this.portalCase.readProtocol) {
this.protocolDialogVisible = true;
}
this.keyWord = this.$route.query.keyword;
if(this.keyWord != '') {
this.isSeach = true;
if (this.keyWord != "") {
this.isSeach = true;
}
this.getAnkingData();
this.getPopularity();
@@ -331,13 +328,10 @@ export default {
this.getdomain();
// this.getCaseData();
this.search();
window.addEventListener(
"scroll",
this.handleScroll
);
window.addEventListener("scroll", this.handleScroll);
},
watch:{
watch: {
// queryCondition:{
// handler(newValue,oldValue){
// this.getCaseData()
@@ -346,82 +340,80 @@ export default {
// immediate:true
// }
},
beforeDestroy(){
window.removeEventListener("scroll",this.handleScroll);
beforeDestroy() {
window.removeEventListener("scroll", this.handleScroll);
},
methods: {
//展示全部
displayAll(item) {
if(!item.isAll && item.summary && item.summary.length > 190) {
return item.summary.slice(0, 190) + "...";
}
return item.summary;
},
changeIsAll(item) {
item.isAll=!item.isAll;
},
//展示全部
displayAll(item) {
if (!item.isAll && item.summary && item.summary.length > 190) {
return item.summary.slice(0, 190) + "...";
}
return item.summary;
},
changeIsAll(item) {
item.isAll = !item.isAll;
},
closeSearch() {
this.showAll = !this.showAll;
var searchBoxHeght = document.getElementById("searchBox");
var searchBoxWidth = document.getElementById("searchBox");
if(searchBoxWidth.clientWidth > 950){
this.searchwd = false;
if (searchBoxWidth.clientWidth > 950) {
this.searchwd = false;
}
if (this.showAll == false) {
searchBoxHeght.style.height = 70 + "px";
} else {
searchBoxHeght.style.height = "auto";
}
},
getAnkingData(){
apiCase.usernameList(5).then(res=>{
if(res.status==200){
this.ankingList=res.result
// console.log(res)
getAnkingData() {
apiCase.usernameList(5).then(res => {
if (res.status == 200) {
this.ankingList = res.result;
// console.log(res)
}
})
});
},
getPopularity(){
apiCase.queryPraises(5).then(res=>{
if(res.status==200){
this.Popularity=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)
getPositive() {
apiCase.queryComments(5).then(res => {
if (res.status == 200) {
this.Positive = res.result;
console.log(res);
}
})
});
},
getdomain(){
let key ='org_domain'
apiDict.items(key).then(res =>{
if(res.status==200){
this.domain = res.result
getdomain() {
let key = "org_domain";
apiDict.items(key).then(res => {
if (res.status == 200) {
this.domain = res.result;
}
})
});
},
getProfess(){
let key ='major_type'
apiDict.items(key).then(res =>{
if(res.status==200){
this.Profess = res.result
getProfess() {
let key = "major_type";
apiDict.items(key).then(res => {
if (res.status == 200) {
this.Profess = res.result;
}
})
});
},
emitInput(val) {
this.keyWord=val;
this.isSeach =true;
this.queryCondition.pageIndex = 1
this.search()
this.keyWord = val;
this.isSeach = true;
this.queryCondition.pageIndex = 1;
this.search();
},
searchData(num) {
this.queryCondition.pageIndex = 1;
@@ -429,92 +421,102 @@ export default {
this.getCaseData();
},
handleScroll() {
let innerHeight = document.querySelector('#case-list-content').clientHeight
let outerHeight = document.documentElement.clientHeight
let scrollTop = document.documentElement.scrollTop
if ((outerHeight + scrollTop + 350) >= innerHeight) {
if(this.moreState == 1 && this.queryCondition.pageIndex < 4) {
this.loadMore();
}
}
if(scrollTop > 630) {
document.querySelector('#fixd-box').style.cssText = "position: fixed;top: -550px;width:245.5px";
} else {
document.querySelector('#fixd-box').style.cssText = "position: static";
let innerHeight = document.querySelector("#case-list-content")
.clientHeight;
let outerHeight = document.documentElement.clientHeight;
let scrollTop = document.documentElement.scrollTop;
if (outerHeight + scrollTop + 350 >= innerHeight) {
if (this.moreState == 1 && this.queryCondition.pageIndex < 4) {
this.loadMore();
}
}
if (scrollTop > 630) {
document.querySelector("#fixd-box").style.cssText =
"position: fixed;top: -550px;width:245.5px";
} else {
document.querySelector("#fixd-box").style.cssText = "position: static";
}
},
useHotword(item){
this.keyWord=item.keyword;
useHotword(item) {
this.keyWord = item.keyword;
this.search();
},
searchterm(){
apiSearchterm.list(5,3).then(res => {
if (res.status === 200) {
this.searchRecords = res.result;
}
});
searchterm() {
apiSearchterm.list(5, 3).then(res => {
if (res.status === 200) {
this.searchRecords = res.result;
}
});
},
loadMore() {
this.queryCondition.pageIndex += 1;
this.getCaseData();
},
protocolCheck(obj){
protocolCheck(obj) {
this.protocolConfirmButton = !obj;
},
protocolConfirm(){
protocolConfirm() {
this.protocolDialogVisible = false;
this.$store.dispatch('portal/SetReadProtocol', true);
this.$store.dispatch("portal/SetReadProtocol", true);
},
handleSizeChange(item){
this.queryCondition.pageSize=item;
handleSizeChange(item) {
this.queryCondition.pageSize = item;
},
handleCurrentChange(item){
this.queryCondition.pageIndex=item;
handleCurrentChange(item) {
this.queryCondition.pageIndex = item;
},
search(){
apiSearchterm.save({keyword:this.keyWord,type:3});
if(!this.isFind){
search() {
apiSearchterm.save({ keyword: this.keyWord, type: 3 });
if (!this.isFind) {
this.isFind = true;
}
this.queryCondition.pageIndex = 1;
if(this.keyWord!=this.queryCondition.keyWord){
this.queryCondition.keyWord=this.keyWord
if (this.keyWord != this.queryCondition.keyWord) {
this.queryCondition.keyWord = this.keyWord;
}
this.getCaseData();
},
async getCaseData(){
async getCaseData() {
this.getTags();
if(this.queryCondition.pageIndex == 1) {
this.caseList.list =[];
if (this.queryCondition.pageIndex == 1) {
this.caseList.list = [];
}
this.moreState = 2;
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.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;
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.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.moreState = 3;
this.$message.error(res.message);
}
}else{
this.$message.error(res.message);
}
}).catch(err=>{
console.log(err)
})
})
.catch(err => {
console.log(err);
});
},
getTags() {
getTags() {
this.searchTags = [];
let caseData = deepClone(this.queryCondition);
for (let i in caseData) {
@@ -528,21 +530,19 @@ export default {
caseData[i] !== null &&
caseData[i] !== undefined
) {
if(caseData[i] !== '0') {
this.searchTags.push(
caseData[i]
);
if (caseData[i] !== "0") {
this.searchTags.push(caseData[i]);
}
}
}
},
tagsClose(tag, index) {
tagsClose(tag, index) {
for (let i in this.queryCondition) {
if (tag === this.queryCondition[i]) {
if(i == 'majorType'){
if (i == "majorType") {
this.queryCondition.majorType = null;
}
if(i == 'orgDomain'){
if (i == "orgDomain") {
this.queryCondition.orgDomain = null;
}
this.queryCondition[i] = "";
@@ -552,140 +552,135 @@ export default {
}
}
},
getCaseUserData(caseList){
let ids=caseList.map((item,index)=>{
return item.sysCreateAid
})
const noReapetIds=[...new Set(ids)]
apiUser.getByIds(ids).then(res=>{
if(res.status==200){
caseList.forEach((item,index)=>{
res.result.some(author=>{
if(author.aid==item.sysCreateAid){
item.authorInfo=author;
getCaseUserData(caseList) {
let ids = caseList.map((item, index) => {
return item.authorId;
});
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;
return true;
}else{
} else {
return false;
}
})
});
});
}else{
} else {
this.$message.error(res.message);
}
});
},
getAnkingData(){
apiCase.usernameList(10).then(res=>{
if(res.status==200){
this.ankingList=res.result
getAnkingData() {
apiCase.usernameList(10).then(res => {
if (res.status == 200) {
this.ankingList = res.result;
}
})
});
},
getPopularity(){
apiCase.queryPraises(5).then(res=>{
if(res.status==200){
this.Popularity=res.result
getPopularity() {
apiCase.queryPraises(5).then(res => {
if (res.status == 200) {
this.Popularity = res.result;
}
})
});
},
getPositive(){
apiCase.queryComments(5).then(res=>{
if(res.status==200){
this.Positive=res.result
getPositive() {
apiCase.queryComments(5).then(res => {
if (res.status == 200) {
this.Positive = res.result;
}
})
});
},
jumpRouter(item){
this.$router.push(`/case/detail?id=${item.id}`);
jumpRouter(item) {
this.$router.push(`/case/detail?id=${item.id}`);
}
}
};
</script>
<style scoped lang="scss">
.searBox{
.searBox {
text-align: center;
margin: 0px auto 0 auto;
margin: 0px auto 0 auto;
}
#searchBox {
overflow: hidden;
}
.ranking-title {
line-height: 34px;
line-height: 34px;
font-size: 15px;
color: #333333;
.center-titlt {
font-size: 15px;
color: #333333;
.center-titlt{
font-size: 15px;
color: #333333;
}
.center{
text-align: right;
}
img{
margin-top: 5px;
}
}
::v-deep .title-line-ellipsis{
.center {
text-align: right;
}
img {
margin-top: 5px;
}
}
::v-deep .title-line-ellipsis {
// width: 100%;
display: -webkit-box;
overflow: hidden;
text-overflow:ellipsis;
display: -webkit-box;
overflow: hidden;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
box-sizing: border-box;
word-break:break-all;
word-break: break-all;
}
::v-deep .el-card__body{
::v-deep .el-card__body {
padding: 0;
}
::v-deep .bacolor:nth-child(odd){
::v-deep .bacolor:nth-child(odd) {
background-color: #f6f6f6;
padding: 0 5px;
}
::v-deep .bacolor:nth-child(even){
background-color: #fff;
::v-deep .bacolor:nth-child(even) {
background-color: #fff;
padding: 0 5px;
}
::v-deep .el-card{
::v-deep .el-card {
border: none;
border-radius: 0px;
border: 1px solid #EBEEF5;
border: 1px solid #ebeef5;
}
::v-deep .el-radio-button__inner, .el-radio-group {
vertical-align: top;
::v-deep .el-radio-button__inner,
.el-radio-group {
vertical-align: top;
}
::v-deep .el-radio-button__inner{
::v-deep .el-radio-button__inner {
background: none;
}
::v-deep .el-radio-button:first-child .el-radio-button__inner {
border-left: none;
border-left: none;
// border-radius: 4px 0 0 4px;
//box-shadow: none!important;
// border-radius: 4px 0 0 4px;
//box-shadow: none!important;
}
.item-title{
.item-title {
margin: 10px 10px 10px 0;
//font-size: 14px;
font-weight: 600;
color: #333333;
// line-height: 20px;
}
.item-line{
.item-line {
padding-left: 2px;
height: 20px;
background: #ddd;
}
.portal-content{
.portal-content {
display: flex;
justify-content: space-between;
// .item-title{
@@ -748,8 +743,7 @@ export default {
.pagination-div {
text-align: center;
padding: 10px 0;
.pag-text{
.pag-text {
}
}
.order-div {
@@ -856,20 +850,17 @@ export default {
}
}
.ranking-card {
.center{
text-align: center;
}
.center {
text-align: center;
}
}
.right-box {
line-height: 25px;
.ranking-title {
}
.aligh-title{
.aligh-title {
font-size: 14px;
color: #333333;
}