style: 优化移动端表格样式和响应式布局
This commit is contained in:
@@ -26,13 +26,13 @@
|
||||
</div>
|
||||
<div v-else>
|
||||
<el-table :data="aiRecommendations" style="width: 100%" size="small" class="ai-table">
|
||||
<el-table-column label="Pin" width="50" align="center">
|
||||
<el-table-column label="Pin" width="45" align="center">
|
||||
<template #default="scope">
|
||||
<el-icon
|
||||
:style="{
|
||||
color: scope.row.pin ? '#f56c6c' : '#909399',
|
||||
cursor: 'pointer',
|
||||
fontSize: '16px'
|
||||
fontSize: '18px'
|
||||
}"
|
||||
@click="togglePin(scope.row)"
|
||||
>
|
||||
@@ -40,20 +40,16 @@
|
||||
</el-icon>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="title" label="项目名称">
|
||||
<template #default="scope">
|
||||
<a :href="scope.row.url" target="_blank">{{ scope.row.title }}</a>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="source" label="来源" width="150" />
|
||||
<el-table-column prop="publishDate" label="发布日期" width="100">
|
||||
<el-table-column prop="title" label="项目名称" min-width="150" />
|
||||
<el-table-column prop="source" label="来源" min-width="80" />
|
||||
<el-table-column prop="publishDate" label="发布日期" width="95">
|
||||
<template #default="scope">
|
||||
{{ formatDate(scope.row.publishDate) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="confidence" label="推荐度" width="80">
|
||||
<el-table-column prop="confidence" label="推荐度" width="70">
|
||||
<template #default="scope">
|
||||
<el-tag :type="getConfidenceType(scope.row.confidence)">
|
||||
<el-tag :type="getConfidenceType(scope.row.confidence)" size="small">
|
||||
{{ scope.row.confidence }}%
|
||||
</el-tag>
|
||||
</template>
|
||||
@@ -106,13 +102,9 @@
|
||||
</div>
|
||||
<div v-else>
|
||||
<el-table :data="bidsByDateRange" style="width: 100%" size="small" class="bids-table">
|
||||
<el-table-column prop="title" label="项目名称">
|
||||
<template #default="scope">
|
||||
<a :href="scope.row.url" target="_blank">{{ scope.row.title }}</a>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="source" label="来源" width="100" />
|
||||
<el-table-column prop="publishDate" label="发布日期" width="100">
|
||||
<el-table-column prop="title" label="项目名称" min-width="150" />
|
||||
<el-table-column prop="source" label="来源" min-width="80" />
|
||||
<el-table-column prop="publishDate" label="发布日期" width="95">
|
||||
<template #default="scope">
|
||||
{{ formatDate(scope.row.publishDate) }}
|
||||
</template>
|
||||
@@ -457,11 +449,13 @@ a:hover {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.el-table {
|
||||
font-size: 12px;
|
||||
.ai-table,
|
||||
.bids-table {
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
.el-table .cell {
|
||||
.ai-table :deep(.el-table__cell),
|
||||
.bids-table :deep(.el-table__cell) {
|
||||
padding: 6px;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user