feat(cankao): 参考页面PC端界面优化
This commit is contained in:
parent
46252a8d58
commit
c5996581bb
|
|
@ -4,7 +4,7 @@
|
|||
|
||||
<div class="content">
|
||||
<div class="top" @click="goBack">
|
||||
<image src="@/assets/zixun/icon_fanhui.png" class="icon_back" />
|
||||
<el-icon><ArrowLeft /></el-icon>
|
||||
<text>返回列表</text>
|
||||
</div>
|
||||
|
||||
|
|
@ -58,6 +58,7 @@ import { onMounted, ref } from 'vue';
|
|||
import { fetchArticleDetail } from '/@/api/cankao';
|
||||
import { Session } from '/@/utils/storage';
|
||||
import { useRoute, useRouter } from 'vue-router';
|
||||
import { ArrowLeft } from '@element-plus/icons-vue';
|
||||
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
|
|
@ -106,10 +107,12 @@ onMounted(async () => {
|
|||
|
||||
.content {
|
||||
background-color: white;
|
||||
width: 55vw;
|
||||
min-width: 1200px;
|
||||
width: 100%;
|
||||
// min-width: 1200px;
|
||||
min-height: 100vh;
|
||||
padding: 20px 30px;
|
||||
padding: 20px 120px;
|
||||
background-color: #fff;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.page_top {
|
||||
|
|
@ -183,6 +186,7 @@ onMounted(async () => {
|
|||
text-align: left;
|
||||
font-style: normal;
|
||||
margin-left: 5px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -221,7 +225,7 @@ onMounted(async () => {
|
|||
}
|
||||
|
||||
.abstract {
|
||||
font-family: PingFangSC, PingFang SC;
|
||||
font-family: "Microsoft YaHei", "PingFangSC", "PingFang SC";
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
color: #666666;
|
||||
|
|
@ -277,10 +281,10 @@ onMounted(async () => {
|
|||
}
|
||||
|
||||
.text {
|
||||
font-family: PingFangSC, PingFang SC;
|
||||
font-family: "Microsoft YaHei", "PingFangSC", "PingFang SC";
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
color: #1a1a1a;
|
||||
color: #333;
|
||||
line-height: 28px;
|
||||
text-align: left;
|
||||
font-style: normal;
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
|
||||
<div class="content">
|
||||
<div class="top_title">
|
||||
<text class="pageTitle">编辑精选</text>
|
||||
<text class="pageTitle">编辑<text class="strong">精选</text></text>
|
||||
|
||||
<div class="r_input">
|
||||
<input
|
||||
|
|
@ -37,15 +37,18 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div style="width: 100%; display: flex; justify-content: center" v-if="newsList && newsList.length > 0">
|
||||
<div class="pagination" style="width: 100%; display: flex; justify-content: flex-end" v-if="newsList && newsList.length > 0">
|
||||
<el-pagination
|
||||
popper-class="popper-style"
|
||||
background
|
||||
v-model:current-page="currentPage"
|
||||
:page-size="form.size"
|
||||
layout="prev, pager, next"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="form.total"
|
||||
@current-change="currentChange"
|
||||
@size-change="sizeChange"
|
||||
/>
|
||||
>
|
||||
</el-pagination>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -125,6 +128,13 @@ function currentChange(page) {
|
|||
getNewsList();
|
||||
}
|
||||
|
||||
function sizeChange(size) {
|
||||
form.page = 1;
|
||||
currentPage.value = 1;
|
||||
form.size = size;
|
||||
getNewsList();
|
||||
}
|
||||
|
||||
onMounted(async (e) => {
|
||||
console.log('🚀 ~ route.query:', route.query);
|
||||
|
||||
|
|
@ -222,6 +232,10 @@ const handlePopupErrorCallback = () => {
|
|||
font-size: 26px;
|
||||
color: #1a1a1a;
|
||||
font-weight: bold;
|
||||
|
||||
.strong {
|
||||
color: #ff9900;
|
||||
}
|
||||
}
|
||||
|
||||
.title_icon {
|
||||
|
|
@ -307,7 +321,7 @@ const handlePopupErrorCallback = () => {
|
|||
}
|
||||
|
||||
.item_title:hover {
|
||||
color: #057cff;
|
||||
color: #ff9900;
|
||||
}
|
||||
|
||||
.item_title {
|
||||
|
|
@ -319,7 +333,7 @@ const handlePopupErrorCallback = () => {
|
|||
}
|
||||
|
||||
.item_summary {
|
||||
font-family: PingFangSC, PingFang SC;
|
||||
font-family: 'Microsoft YaHei', 'PingFangSC', 'PingFang SC';
|
||||
font-weight: normal;
|
||||
font-size: 16px;
|
||||
color: #333333;
|
||||
|
|
@ -402,7 +416,7 @@ const handlePopupErrorCallback = () => {
|
|||
gap: 10px;
|
||||
flex-shrink: 0;
|
||||
border-radius: 0 10px 10px 0;
|
||||
background: #007aff;
|
||||
background: #ff9900;
|
||||
|
||||
color: white;
|
||||
font-family: PingFangSC, PingFang SC;
|
||||
|
|
@ -426,8 +440,8 @@ const handlePopupErrorCallback = () => {
|
|||
margin-left: 30px;
|
||||
margin-top: 3px;
|
||||
|
||||
:deep(.el-input__inner::placeholder) {
|
||||
color: #ccced3;
|
||||
:deep(.input::placeholder) {
|
||||
color: #ccc;
|
||||
font-family: 'PingFang SC';
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
|
|
@ -439,4 +453,20 @@ const handlePopupErrorCallback = () => {
|
|||
box-shadow: 0 0 0 #fff;
|
||||
}
|
||||
}
|
||||
.pagination {
|
||||
margin-top: 24px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
text-align: center;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
// :deep(.el-pager li){
|
||||
// border: 1px solid #ccc;
|
||||
// background: transparent;
|
||||
// }
|
||||
}
|
||||
|
||||
:deep(.el-select-dropdown__item.is-selected) {
|
||||
color: #ff9900;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Reference in New Issue