Skip to content

E
exhibition_page
提交 0ccdac09 authored 作者: 龙菲's avatar 龙菲
浏览文件
操作

修改文物和展览的筛选字典为有数据的才显示

上级 56c5b03a
隐藏空白字符变更
内嵌 并排
正在显示 包含 161 行增加 和 155 行删除
src/api/culturalRelic.js
浏览文件 @ 0ccdac09
......@@ -41,3 +41,13 @@ export function getRecommendCr(params) {
params
})
}
// 获取存在文物的字典
export function getCrExistDict(params) {
return request({
url: '/bizCulturalRelic/existDict',
method: 'get',
params
})
}
src/api/display.js
浏览文件 @ 0ccdac09
......@@ -22,4 +22,12 @@ export function getRecommendDisplay(params){
method: 'get',
params
})
}
\ No newline at end of file
}
export function getDisplayExistDict(params){
return request({
url: '/bizExhibition/existDict',
method: 'get',
params
})
}
src/components/ListBanner/index.vue
浏览文件 @ 0ccdac09
......@@ -6,11 +6,11 @@
</div>
<div class="text">{{ title }}</div>
</div> -->
<div class="total" >
<div class="total-title">{{title}}</div>
<div class="total">
<div class="total-title">{{ title }}</div>
<div class="amount">
<span class="num">{{num}}</span>
<span class="unit">{{unit}}</span>
<span class="num">{{ num }}</span>
<span class="unit">{{ unit }}</span>
</div>
</div>
<!-- <div class="banner-1">
......@@ -30,11 +30,11 @@ export default {
type: String,
default: "标题",
},
num:{
type: String,
num: {
type: [String, Number],
default: '0',
},
unit:{
unit: {
type: String,
default: '个',
},
......@@ -47,11 +47,12 @@ export default {
width: 100%;
height: 360px;
position: relative;
background-image: linear-gradient(to right,$themeColor,rgba($themeColor, 0.9),$themeColor);
background-image: linear-gradient(to right, $themeColor, rgba($themeColor, 0.9), $themeColor);
padding: 0 13%;
display: flex;
align-items: center;
justify-content: space-between;
// height: 222px;
// background-image: url("@/assets/imgs/list/banner2.png");
// background-size:100% 100%;
......@@ -71,18 +72,22 @@ export default {
.total-title {
font-size: 28px;
}
.amount {
font-weight: bold;
.num{
.num {
font-size: 56px;
font-family: $puHuiTi;
}
.unit{
.unit {
font-size: $font-size-base;
}
}
}
// .banner-1 {
// position: absolute;
// left: 620px;
......@@ -100,25 +105,30 @@ export default {
// top: 54%;
margin-top: 30px;
width: 520px;
img {
width: 100%;
height: 100%;
}
}
.title {
padding: 0 13%;
display: flex;
align-items: flex-end;
.img-container {
width: 58px;
height: 58px;
margin-right: 26px;
img {
width: 100%;
height: 100%;
object-fit: contain;
}
}
.text {
font-size: 28px;
font-weight: 400;
......
src/views/culturalRelic/index.vue
浏览文件 @ 0ccdac09
<template>
<div class="cultural-relic">
<ListBanner title="文物展" unit="件/套" :num="list.total" />
<ListBanner title="共计文物" unit="件/套" :num="list.total" />
<div class="search-bar wow animate__animated animate__fadeIn">
<div class="search-wrapper">
<div class="search-item" @click="handleClickSearchBar('type')">
......@@ -160,7 +160,7 @@
<script>
import ListBanner from "@/components/ListBanner";
import { getCulturalRelicList } from "@/api/culturalRelic";
import { getCulturalRelicList, getCrExistDict } from "@/api/culturalRelic";
import { mapGetters } from "vuex";
export default {
name: "CulturalRelic",
......@@ -209,46 +209,51 @@ export default {
value: "",
}
];
await this.$store.dispatch("dict/getDictList", ["culturalRelicType"]);
for (const key in this.dicts.culturalRelicType) {
let res = await getCrExistDict()
let resTypeList = res.data.typeList
let resYearList = res.data.yearDictList
resTypeList.map(item=>{
typeList.push({
label: this.dicts.culturalRelicType[key],
value: key,
});
}
label:item.label,
value:item.value
})
})
resYearList.map(item=>{
yearList.push({
label:item.label,
value:item.value
})
})
this.typeList = typeList;
let res = await this.$store.dispatch("dict/getDictTree", [
"culturalRelicYears",
]);
this.culturalRelicYears = res.culturalRelicYears;
traveseYears(this.culturalRelicYears);
this.yearList = yearList;
// 获取叶子节点
function traveseYears(arr) {
if (arr && arr.length > 0) {
arr.map((item) => {
if (item.children && item.children.length > 0) {
traveseYears(item.children);
} else {
yearList.push({
value: item.value,
label: item.label,
});
}
});
}
}
// 删除无children的节点
// function traveseYears(arr) {
// if (arr && arr.length > 0) {
// arr.map((item) => {
// if (item.children && item.children.length == 0) {
// delete item.children;
// } else {
// traveseYears(item.children);
// }
// await this.$store.dispatch("dict/getDictList", ["culturalRelicType"]);
// for (const key in this.dicts.culturalRelicType) {
// typeList.push({
// label: this.dicts.culturalRelicType[key],
// value: key,
// });
// }
// }
// let res = await this.$store.dispatch("dict/getDictTree", [
// "culturalRelicYears",
// ]);
// this.culturalRelicYears = res.culturalRelicYears;
// traveseYears(this.culturalRelicYears);
// // 获取叶子节点
// function traveseYears(arr) {
// if (arr && arr.length > 0) {
// arr.map((item) => {
// if (item.children && item.children.length > 0) {
// traveseYears(item.children);
// } else {
// yearList.push({
// value: item.value,
// label: item.label,
// });
// }
// });
// }
// }
},
mounted() {
......@@ -524,7 +529,7 @@ $text-indent: 16px;
.search-panel {
min-height: 100px;
max-height: 138px;
background: rgb(#8ac7ff, 1) url("@/assets/imgs/home/panel-bg.png");
background: rgb($themeColor, 0.15) url("@/assets/imgs/home/panel-bg.png");
width: 100%;
display: flex;
justify-content: center;
......
src/views/display/index.vue
浏览文件 @ 0ccdac09
......@@ -5,44 +5,18 @@
<div class="content-wrapper">
<div class="content">
<div class="search wow animate__animated animate__fadeIn">
<el-input
class="input item"
v-model="keyword"
placeholder="请输入关键词"
@keyup.enter.native="search"
clearable
>
<el-input class="input item" v-model="keyword" placeholder="请输入关键词" @keyup.enter.native="search" clearable>
<!-- <span class="input-icon" slot="prefix">
<svg-icon icon-class="keyword"></svg-icon>
</span> -->
</el-input>
<el-select
class="type item"
v-model="type"
placeholder="请选择所属类别"
filterable
@change="handleTypeChange"
clearable
>
<el-option
v-for="(value, key) in dicts.displayType"
:key="key"
:label="value"
:value="key"
>
<el-select class="type item" v-model="type" placeholder="请选择所属类别" filterable @change="handleTypeChange"
clearable>
<el-option v-for="(item, index) in typeList" :key="index" :label="item.label" :value="item.value">
</el-option>
</el-select>
<el-cascader
class="years item"
v-model="regionCode"
:options="regionTree"
:props="culturalRegionProps"
placeholder="请选择所属地区"
filterable
@change="handleRegionChange"
clearable
ref="region"
>
<el-cascader class="years item" v-model="regionCode" :options="regionTree" :props="culturalRegionProps"
placeholder="请选择所属地区" filterable @change="handleRegionChange" clearable ref="region">
</el-cascader>
<div class="search-button" @click="search">
......@@ -51,67 +25,37 @@
</div>
</div>
<el-row :gutter="40" class="cr-list">
<el-col
:span="item.status == 1 ? 8 : 0"
class="cr-item"
@click.native="handleClick(item)"
@mouseenter.native="handleEnterImg(item)"
@mouseleave.native="handleLeaveImg(item)"
v-for="(item, index) in list.records"
:key="index"
>
<div
class="container wow animate__animated animate__fadeInUp"
v-if="item.status == 1"
>
<el-col :span="item.status == 1 ? 8 : 0" class="cr-item" @click.native="handleClick(item)"
@mouseenter.native="handleEnterImg(item)" @mouseleave.native="handleLeaveImg(item)"
v-for="(item, index) in list.records" :key="index">
<div class="container wow animate__animated animate__fadeInUp" v-if="item.status == 1">
<div class="img-container">
<img
:src="
$getFullUrl(item.faceImagePressUrl || item.faceImageUrl)
"
width="100%"
class="face-image"
lazy
/>
<img :src="
$getFullUrl(item.faceImagePressUrl || item.faceImageUrl)
" width="100%" class="face-image" lazy />
<div class="deco-left-top">
<img
:src="
require(`@/assets/imgs/list/img-deco${
item == currentImg ? '' : '-g'
<img :src="
require(`@/assets/imgs/list/img-deco${item == currentImg ? '' : '-g'
}.png`)
"
alt=""
/>
" alt="" />
</div>
<div class="deco-left-bottom">
<img
:src="
require(`@/assets/imgs/list/img-deco${
item == currentImg ? '' : '-g'
<img :src="
require(`@/assets/imgs/list/img-deco${item == currentImg ? '' : '-g'
}.png`)
"
alt=""
/>
" alt="" />
</div>
<div class="deco-right-top">
<img
:src="
require(`@/assets/imgs/list/img-deco${
item == currentImg ? '' : '-g'
<img :src="
require(`@/assets/imgs/list/img-deco${item == currentImg ? '' : '-g'
}.png`)
"
alt=""
/>
" alt="" />
</div>
<div class="deco-right-bottom">
<img
:src="
require(`@/assets/imgs/list/img-deco${
item == currentImg ? '' : '-g'
<img :src="
require(`@/assets/imgs/list/img-deco${item == currentImg ? '' : '-g'
}.png`)
"
alt=""
/>
" alt="" />
</div>
</div>
<div class="desc">
......@@ -144,21 +88,11 @@
</div>
</el-col>
</el-row>
<el-empty
description="暂无数据"
v-if="list.records.length == 0"
></el-empty>
<el-empty description="暂无数据" v-if="list.records.length == 0"></el-empty>
<div class="pagination-container">
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="Number(list.current)"
:page-sizes="[20, 40, 100]"
:page-size="Number(list.size)"
layout="total, prev, pager, next"
:total="Number(list.total)"
class="pagination"
>
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
:current-page="Number(list.current)" :page-sizes="[20, 40, 100]" :page-size="Number(list.size)"
layout="total, prev, pager, next" :total="Number(list.total)" class="pagination">
</el-pagination>
</div>
</div>
......@@ -168,9 +102,10 @@
<script>
import ListBanner from "@/components/ListBanner";
import { getList } from "@/api/display";
import { getList, getDisplayExistDict } from "@/api/display";
import { mapGetters } from "vuex";
import { debounce } from "@/utils/index";
export default {
name: "Display",
components: { ListBanner },
......@@ -193,13 +128,20 @@ export default {
regionCode: [],
regionTree: [],
currentImg: null,
typeList:[{
label:'全部',
value:''
}]
};
},
computed: {
...mapGetters(["dicts"]),
},
async created() {
await this.$store.dispatch("dict/getDictList", ["displayType"]);
// await this.$store.dispatch("dict/getDictList", ["displayType"]);
// 获取已经存在展览的字典
let res = await getDisplayExistDict()
this.typeList =[...this.typeList,...res.data.typeList]
},
mounted() {
this.loadData();
......@@ -305,8 +247,10 @@ export default {
<style lang="scss" scoped>
$blue: $themeColor;
$text-indent: 16px;
.display {
width: 100%;
// background-color: $themeColor;
// color: #fff;
.content-wrapper {
......@@ -323,13 +267,15 @@ $text-indent: 16px;
margin-bottom: 40px;
// height: 214px;
padding: 90px 70px 80px;
.item {
margin-right: 20px;
&:hover {
-webkit-box-reflect: below 2px
linear-gradient(transparent, rgba(0, 0, 0, 0.3));
-webkit-box-reflect: below 2px linear-gradient(transparent, rgba(0, 0, 0, 0.3));
}
}
.input-icon {
height: 100%;
display: flex;
......@@ -350,23 +296,28 @@ $text-indent: 16px;
font-size: 14px;
width: 156px;
height: 40px;
&:hover {
-webkit-box-reflect: below 2px
linear-gradient(transparent, rgba(0, 0, 0, 0.3));
-webkit-box-reflect: below 2px linear-gradient(transparent, rgba(0, 0, 0, 0.3));
}
// height: 100%;
.svg-icon {
margin-right: 4px;
}
}
}
.content {
width: 100%;
box-shadow: 0px 1px 56px 4px rgba(0, 0, 0, 0.16);
.cr-list {
padding: 0 74px;
.cr-item {
margin-bottom: 40px;
.container {
border: 2px solid #f1f1f1;
position: relative;
......@@ -374,15 +325,20 @@ $text-indent: 16px;
flex-direction: column;
cursor: pointer;
transition: all 0.5s ease;
&:hover {
border: 2px solid $themeColor;
.face-image {
transform: scale(1.2);
}
.desc {
background: url("@/assets/imgs/list/card-title-bg.png");
}
.img-container {
.deco-left-top,
.deco-left-bottom,
.deco-right-top,
......@@ -391,6 +347,7 @@ $text-indent: 16px;
}
}
}
.img-container {
background-color: #fff;
height: 268px;
......@@ -398,11 +355,13 @@ $text-indent: 16px;
transition: all 0.5s ease;
overflow: hidden;
position: relative;
.face-image {
height: 100%;
object-fit: contain;
transition: all 0.5s ease;
}
.deco-left-top,
.deco-left-bottom,
.deco-right-top,
......@@ -412,6 +371,7 @@ $text-indent: 16px;
height: 36px;
// display: none;
transition: all 0.5s ease;
img {
width: 100%;
height: 100%;
......@@ -423,26 +383,31 @@ $text-indent: 16px;
top: 0;
transform: rotate(180deg);
}
.deco-left-bottom {
left: 0;
bottom: 0;
transform: rotate(90deg);
}
.deco-right-top {
right: 0;
top: 0;
transform: rotate(270deg);
}
.deco-right-bottom {
right: 0;
bottom: 0;
}
}
.desc {
height: 150px;
padding: 36px 30px;
transition: all 0.5s ease;
background: #fff;
.name {
font-size: 18px;
font-weight: bold;
......@@ -452,6 +417,7 @@ $text-indent: 16px;
overflow: hidden;
text-overflow: ellipsis;
}
.desc-container {
display: flex;
align-items: flex-end;
......@@ -459,6 +425,7 @@ $text-indent: 16px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
.left {
// flex: 1;
......@@ -473,12 +440,15 @@ $text-indent: 16px;
margin-bottom: 4px;
}
}
.right {
color: #858484;
width: 120px;
.collect {
margin-right: 10px;
}
.svg-icon {
margin-right: 4px;
}
......@@ -516,6 +486,7 @@ $text-indent: 16px;
background: url("@/assets/imgs/list/input-border.png");
background-size: 100% 100%;
height: 40px;
&::placeholder {
text-indent: 10px;
color: #999;
......@@ -523,7 +494,9 @@ $text-indent: 16px;
}
}
}
::v-deep .el-pagination {
.btn-prev,
.btn-next {
background: transparent;
......@@ -533,6 +506,7 @@ $text-indent: 16px;
::v-deep .el-input {
width: auto !important;
}
::v-deep .el-pager {
li {
width: 28px;
......@@ -543,6 +517,7 @@ $text-indent: 16px;
margin: 0 10px;
color: #b7b7b7;
}
.active {
color: #fff;
}
......
src/views/museum/Detail.vue
浏览文件 @ 0ccdac09
......@@ -43,7 +43,6 @@
<i class="el-icon-phone"></i>
<span>{{ museumDetail.phone }}</span>
</div>
<div v-if="!museumDetail.phone">暂无联系方式</div>
</div>
</div>
......@@ -81,7 +80,7 @@ export default {
tabbars: [
'简介', '入园方式', '联系方式',
],
currentTab: ''
currentTab: '简介'
};
},
mounted() {
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论