Compare commits
6 Commits
| Author | SHA1 | Date |
|---|---|---|
 jscyl13849007907
|
33609a6613 | 1 year ago |
|
jscyl13849007907
|
21834f5928 | 1 year ago |
|
jscyl13849007907
|
022947ac01 | 1 year ago |
|
jscyl13849007907
|
f4ce6bb646 | 1 year ago |
|
jscyl13849007907
|
dad0a84f3b | 1 year ago |
|
jscyl13849007907
|
940a52caa1 | 1 year ago |
@ -0,0 +1,121 @@
|
|||||||
|
<template>
|
||||||
|
<div class="list-panel-active">
|
||||||
|
<div class="m-title g_flex_row_between">
|
||||||
|
<div class="g_flex_1" style="opacity: 0.5;">
|
||||||
|
活动提醒
|
||||||
|
</div>
|
||||||
|
<div class="g_flex_none g_flex_column_center" style="cursor: pointer;">
|
||||||
|
<div class="g_flex_row_end" >
|
||||||
|
<div style="color: #246394;font-size: 14px;opacity: 1;" class="g_flex_column_center">
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-plus "><path d="M12 5l0 14"></path><path d="M5 12l14 0"></path></svg>
|
||||||
|
</div>
|
||||||
|
<div style="color: #246394;font-size: 14px;opacity: 1;margin-top: -2px;margin-left: 2px;font-weight: 600;">
|
||||||
|
提交活动
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="m-list">
|
||||||
|
<div v-for="(item,index) in list" :key="index"
|
||||||
|
class="item g_flex_column_center"
|
||||||
|
>
|
||||||
|
<div class="g_flex_none g_flex_row_start">
|
||||||
|
<div class="g_flex_none title">
|
||||||
|
{{ item.date }}
|
||||||
|
</div>
|
||||||
|
<div class="g_flex_1 g_ell_1 g_ml_12 g_mr_12 title value">
|
||||||
|
{{ item.title }}
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="#7f7f7f" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-bell-plus " data-sentry-element="IconBellPlus" data-sentry-source-file="index.tsx"><path d="M12.5 17h-8.5a4 4 0 0 0 2 -3v-3a7 7 0 0 1 4 -6a2 2 0 1 1 4 0a7 7 0 0 1 4 6v1"></path><path d="M9 17v1a3 3 0 0 0 3.51 2.957"></path><path d="M16 19h6"></path><path d="M19 16v6"></path></svg>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="m-opa g_flex_row_between g_mt_12" style="height: 20px;overflow: hidden;">
|
||||||
|
<div style="color: #868e96;cursor: pointer;" class="g_fs_14 g_fw_600">
|
||||||
|
查看全部
|
||||||
|
</div>
|
||||||
|
<div class="g_flex_row_end" style="cursor: pointer;">
|
||||||
|
<div style="color: #868e96;">
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-calendar-plus "><path d="M12.5 21h-6.5a2 2 0 0 1 -2 -2v-12a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v5"></path><path d="M16 3v4"></path><path d="M8 3v4"></path><path d="M4 11h16"></path><path d="M16 19h6"></path><path d="M19 16v6"></path></svg>
|
||||||
|
</div>
|
||||||
|
<div style="color: #868e96;margin-top: -2px;" class="g_fs_14 g_fw_600 g_flex_column_center g_ml_2">
|
||||||
|
添加到日历
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'Active',
|
||||||
|
props: {},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
list:[
|
||||||
|
{
|
||||||
|
title:'支持疾病、药品、医院、医生等常用医疗场景的搜索查询，致力于提供简洁可信的医疗信息内容',
|
||||||
|
date:'02-14'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title:'支持疾病、药品、医院、医生等常用医疗场景的搜索查询，致力于提供简洁可信的医疗信息内容',
|
||||||
|
date:'02-17'
|
||||||
|
},
|
||||||
|
]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
mounted() {},
|
||||||
|
methods: {}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.list-panel-active {
|
||||||
|
background-color: #fff;
|
||||||
|
border-radius: 8px;
|
||||||
|
box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 0px;
|
||||||
|
padding: 16px;
|
||||||
|
margin-top: 16px;
|
||||||
|
margin-bottom: 16px;
|
||||||
|
.m-title{
|
||||||
|
color: rgb(0,0,0);
|
||||||
|
line-height: 1.5;
|
||||||
|
font-size: 17px;
|
||||||
|
margin-bottom: 12px;
|
||||||
|
}
|
||||||
|
.m-list{
|
||||||
|
.item{
|
||||||
|
margin-bottom: 12px;
|
||||||
|
border-bottom: 1px solid #dcdcdc;
|
||||||
|
padding-top: 10px;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
.title{
|
||||||
|
color: rgb(25, 25, 25);
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 1.57;
|
||||||
|
}
|
||||||
|
.img{
|
||||||
|
width: 32px;
|
||||||
|
height: auto;
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
&:hover{
|
||||||
|
.value{
|
||||||
|
cursor: pointer;
|
||||||
|
text-decoration: underline;
|
||||||
|
color: rgba(36,99,148,.9);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&:first-child{
|
||||||
|
border-top: 1px solid #dcdcdc;
|
||||||
|
}
|
||||||
|
&:last-child{
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,133 @@
|
|||||||
|
<template>
|
||||||
|
<div class="list-panel-hot">
|
||||||
|
<div class="m-title">
|
||||||
|
24小时热榜
|
||||||
|
</div>
|
||||||
|
<div class="m-list" v-if="list.length > 0">
|
||||||
|
<div v-for="(item,index) in list" :key="index"
|
||||||
|
class="item g_flex_row_start"
|
||||||
|
>
|
||||||
|
<div class="g_flex_none g_flex_column_center key">
|
||||||
|
{{ index + 1 }}
|
||||||
|
</div>
|
||||||
|
<div class="g_flex_1 g_ell_1 value">
|
||||||
|
{{ item.title }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="m-loading g_flex_c" v-if="list.length == 0" style="min-height: 322px;">
|
||||||
|
<a-spin />
|
||||||
|
</div>
|
||||||
|
<div class="m-more g_flex_column_center">
|
||||||
|
<div class="g_flex_row_center">
|
||||||
|
<div class="text">
|
||||||
|
更多
|
||||||
|
</div>
|
||||||
|
<div class="icon">
|
||||||
|
<a-icon type="right" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {
|
||||||
|
JobListApi,
|
||||||
|
} from "../../../../api/job";
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: 'Hot',
|
||||||
|
props: {},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
list:[]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
async getList(){
|
||||||
|
let that = this;
|
||||||
|
const { data } = await JobListApi({
|
||||||
|
pageNum: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
jobCategory: 608,
|
||||||
|
sortTag:3
|
||||||
|
});
|
||||||
|
let resData = data.data;
|
||||||
|
if(resData.recordCount > 0){
|
||||||
|
that.list = resData.recordList.map(item => {
|
||||||
|
return {
|
||||||
|
title:item.jobName
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}else{
|
||||||
|
that.list = [];
|
||||||
|
}
|
||||||
|
console.log('24小时热榜',data);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.list-panel-hot{
|
||||||
|
background-color: #fff;
|
||||||
|
border-radius: 8px;
|
||||||
|
box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 0px;
|
||||||
|
padding: 16px;
|
||||||
|
.m-title{
|
||||||
|
color: rgb(0,0,0);
|
||||||
|
opacity: 0.5;
|
||||||
|
line-height: 1.5;
|
||||||
|
font-size: 17px;
|
||||||
|
margin-bottom: 12px;
|
||||||
|
}
|
||||||
|
.m-list{
|
||||||
|
.item{
|
||||||
|
margin-bottom: 16px;
|
||||||
|
.key{
|
||||||
|
width: 20px;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #afafaf;
|
||||||
|
}
|
||||||
|
.value{
|
||||||
|
font-size: 14px;
|
||||||
|
color: rgba(0,0,0,.9);
|
||||||
|
}
|
||||||
|
&:nth-child(1),&:nth-child(2),&:nth-child(3){
|
||||||
|
.key{
|
||||||
|
color: #e02020;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&:hover{
|
||||||
|
.value{
|
||||||
|
cursor: pointer;
|
||||||
|
text-decoration: underline;
|
||||||
|
color: rgba(36,99,148,.9);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.m-more{
|
||||||
|
border-radius: 3px;
|
||||||
|
border: .5px solid #d8d8d8;
|
||||||
|
background-color: #fff;
|
||||||
|
font-size: 14px;
|
||||||
|
width: 100%;
|
||||||
|
height: 40px;
|
||||||
|
cursor: pointer;
|
||||||
|
.icon{
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
&:hover{
|
||||||
|
filter: brightness(.98);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,120 @@
|
|||||||
|
<template>
|
||||||
|
<div class="list-panel-recom">
|
||||||
|
<div class="m-title g_flex_row_between">
|
||||||
|
<div class="g_flex_1" style="opacity: 0.5;">
|
||||||
|
产品推荐
|
||||||
|
</div>
|
||||||
|
<div class="g_flex_none g_flex_column_center" style="cursor: pointer;">
|
||||||
|
<div class="g_flex_row_end" >
|
||||||
|
<div style="color: #246394;font-size: 14px;opacity: 1;" class="g_flex_column_center">
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-plus "><path d="M12 5l0 14"></path><path d="M5 12l14 0"></path></svg>
|
||||||
|
</div>
|
||||||
|
<div style="color: #246394;font-size: 14px;opacity: 1;margin-top: -2px;margin-left: 2px;font-weight: 600;">
|
||||||
|
提交产品
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="m-list">
|
||||||
|
<div v-for="(item,index) in list" :key="index"
|
||||||
|
class="item"
|
||||||
|
>
|
||||||
|
<div class="g_flex_none g_flex_row_start">
|
||||||
|
<div class="g_flex_none">
|
||||||
|
<img :src="item.img" class="img" alt="">
|
||||||
|
</div>
|
||||||
|
<div class="g_flex_1 g_flex_column_center">
|
||||||
|
<div class="g_ell_1 title">
|
||||||
|
{{ item.title }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="g_flex_1 subtitle">
|
||||||
|
{{ item.subTitle }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'Recom',
|
||||||
|
props: {},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
list:[
|
||||||
|
{
|
||||||
|
title:'知识星球',
|
||||||
|
subTitle:'知识工作者的内容变现工具',
|
||||||
|
img:'https://readhub.cn/_next/image?url=https%3A%2F%2Fresource.nocode.com%2Freadhub%2Fsponsor%2Fsponsor_logo_ask.png&w=32&q=75'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title:'知识星球',
|
||||||
|
subTitle:'支持疾病、药品、医院、医生等常用医疗场景的搜索查询，致力于提供简洁可信的医疗信息内容',
|
||||||
|
img:'https://readhub.cn/_next/image?url=https%3A%2F%2Fresource.nocode.com%2Freadhub%2Fsponsor%2Fsponsor_logo_ask.png&w=32&q=75'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title:'知识星球',
|
||||||
|
subTitle:'知识工作者的内容变现工具',
|
||||||
|
img:'https://readhub.cn/_next/image?url=https%3A%2F%2Fresource.nocode.com%2Freadhub%2Fsponsor%2Fsponsor_logo_ask.png&w=32&q=75'
|
||||||
|
},
|
||||||
|
]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
mounted() {},
|
||||||
|
methods: {}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.list-panel-recom {
|
||||||
|
background-color: #fff;
|
||||||
|
border-radius: 8px;
|
||||||
|
box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 0px;
|
||||||
|
padding: 16px;
|
||||||
|
margin-top: 16px;
|
||||||
|
.m-title{
|
||||||
|
color: rgb(0,0,0);
|
||||||
|
line-height: 1.5;
|
||||||
|
font-size: 17px;
|
||||||
|
margin-bottom: 12px;
|
||||||
|
}
|
||||||
|
.m-list{
|
||||||
|
.item{
|
||||||
|
margin-bottom: 12px;
|
||||||
|
border-radius: 8px;
|
||||||
|
box-shadow: rgb(0 0 0 / 10%) 0px 0px 0px;
|
||||||
|
border: 1px solid #dcdcdc;
|
||||||
|
padding: 16px;
|
||||||
|
transition: all 0.1s;
|
||||||
|
cursor: pointer;
|
||||||
|
.title{
|
||||||
|
margin-left: 10px;
|
||||||
|
color: rgb(25, 25, 25);
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: 500;
|
||||||
|
line-height: 1.63;
|
||||||
|
}
|
||||||
|
.subtitle{
|
||||||
|
margin-top: 12px;
|
||||||
|
color: rgb(87, 87, 87);
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
.img{
|
||||||
|
width: 32px;
|
||||||
|
height: auto;
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
&:hover{
|
||||||
|
box-shadow: rgb(0 0 0 / 10%) 0px 4px 12px;
|
||||||
|
transform: scale(1.001);
|
||||||
|
}
|
||||||
|
&:last-child{
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,121 @@
|
|||||||
|
<template>
|
||||||
|
<div class="list-panel-sponsor">
|
||||||
|
<div class="m-title g_flex_row_between">
|
||||||
|
<div class="g_flex_1" style="opacity: 0.5;">
|
||||||
|
赞助商
|
||||||
|
</div>
|
||||||
|
<div class="g_flex_none g_flex_column_center" style="cursor: pointer;">
|
||||||
|
<div class="g_flex_row_end" >
|
||||||
|
<div style="color: #246394;font-size: 14px;opacity: 1;" class="g_flex_column_center">
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-mail "><path d="M3 7a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v10a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-10z"></path><path d="M3 7l9 6l9 -6"></path></svg>
|
||||||
|
</div>
|
||||||
|
<div style="color: #246394;font-size: 14px;opacity: 1;margin-top: -2px;margin-left: 2px;font-weight: 600;">
|
||||||
|
加入
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="m-list">
|
||||||
|
<div v-for="(item,index) in list" :key="index"
|
||||||
|
class="item g_flex_row_start"
|
||||||
|
>
|
||||||
|
<div class="g_flex_1 box g_flex_column_center">
|
||||||
|
<div>
|
||||||
|
<span class="title">
|
||||||
|
{{ item.title }}
|
||||||
|
</span>
|
||||||
|
<span class="subtitle">
|
||||||
|
{{ item.subTitle }}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="g_flex_none">
|
||||||
|
<img :src="item.img" alt="" class="img"></img>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'Sponsor',
|
||||||
|
props: {},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
list:[
|
||||||
|
{
|
||||||
|
title:'知识星球',
|
||||||
|
subTitle:'知识工作者的内容变现工具',
|
||||||
|
img:'https://readhub.cn/_next/image?url=https%3A%2F%2Fresource.nocode.com%2Freadhub%2Fsponsor%2Fsponsor_logo_zsxq.png&w=96&q=75'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title:'知识星球',
|
||||||
|
subTitle:'知识工作者的内容变现工具',
|
||||||
|
img:'https://readhub.cn/_next/image?url=https%3A%2F%2Fresource.nocode.com%2Freadhub%2Fsponsor%2Fsponsor_logo_zsxq.png&w=96&q=75'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title:'知识星球',
|
||||||
|
subTitle:'知识工作者的内容变现工具',
|
||||||
|
img:'https://readhub.cn/_next/image?url=https%3A%2F%2Fresource.nocode.com%2Freadhub%2Fsponsor%2Fsponsor_logo_zsxq.png&w=96&q=75'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title:'知识星球',
|
||||||
|
subTitle:'知识工作者的内容变现工具',
|
||||||
|
img:'https://readhub.cn/_next/image?url=https%3A%2F%2Fresource.nocode.com%2Freadhub%2Fsponsor%2Fsponsor_logo_zsxq.png&w=96&q=75'
|
||||||
|
},
|
||||||
|
]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
mounted() {},
|
||||||
|
methods: {}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.list-panel-sponsor {
|
||||||
|
background-color: #fff;
|
||||||
|
border-radius: 8px;
|
||||||
|
box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 0px;
|
||||||
|
padding: 16px;
|
||||||
|
margin-top: 16px;
|
||||||
|
.m-title{
|
||||||
|
color: rgb(0,0,0);
|
||||||
|
line-height: 1.5;
|
||||||
|
font-size: 17px;
|
||||||
|
margin-bottom: 12px;
|
||||||
|
}
|
||||||
|
.m-list{
|
||||||
|
.item{
|
||||||
|
margin-bottom: 12px;
|
||||||
|
border-radius: 8px;
|
||||||
|
box-shadow: rgb(0 0 0 / 10%) 0px 0px 0px;
|
||||||
|
border: 1px solid #dcdcdc;
|
||||||
|
padding: 16px;
|
||||||
|
transition: all 0.1s;
|
||||||
|
cursor: pointer;
|
||||||
|
.title{
|
||||||
|
color: rgb(51, 51, 51);
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
.subtitle{
|
||||||
|
color: rgb(51, 51, 51);
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
.img{
|
||||||
|
width: 79px;
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
&:hover{
|
||||||
|
box-shadow: rgb(0 0 0 / 10%) 0px 4px 12px;
|
||||||
|
transform: scale(1.001);
|
||||||
|
}
|
||||||
|
&:last-child{
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Loading…
Reference in New Issue