mirage
/
edu
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改搜索页面样式问题

This commit is contained in:
Jason 2022-09-21 14:11:23 +08:00
parent a8e08053be
commit cbdb12f5d7
2 changed files with 17 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
admin/src/views/setting/search/index.vue
View File

@ -16,18 +16,18 @@
</el-card>
<el-card class="!border-none mt-4" shadow="never">
<div class="flex">
<div class="flex-1 w-3/5">
<div class="lg:flex">
<div class="flex-1 min-w-0">
<el-button type="primary" class="mb-4" @click="handleAdd">添加</el-button>
<el-table size="large" :data="formData.list">
<el-table-column label="关键词" prop="describe" min-width="160">
<el-table-column label="关键词" prop="describe" min-width="200">
<template #default="{ row }">
<el-input v-model="row.name" clearable />
<el-input v-model="row.name" clearable maxlength="30" />
</template>
</el-table-column>
<el-table-column label="排序" prop="describe" min-width="160">
<el-table-column label="排序" prop="describe" min-width="80">
<template #default="{ row }">
<el-input v-model="row.sort" type="number" />
<el-input v-model="row.sort" type="number" clearable />
</template>
</el-table-column>
<el-table-column label="操作" min-width="80" fixed="right">
@ -45,8 +45,8 @@
</el-table>
</div>
<div class="w-2/5 hot-search-phone">
<span class="mb-4">- 热搜预览图 -</span>
<div class="flex-none hot-search-phone mt-4 lg:mt-0 lg:ml-4">
<div class="mb-4 text-center">- 热搜预览图 -</div>
<div class="hot-search-phone-content">
<!-- 搜索框 -->
<div class="search-com">
@ -58,7 +58,7 @@
<!-- 热门搜索 -->
<div class="hot-search-title">热门搜索</div>
<div class="hot-search-text">
<span v-for="(text, index) in list" :key="index">{{ text.name }}</span>
<span class="truncate max-w-full" v-for="(text, index) in list" :key="index">{{ text.name }}</span>
</div>
</div>
</div>
@ -125,12 +125,10 @@ getData()
<style lang="scss" scoped>
.hot-search {
.hot-search-phone {
margin-left: 20px;
@apply flex flex-col items-center;
width: 300px;
&-content {
width: 280px;
height: 494px;
width: 100%;
height: 530px;
padding: 12px 12px;
border-radius: 10px;
border: 1px solid #e6e6e6;

10
app/src/pages/search/component/suggest.vue
View File

@ -4,9 +4,9 @@
<view class="hot" v-if="hot_search.length">
<view class="font-medium pl-[24rpx] pt-[26rpx] pb-[6rpx] text-lg">热门搜索</view>
<view class="w-full pl-[24rpx] pr-[8rpx]">
<view class="w-full px-[24rpx]">
<block v-for="(hotItem, index) in hot_search" :key="index">
<view class="keyword" @click="handleHistoreSearch(hotItem)">{{ hotItem }}</view>
<view class="keyword truncate max-w-full" @click="handleHistoreSearch(hotItem)">{{ hotItem }}</view>
</block>
</view>
</view>
@ -18,14 +18,14 @@
<!-- 历史搜索 -->
<view class="history" v-if="his_search.length">
<view class="flex justify-between px-[24rpx] pb-[6rpx]">
<view class="flex justify-between px-[24rpx] pb-[6rpx] pt-[26rpx]">
<view class="text-lg font-medium">历史搜索</view>
<view class="text-xs text-muted" @click="() => emit('clear')">清空</view>
</view>
<view class="w-full pl-[24rpx] pr-[8rpx]">
<view class="w-full px-[24rpx]">
<block v-for="(hisItem, index) in his_search" :key="index">
<view class="keyword" @click="handleHistoreSearch(hisItem)">{{ hisItem }}</view>
<view class="keyword truncate" @click="handleHistoreSearch(hisItem)">{{ hisItem }}</view>
</block>
</view>
</view>