You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
239 lines
9.7 KiB
239 lines
9.7 KiB
<template>
|
|
<layout group="生涯资源" title="生涯资源" @search="search">
|
|
<div class="c-page">
|
|
<div class="c-row c-flex c-list-search" style="box-sizing: border-box; justify-content: flex-start; color: #666; ">
|
|
<div v-for="(v,i) in tab.items" :class="i===tab.current?'c-active':''" @click="change(i,v)">{{v.DETAIL}}</div>
|
|
</div>
|
|
<div class="c-row c-flex" style="height: 40vh; padding: 0 5vh; ">
|
|
<div v-if="model.table_List&&model.table_List.length===0">
|
|
<img src="images/empty-data.png" style="width: 17vh;margin-top: 5vh;margin-bottom: 2vh"/>
|
|
<div style="margin-bottom: 5vh;color: #a2a2a2;font-size: 2vh">暂无数据</div>
|
|
</div>
|
|
<div v-for="(item,index) in getList()" @click="zoom(item)" style="width: 20%;height:20vh;box-sizing:border-box;overflow:hidden; text-align: center; cursor: pointer;">
|
|
<div class="c-item-cell" :style="'margin:0 auto;background-image:url('+getThumb(item.address)+');'">
|
|
<div v-if="false&&index<3&&model.pageNumber===1" style="position: absolute; top: 1vh; right: 0; pointer-events: none; background-color: #FF6C00;font-size:1.4vh;line-height:2vh;color:#fff;border-top-left-radius:1vh;border-bottom-left-radius:1vh;padding-left:.7vh;">人气热播</div>
|
|
<i v-if="false" :class="getIcon(item.address)" style="font-size:2vh;color:#eee;position:absolute;top:1vh;left:1vh;pointer-events:none;"></i>
|
|
</div>
|
|
<div style="display: flex; width: 80%; justify-content:space-between;line-height:4vh;margin:0 auto;height:4vh;overflow:hidden;">
|
|
<div style="white-space: nowrap; text-overflow: ellipsis; width: 70%; overflow: hidden; ">{{item.title}}</div>
|
|
<div style="color: #8D8E90;font-size:1vh;"><img src="./../../gxytj/xztszzy/images/play.png" style="width: 1.8vh;vertical-align: middle;margin-right: .5vh" />{{item.click_num!==''?item.click_num:0}}</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="c-row" style=" height:13vh;position:relative;padding:0 5vh;">
|
|
<pagination v-model:index="model.pageNumber" v-model:size="model.pageSize" :total="model.totalRow" :callback="load" />
|
|
</div>
|
|
</div>
|
|
<div v-show="layout.showOverlay" :close-on-click-overlay="false" style="position:fixed;left:0;top:0;width:100%;height:100%;z-index:2000;background:#000;">
|
|
<template v-if="src">
|
|
<video controls muted autoplay playsinline controlsList="nodownload" disablepictureinpicture style="width: 100%; height: 100%;" :src="src" v-if="isVideo(src)"></video>
|
|
<iframe v-else-if="isOffice(src)" :src="'lib/pdf.js/web/viewer.html?file='+src+'.pdf'" frameborder="0" style="width:100%;height:100%;"></iframe>
|
|
<iframe v-else-if="isPdf(src)" :src="'lib/pdf.js/web/viewer.html?file='+src" frameborder="0" style="width:100%;height:100%;"></iframe>
|
|
<div class="c-100x100" :style="'background-image:url('+src+'.webp);'" v-else></div>
|
|
<!--<i class="fas fa-times c-close" v-on:click="close()"></i>-->
|
|
<img v-on:click="close()"
|
|
style="color:#fff;font-size:6vh;position:absolute;top:5vh;right:2vh;width: 3rem;cursor:pointer"
|
|
src="./../../gxytj/xztszzy/images/gaoxiao/close.png"/>
|
|
</template>
|
|
</div>
|
|
</layout>
|
|
</template>
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
url: '/Site/SearchCareer',
|
|
model: {
|
|
pageNumber: 1,
|
|
pageSize: 10,
|
|
table_List: []
|
|
},
|
|
tab: {
|
|
items: [],
|
|
current: 0
|
|
},
|
|
layout: store.state,
|
|
src: null,
|
|
resource_type:'',
|
|
bureau_id:$.cookie('background_bureau_id'),
|
|
};
|
|
},
|
|
mounted() {
|
|
store.state.query = this.$route.query.query;
|
|
this.getDicItemByKind();
|
|
|
|
},
|
|
methods: {
|
|
getDicItemByKind(){
|
|
var uri = new URI();
|
|
uri.setQuery({"kind":'ZYGH_OUTLINE'});
|
|
var url = '/dsideal_yy/dic/getDicItemByKind';
|
|
var parent = this;
|
|
$.post(url, uri.query(), function (response) {
|
|
if (JSON.parse(response).success) {
|
|
let arr=[{REMARK:'全部',DETAIL:'全部',CODE:''}];
|
|
parent.tab.items=arr.concat(JSON.parse(response).table_List);
|
|
parent.resource_type=parent.tab.items[0].CODE;
|
|
parent.load();
|
|
}else {
|
|
parent.tab.items=[{REMARK:'全部',DETAIL:'全部',CODE:''}];
|
|
}
|
|
});
|
|
},
|
|
|
|
load() {
|
|
// this.model.list = [];
|
|
// var uri = new URI().setQuery("pageIndex", this.model.pageIndex).setQuery("pageSize", this.model.pageSize);
|
|
// if (store.state.query) {
|
|
// uri.setQuery("query", store.state.query);
|
|
// }
|
|
// if (this.tab.current !== 0) {
|
|
// uri.setQuery("type", this.tab.items[this.tab.current]);
|
|
// }
|
|
// var parent = this;
|
|
// $.post(this.url, uri.query(), function (response) {
|
|
// parent.model = response;
|
|
// });
|
|
|
|
var uri = new URI();
|
|
uri.setQuery({
|
|
"resource_type":this.resource_type,
|
|
"bureau_id":this.bureau_id,
|
|
"page_number": this.model.pageNumber,
|
|
"page_size":this.model.pageSize,
|
|
|
|
});
|
|
if (store.state.query) {
|
|
uri.setQuery("resource_title", store.state.query);
|
|
}
|
|
var url = '/dsideal_yy/zygh/resource/getZyghYtjResourceList';
|
|
var parent = this;
|
|
|
|
|
|
|
|
$.post(url, uri.query(), function (response) {
|
|
if (response.success) {
|
|
parent.model = response
|
|
}
|
|
});
|
|
|
|
},
|
|
getList() {
|
|
return Enumerable.from(this.model.table_List).orderByDescending(o => o.clicks).toArray();
|
|
},
|
|
change(i,v) {
|
|
this.tab.current = i;
|
|
this.resource_type = v.CODE;
|
|
this.model.pageNumber = 1;
|
|
this.load();
|
|
},
|
|
zoom(item) {
|
|
var uri = new URI();
|
|
uri.setQuery({
|
|
"resource_id":item.id,
|
|
"bureau_id":this.bureau_id,
|
|
|
|
});
|
|
var url = '/dsideal_yy/zygh/resource/setZyghYtjResourceCount';
|
|
var parent = this;
|
|
$.post(url, uri.query(), function (response) {
|
|
if (response.success) {
|
|
|
|
}
|
|
});
|
|
|
|
var url = '/dsideal_yy/gxytj/' + item.address;
|
|
this.src = url;
|
|
this.layout.showOverlay = true;
|
|
// var uri = new URI().setQuery('file', item.address);
|
|
// $.post('/Site/CareerClick',uri.query(), function (response) {
|
|
// item.clicks += 1;
|
|
// });
|
|
},
|
|
|
|
|
|
close(e) {
|
|
this.layout.showOverlay = false;
|
|
this.src = null;
|
|
this.load()
|
|
},
|
|
isVideo(src) {
|
|
return src.endsWith('.mp4') || src.endsWith('.webm');
|
|
},
|
|
isOffice(src) {
|
|
return src.endsWith('.docx') || src.endsWith('.xlsx') || src.endsWith('.pptx');
|
|
},
|
|
isPdf(src) {
|
|
return src.endsWith('.pdf');
|
|
},
|
|
getThumb(src) {
|
|
return '/dsideal_yy/gxytj/' + src + '.thumb.webp';
|
|
},
|
|
getIcon(src) {
|
|
if (src.endsWith('.mp4') || src.endsWith('.webm')) {
|
|
return 'far fa-file-video';
|
|
}
|
|
else if (src.endsWith('.docx')) {
|
|
return 'far fa-file-word';
|
|
}
|
|
else if (src.endsWith('.xlsx')) {
|
|
return 'far fa-file-excel';
|
|
}
|
|
else if (src.endsWith('.pptx')) {
|
|
return 'far fa-file-powerpoint';
|
|
}
|
|
else {
|
|
return 'far fa-file-image';
|
|
}
|
|
},
|
|
search: function () {
|
|
this.model.pageNumber = 1;
|
|
this.load();
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
<style>
|
|
.c-list-search {
|
|
height: 13vh;
|
|
padding: 3vh 5vh;
|
|
}
|
|
|
|
.c-list-search > div {
|
|
display: inline-block;
|
|
line-height: 5vh;
|
|
padding: 0 2vh;
|
|
cursor: pointer;
|
|
font-weight: bolder;
|
|
}
|
|
|
|
.c-active {
|
|
background-color: #27CEC4;
|
|
color: #fff;
|
|
}
|
|
|
|
.c-item-cell {
|
|
width: 80%;
|
|
height: 16vh;
|
|
position: relative;
|
|
overflow: hidden;
|
|
text-align: center;
|
|
background-position: center center;
|
|
background-size: contain;
|
|
background-repeat: no-repeat;
|
|
box-sizing:border-box;
|
|
border:1px solid #808080;
|
|
}
|
|
|
|
.c-close {
|
|
color: #fff;
|
|
font-size: 2em;
|
|
line-height: 2em;
|
|
border-radius: 1em;
|
|
width: 2em;
|
|
position: absolute;
|
|
top: .5em;
|
|
right: .5em;
|
|
background: #666;
|
|
}
|
|
</style> |