Skip to content

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

添加记忆与传承视频；删除冗余代码

上级 a66de86d
隐藏空白字符变更
内嵌 并排
正在显示 包含 49 行增加 和 812 行删除
src/assets/imgs/boutique/gzjy.jpg deleted 100644 → 0
浏览文件 @ a66de86d
差异被折叠。
src/assets/imgs/boutique/jyycc.jpg deleted 100644 → 0
浏览文件 @ a66de86d
This image diff could not be displayed because it is too large. You can view the blob instead.
src/assets/imgs/boutique/jyycc1.jpg deleted 100644 → 0
浏览文件 @ a66de86d
This image diff could not be displayed because it is too large. You can view the blob instead.
src/assets/imgs/boutique/lzsg.jpg deleted 100644 → 0
浏览文件 @ a66de86d
差异被折叠。
src/assets/imgs/boutique/sdcs.jpg deleted 100644 → 0
浏览文件 @ a66de86d
差异被折叠。
src/assets/imgs/boutique/sdcs1.jpg deleted 100644 → 0
浏览文件 @ a66de86d
差异被折叠。
src/assets/imgs/boutique/smgz.jpg deleted 100644 → 0
浏览文件 @ a66de86d
差异被折叠。
src/assets/imgs/boutique/ylgdyw.jpg deleted 100644 → 0
浏览文件 @ a66de86d
This image diff could not be displayed because it is too large. You can view the blob instead.
src/assets/imgs/boutique/ylgdyw1.jpg deleted 100644 → 0
浏览文件 @ a66de86d
This image diff could not be displayed because it is too large. You can view the blob instead.
src/assets/imgs/boutique/zggz.jpg deleted 100644 → 0
浏览文件 @ a66de86d
差异被折叠。
src/assets/imgs/list/banner.png deleted 100644 → 0
浏览文件 @ a66de86d
差异被折叠。
src/assets/imgs/list/banner1.png deleted 100644 → 0
浏览文件 @ a66de86d
差异被折叠。
src/assets/styles/index.scss
浏览文件 @ 5c6fa038
......@@ -153,24 +153,6 @@ li {
color: #666;
}
}
.search-button {
cursor: pointer;
width: 156px;
height: 40px;
display: flex;
justify-content: center;
align-items: center;
background: url('@/assets/imgs/list/search-button-bg.png') transparent;
background-size: 100% 100%;
color: #444;
font-size: 14px;
transition: all 0.2s ease;
.svg-icon {
margin-right: 4px;
}
}
}
.cr-item .container {
......
src/components/ListBanner/index.vue
浏览文件 @ 5c6fa038
<template>
<div class="banner wow animate__animated animate__fadeIn">
<!-- <div class="title wow animate__animated animate__fadeInLeft">
<div class="img-container">
<img src="@/assets/imgs/list/ding.png" alt="" srcset="" />
</div>
<div class="text">{{ title }}</div>
</div> -->
<div class="main-title">
<p v-for="(label, i) in info" :key="i">{{ label }}</p>
</div>
......@@ -17,12 +11,6 @@
<span class="unit">{{ unit }}</span>
</div>
</div>
<!-- <div class="banner-1">
<img src="@/assets/imgs/list/banner3.png" alt="" />
</div> -->
<!-- <div class="banner-2 wow animate__animated animate__fadeInLeftBig" data-wow-duration="2s">
<img src="@/assets/imgs/list/banner2.png" alt="" />
</div> -->
</div>
</template>
......@@ -55,22 +43,10 @@ export default {
width: 100%;
height: calc(580px - 100px);
position: relative;
// background-image: linear-gradient(to right, $themeColor, rgba($themeColor, 0.9), $themeColor);
// background-image: url(@/assets/imgs/show/list-bg.png);
// background-size: cover;
// background-repeat: no-repeat;
// 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%;
// display: flex;
// align-items: center;
// background-size: 100%;
// background-position: 0 -100px;
> img {
position: absolute;
bottom: -60px;
......
src/views/boutique/components/jyycc/index.vue
浏览文件 @ 5c6fa038
......@@ -110,7 +110,7 @@
"
alt=""
/> -->
<ImageViewer width="680px" height="450px" :src="
<ImageViewer width="100%" height="100%" :src="
require(`@/assets/imgs/topic/jyycc/zt2/${
activeDetail.title
}/${i + 1}.png`)
......@@ -148,7 +148,7 @@
<img src="@/assets/imgs/topic/jyycc/vr_left.png" alt="" />
</div>
<div class="text">详细介绍贵州各民族的记忆与传承</div>
<div class="video-button">观看视频</div>
<div class="video-button" @click="handleClickWatchVideo('贵州省民族博物馆宣传片.mp4')">观看视频</div>
</div>
<div class="center wow animate__animated animate__fadeIn">
<div class="img-container">
......@@ -173,12 +173,17 @@
<img src="@/assets/imgs/topic/jyycc/vr_right.png" alt="" />
</div>
<div class="text">民族馆诉说贵州故事</div>
<div class="video-button">观看视频</div>
<div class="video-button" @click="handleClickWatchVideo('')">观看视频</div>
</div>
</div>
</div>
</div>
</div>
<m-dialog v-if="showVideo" @close="showVideo = false">
<div class="jyycc-video">
<video-player :src="introUrl"></video-player>
</div>
</m-dialog>
</div>
</template>
......@@ -187,10 +192,13 @@ import part1 from "./jyycc-nation.json";
import part2 from "./jyycc-dmby.json";
import videoPlayer from "@/components/VideoPlayer";
import ImageViewer from '@/components/ImageViewer'
import MDialog from "@/components/MDialog";
export default {
components: {
videoPlayer,
ImageViewer
ImageViewer,
MDialog,
videoPlayer,
},
data() {
return {
......@@ -216,6 +224,8 @@ export default {
details: part2,
activeDetail: {},
curNation: {},
showVideo: false,
introUrl: '', //左侧视频的链接
};
},
methods: {
......@@ -228,6 +238,17 @@ export default {
handleToVR() {
window.open("https://www.gzsmzmuseum.cn/3dxuni/sjz/html/index.html?scene_id=90524980");
},
handleClickWatchVideo(name) {
if (!name) {
this.$message.info('视频尚未上架，敬请期待~')
return
}
const url = `/files/boutique_imgs/jyycc/video/${name}`
this.introUrl = url
this.$nextTick(() => {
this.showVideo = true
})
}
},
mounted() {
this.changeNation(this.lines[0][0]);
......@@ -245,10 +266,11 @@ export default {
width: 100%;
}
>div {
position: relative;
width: 100%;
}
// 去除视频弹窗其他的子div
// &>div:not(.m-dialog) {
// position: relative;
// width: 100%;
// }
.first {
position: absolute;
......@@ -860,6 +882,15 @@ export default {
}
}
.jyycc-video {
width: 70%;
height: 800px;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
@keyframes swing {
0% {
transform: rotate(0deg);
......
src/views/ccProduct/index.vue
浏览文件 @ 5c6fa038
......@@ -46,46 +46,6 @@
<div class="container wow animate__animated animate__fadeInUp" v-if="item.status == 1">
<div class="img-container">
<img :src="$getFullUrl(item.imagesVo[0].pressUrl)" width="100%" class="face-image" lazy />
<!-- <div class="deco-left-top">
<img
:src="
require(`@/assets/imgs/list/img-deco${
item == currentImg ? '' : '-g'
}.png`)
"
alt=""
/>
</div>
<div class="deco-left-bottom">
<img
:src="
require(`@/assets/imgs/list/img-deco${
item == currentImg ? '' : '-g'
}.png`)
"
alt=""
/>
</div>
<div class="deco-right-top">
<img
:src="
require(`@/assets/imgs/list/img-deco${
item == currentImg ? '' : '-g'
}.png`)
"
alt=""
/>
</div>
<div class="deco-right-bottom">
<img
:src="
require(`@/assets/imgs/list/img-deco${
item == currentImg ? '' : '-g'
}.png`)
"
alt=""
/>
</div> -->
</div>
<div class="desc">
<div class="name">{{ item.title }}</div>
......@@ -295,96 +255,6 @@ $text-indent: 16px;
background-color: #fff;
padding-bottom: 126px;
/* .search {
display: flex;
justify-content: center;
align-items: center;
padding: 90px 70px 80px;
margin-bottom: 40px;
background-image: url("@/assets/imgs/list/search-bg.png");
background-size: 22%;
height: 214px;
.item {
margin-right: 20px;
&:hover {
-webkit-box-reflect: below 2px
linear-gradient(transparent, rgba(0, 0, 0, 0.3));
}
}
.input-icon {
height: 100%;
display: flex;
align-items: center;
font-size: 20px;
margin-left: 12px;
color: #444;
}
.threeD {
display: flex;
cursor: pointer;
font-size: 16px;
color: #666;
margin-left: 20px;
transition: all ease 0.3s;
// -webkit-box-reflect: below 10px linear-gradient(transparent, rgba(0, 0, 0, 0.4));
.svg-icon {
margin-right: 4px;
font-size: 22px;
}
&:hover {
-webkit-box-reflect: below 2px
linear-gradient(transparent, rgba(0, 0, 0, 0.5));
}
// .box {
// width: 28px;
// height: 28px;
// display: flex;
// justify-content: center;
// align-items: center;
// border: 2px solid #444;
// margin-right: 6px;
// i {
// font-size: 28px;
// }
// }
// .text {
// display: flex;
// justify-content: center;
// align-items: center;
// color: #444;
// }
}
.search-button {
cursor: pointer;
width: 156px;
height: 40px;
display: flex;
justify-content: center;
align-items: center;
background: url("@/assets/imgs/list/search-button-bg.png") transparent;
background-size: 100% 100%;
color: #444;
font-size: 14px;
transition: all 0.2s ease;
&:hover {
-webkit-box-reflect: below 2px
linear-gradient(transparent, rgba(0, 0, 0, 0.3));
}
.svg-icon {
margin-right: 4px;
}
}
} */
.content {
// width: 100%;
......@@ -447,9 +317,7 @@ $text-indent: 16px;
}
}
.desc {
background: url("@/assets/imgs/list/card-title-bg.png");
}
}
.img-container {
......@@ -596,60 +464,9 @@ $text-indent: 16px;
display: flex;
justify-content: center;
align-items: center;
background-image: url("@/assets/imgs/list/search-bg.png");
background-size: 22%;
height: 116px;
}
}
/* ::v-deep .el-cascader .el-input .el-icon-arrow-down,
::v-deep .el-select .el-input .el-select__caret {
font-weight: bold;
}
::v-deep .el-input,
.el-cascader {
// width: 368px !important;
.el-input__inner {
// width: 100%;
border: none;
border-radius: 0;
background: url("@/assets/imgs/list/input-border.png");
background-size: 100% 100%;
height: 40px;
&::placeholder {
text-indent: 10px;
color: #999;
font-size: 14px;
}
}
}
::v-deep .el-input {
width: auto !important;
}
::v-deep .el-pagination {
.btn-prev,
.btn-next {
background: transparent;
}
}
::v-deep .el-pager {
li {
width: 28px;
height: 28px;
border-radius: 50%;
background: $themeColor;
min-width: 0;
margin: 0 10px;
color: #b7b7b7;
}
.active {
color: #fff;
}
} */
</style>
\ No newline at end of file
src/views/culturalRelic/index-hasbg.vue
浏览文件 @ 5c6fa038
......@@ -27,43 +27,6 @@
</div>
</div>
<!-- <el-select
class="type item"
v-model="type"
placeholder="请选择所属类别"
filterable
@change="handleTypeChange"
clearable
>
<el-option
v-for="(value, key) in dicts.culturalRelicType"
:key="key"
:label="value"
:value="key"
>
</el-option>
</el-select>
<el-cascader
class="years item"
v-model="years"
:options="culturalRelicYears"
:props="culturalRelicYearsProps"
placeholder="请选择文物年代"
filterable
@change="handleYearsChange"
clearable
ref="years"
>
</el-cascader> -->
<!-- <el-col :span="3">
<div class="search-button" @click="search" style="width: 100%">
<svg-icon icon-class="search"></svg-icon>
检索
</div>
</el-col> -->
<!-- </el-row> -->
</div>
<transition name="el-zoom-in-top">
<div class="search-panel" v-show="showSearchPanel">
......@@ -117,46 +80,6 @@
class="face-image"
lazy
/>
<!-- <div class="deco-left-top">
<img
:src="
require(`@/assets/imgs/list/img-deco${
item == currentImg ? '' : '-g'
}.png`)
"
alt=""
/>
</div>
<div class="deco-left-bottom">
<img
:src="
require(`@/assets/imgs/list/img-deco${
item == currentImg ? '' : '-g'
}.png`)
"
alt=""
/>
</div>
<div class="deco-right-top">
<img
:src="
require(`@/assets/imgs/list/img-deco${
item == currentImg ? '' : '-g'
}.png`)
"
alt=""
/>
</div>
<div class="deco-right-bottom">
<img
:src="
require(`@/assets/imgs/list/img-deco${
item == currentImg ? '' : '-g'
}.png`)
"
alt=""
/>
</div> -->
</div>
<div class="showIcon" v-if="item && item.url3d">
<svg-icon icon-class="3d" class="icon"></svg-icon>
......@@ -438,22 +361,11 @@ export default {
$text-indent: 16px;
.cultural-relic {
width: 100%;
// background-color: $themeColor;
// color: #fff;
.search-bar {
display: flex;
align-items: center;
flex-direction: column;
padding: 24px 20%;
// background: rgb($themeColor, 1) url("@/assets/imgs/home/panel-bg.png");
// background-color: rgba(19, 44, 51,0.7);
// margin-bottom: 40px;
// background-image: url("@/assets/imgs/list/search-bg.png");
// background-size: 21%;
// background-color: $themeColor;
// background-size: 22%;
// height: 214px;
.search-wrapper {
display: flex;
width: 100%;
......@@ -470,8 +382,6 @@ $text-indent: 16px;
justify-content: space-between;
border: 1px solid #ccc;
background-color: #fff;
// background: url("@/assets/imgs/list/search-button-bg.png") transparent;
// background-size: 100% 100%;
margin-right: 20px;
cursor: pointer;
input {
......@@ -530,51 +440,11 @@ $text-indent: 16px;
-webkit-box-reflect: below 2px
linear-gradient(transparent, rgba(0, 0, 0, 0.5));
}
// .box {
// width: 28px;
// height: 28px;
// display: flex;
// justify-content: center;
// align-items: center;
// border: 2px solid #444;
// margin-right: 6px;
// i {
// font-size: 28px;
// }
// }
// .text {
// display: flex;
// justify-content: center;
// align-items: center;
// color: #444;
// }
}
.search-button {
cursor: pointer;
width: 156px;
height: 40px;
display: flex;
justify-content: center;
align-items: center;
background: url("@/assets/imgs/list/search-button-bg.png") transparent;
background-size: 100% 100%;
color: #444;
font-size: 14px;
transition: all 0.2s ease;
&:hover {
-webkit-box-reflect: below 2px
linear-gradient(transparent, rgba(0, 0, 0, 0.3));
}
.svg-icon {
margin-right: 4px;
}
}
}
.search-panel {
min-height: 100px;
max-height: 138px;
background: rgb($themeColor, 0.15) url("@/assets/imgs/home/panel-bg.png");
width: 100%;
display: flex;
justify-content: center;
......@@ -703,11 +573,7 @@ $text-indent: 16px;
filter: grayscale(0.7) blur(1px);
}
}
.desc {
// background: url("@/assets/imgs/list/card-title-bg.png");
// display: none;
opacity: 0;
}
.hover-bg {
> div {
......@@ -894,7 +760,6 @@ $text-indent: 16px;
display: flex;
justify-content: center;
align-items: center;
background-image: url("@/assets/imgs/list/search-bg.png");
background-size: 22%;
height: 116px;
}
......@@ -979,7 +844,6 @@ $text-indent: 16px;
// width: 100%;
border: none;
border-radius: 0;
background: url("@/assets/imgs/list/input-border.png");
background-size: 100% 100%;
height: 40px;
&::placeholder {
......
src/views/culturalRelic/index.vue
浏览文件 @ 5c6fa038
......@@ -94,30 +94,6 @@
class="face-image"
lazy
/>
<!-- <div class="deco-left-top">
<img :src="
require(`@/assets/imgs/list/img-deco${item == currentImg ? '' : '-g'
}.png`)
" alt="" />
</div>
<div class="deco-left-bottom">
<img :src="
require(`@/assets/imgs/list/img-deco${item == currentImg ? '' : '-g'
}.png`)
" alt="" />
</div>
<div class="deco-right-top">
<img :src="
require(`@/assets/imgs/list/img-deco${item == currentImg ? '' : '-g'
}.png`)
" alt="" />
</div>
<div class="deco-right-bottom">
<img :src="
require(`@/assets/imgs/list/img-deco${item == currentImg ? '' : '-g'
}.png`)
" alt="" />
</div> -->
</div>
<div class="showIcon" v-if="item && item.url3d">
<svg-icon icon-class="3d" class="icon"></svg-icon>
......@@ -135,18 +111,6 @@
<span>{{ item.deptName }}</span>
</div>
</div>
<!-- <div class="right">
<span class="collect">
<svg-icon icon-class="collect"></svg-icon>
<span>{{
item.collectCount ? item.collectCount : "收藏"
}}</span>
</span>
<span class="view">
<svg-icon icon-class="view"></svg-icon>
<span>{{ item.browseCount }}</span>
</span>
</div> -->
</div>
</div>
</div>
......@@ -528,60 +492,12 @@ $text-indent: 16px;
margin-right: 4px;
font-size: 22px;
}
/* &:hover {
-webkit-box-reflect: below 2px
linear-gradient(transparent, rgba(0, 0, 0, 0.5));
} */
// .box {
// width: 28px;
// height: 28px;
// display: flex;
// justify-content: center;
// align-items: center;
// border: 2px solid #444;
// margin-right: 6px;
// i {
// font-size: 28px;
// }
// }
// .text {
// display: flex;
// justify-content: center;
// align-items: center;
// color: #444;
// }
}
.search-button {
cursor: pointer;
width: 156px;
height: 40px;
display: flex;
justify-content: center;
align-items: center;
background: url("@/assets/imgs/list/search-button-bg.png") transparent;
background-size: 100% 100%;
color: #444;
font-size: 14px;
transition: all 0.2s ease;
/* &:hover {
-webkit-box-reflect: below 2px
linear-gradient(transparent, rgba(0, 0, 0, 0.3));
} */
.svg-icon {
margin-right: 4px;
}
}
}
.search-panel {
min-height: 100px;
max-height: 138px;
background: rgb($themeColor, 0.7) url("@/assets/imgs/home/panel-bg.png");
width: 100%;
display: flex;
justify-content: center;
......@@ -682,9 +598,6 @@ $text-indent: 16px;
}
}
/* .desc {
background: url("@/assets/imgs/list/card-title-bg.png");
} */
}
.img-container {
......@@ -841,7 +754,6 @@ $text-indent: 16px;
display: flex;
justify-content: center;
align-items: center;
// background-image: url("@/assets/imgs/list/search-bg.png");
background-size: 22%;
height: 116px;
padding-top: 30px;
......@@ -860,7 +772,6 @@ $text-indent: 16px;
// width: 100%;
border: none;
border-radius: 0;
background: url("@/assets/imgs/list/input-border.png");
background-size: 100% 100%;
height: 40px;
......
src/views/display/index.vue
浏览文件 @ 5c6fa038
......@@ -436,27 +436,6 @@ $text-indent: 16px;
z-index: 9;
}
&: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,
.deco-right-bottom {
display: block;
}
}
}
.img-container {
background-color: #fff;
height: 268px;
......@@ -473,45 +452,6 @@ $text-indent: 16px;
object-fit: cover;
transition: all 0.5s ease;
}
.deco-left-top,
.deco-left-bottom,
.deco-right-top,
.deco-right-bottom {
position: absolute;
width: 36px;
height: 36px;
// display: none;
transition: all 0.5s ease;
img {
width: 100%;
height: 100%;
}
}
.deco-left-top {
left: 0;
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 {
......@@ -578,7 +518,6 @@ $text-indent: 16px;
display: flex;
justify-content: center;
align-items: center;
background-image: url("@/assets/imgs/list/search-bg.png");
background-size: 22%;
height: 116px;
}
......@@ -595,7 +534,6 @@ $text-indent: 16px;
width: 100%;
border: none;
border-radius: 0;
background: url("@/assets/imgs/list/input-border.png");
background-size: 100% 100%;
height: 40px;
......
src/views/museum/index.vue
浏览文件 @ 5c6fa038
......@@ -76,46 +76,7 @@
class="face-image"
lazy
/>
<!-- <div class="deco-left-top">
<img
:src="
require(`@/assets/imgs/list/img-deco${
item == currentImg ? '' : '-g'
}.png`)
"
alt=""
/>
</div>
<div class="deco-left-bottom">
<img
:src="
require(`@/assets/imgs/list/img-deco${
item == currentImg ? '' : '-g'
}.png`)
"
alt=""
/>
</div>
<div class="deco-right-top">
<img
:src="
require(`@/assets/imgs/list/img-deco${
item == currentImg ? '' : '-g'
}.png`)
"
alt=""
/>
</div>
<div class="deco-right-bottom">
<img
:src="
require(`@/assets/imgs/list/img-deco${
item == currentImg ? '' : '-g'
}.png`)
"
alt=""
/>
</div> -->
</div>
<div class="desc">
<div class="name">{{ item.name }}</div>
......@@ -285,43 +246,12 @@ $blue: $themeColor;
$text-indent: 16px;
.display {
width: 100%;
// background-color: $themeColor;
// color: #fff;
.content-wrapper {
// padding-top: 60px;
padding-bottom: 126px;
background-color: #fff;
/* .search {
display: flex;
justify-content: center;
align-items: center;
// background-image: url("@/assets/imgs/list/search-bg.png");
// background-size: 22%;
margin-bottom: 40px;
// padding: 90px 70px 80px;
// height: 214px;
.item {
margin-right: 20px;
}
.search-button {
cursor: pointer;
width: 156px;
height: 40px;
display: flex;
justify-content: center;
align-items: center;
background: url("@/assets/imgs/list/search-button-bg.png");
background-size: 100% 100%;
color: #444;
font-size: 14px;
.svg-icon {
margin-right: 4px;
}
}
} */
.content {
// width: 100%;
// box-shadow: 0px 1px 56px 4px rgba(0, 0, 0, 0.16);
.search {
padding: 48px 0 32px;
}
......@@ -358,17 +288,6 @@ $text-indent: 16px;
.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,
.deco-right-bottom {
display: block;
}
}
}
.img-container {
background-color: #f8f8f8;
......@@ -382,40 +301,7 @@ $text-indent: 16px;
object-fit: cover;
transition: all 0.5s ease;
}
.deco-left-top,
.deco-left-bottom,
.deco-right-top,
.deco-right-bottom {
position: absolute;
width: 36px;
height: 36px;
// display: none;
transition: all 0.5s ease;
img {
width: 100%;
height: 100%;
}
}
.deco-left-top {
left: 0;
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: 100px;
......@@ -445,52 +331,9 @@ $text-indent: 16px;
display: flex;
justify-content: center;
align-items: center;
background-image: url("@/assets/imgs/list/search-bg.png");
background-size: 22%;
height: 116px;
}
}
/* ::v-deep .el-cascader .el-input .el-icon-arrow-down,
::v-deep .el-select .el-input .el-select__caret {
font-weight: bold;
}
::v-deep .el-input,
.el-cascader {
width: 368px !important;
.el-input__inner {
width: 100%;
border: none;
border-radius: 0;
background: url("@/assets/imgs/list/input-border.png");
background-size: 100% 100%;
height: 40px;
&::placeholder {
text-indent: 10px;
color: #999;
font-size: 14px;
}
}
}
::v-deep .el-pagination {
.btn-prev,
.btn-next {
background: transparent;
}
}
::v-deep .el-pager {
li {
width: 28px;
height: 28px;
border-radius: 50%;
background: $themeColor;
min-width: 0;
margin: 0 10px;
color: #b7b7b7;
}
.active {
color: #fff;
}
} */
</style>
\ No newline at end of file
src/views/virtual/index.vue
浏览文件 @ 5c6fa038
......@@ -57,46 +57,6 @@
class="face-image"
lazy
/>
<div class="deco-left-top">
<img
:src="
require(`@/assets/imgs/list/img-deco${
item == currentImg ? '' : '-g'
}.png`)
"
alt=""
/>
</div>
<div class="deco-left-bottom">
<img
:src="
require(`@/assets/imgs/list/img-deco${
item == currentImg ? '' : '-g'
}.png`)
"
alt=""
/>
</div>
<div class="deco-right-top">
<img
:src="
require(`@/assets/imgs/list/img-deco${
item == currentImg ? '' : '-g'
}.png`)
"
alt=""
/>
</div>
<div class="deco-right-bottom">
<img
:src="
require(`@/assets/imgs/list/img-deco${
item == currentImg ? '' : '-g'
}.png`)
"
alt=""
/>
</div>
</div>
<div class="desc">
<div class="name">{{ item.name }}</div>
......@@ -282,7 +242,6 @@ $text-indent: 16px;
display: flex;
justify-content: center;
align-items: center;
background-image: url("@/assets/imgs/list/search-bg.png");
background-size: 22%;
height: 214px;
padding: 90px 70px 80px;
......@@ -310,7 +269,7 @@ $text-indent: 16px;
display: flex;
justify-content: center;
align-items: center;
background: url("@/assets/imgs/list/search-button-bg.png");
// background: url("@/assets/imgs/list/search-button-bg.png");
background-size: 100% 100%;
color: #444;
font-size: 14px;
......@@ -347,17 +306,6 @@ $text-indent: 16px;
.face-image {
transform: scale(1.2);
}
.img-container {
.deco-left-top,
.deco-left-bottom,
.deco-right-top,
.deco-right-bottom {
display: block;
}
}
.desc {
background: url("@/assets/imgs/list/card-title-bg.png");
}
}
.img-container {
background-color: #fff;
......@@ -434,7 +382,7 @@ $text-indent: 16px;
display: flex;
justify-content: center;
align-items: center;
background-image: url("@/assets/imgs/list/search-bg.png");
// background-image: url("@/assets/imgs/list/search-bg.png");
background-size: 22%;
height: 116px;
}
......@@ -452,7 +400,7 @@ $text-indent: 16px;
width: 100%;
border: none;
border-radius: 0;
background: url("@/assets/imgs/list/input-border.png");
// background: url("@/assets/imgs/list/input-border.png");
background-size: 100% 100%;
height: 40px;
&::placeholder {
......
vue.config.js
浏览文件 @ 5c6fa038
......@@ -101,79 +101,8 @@ module.exports = defineConfig({
symbolId: 'icon-[name]'
})
.end()
// configureWebpack: {
// // 采用cdn的方式,所以将以下这些文件配置不打包
// externals: {
// vue: "vue",
// 'vue-router': 'VueRouter',
// vuex: 'Vuex',
// axios: 'axios',
// 'core-js': 'core-js',
// },
// resolve: {
// alias: {
// '@': resolve('src')
// }
// },
// optimization: {
// splitChunks: {
// cacheGroups: {
// vendor: {
// //第三方库抽离
// chunks: "all",
// test: /node_modules/,
// name: "vendor",
// minChunks: 1, //在分割之前，这个代码块最小应该被引用的次数
// maxInitialRequests: 5,
// minSize: 0, //大于0个字节
// priority: 100 //权重
// },
// common: {
// //公用模块抽离
// chunks: "all",
// test: /[\\/]src[\\/]utils[\\/]/,
// name: "common",
// minChunks: 1,
// maxInitialRequests: 5,
// minSize: 0, //大于0个字节
// priority: 60
// },
// // styles: {
// // //样式抽离
// // name: "styles",
// // test: /\.(sa|sc|c)ss$/,
// // chunks: "all",
// // enforce: true
// // },
// runtimeChunk: {
// name: "manifest"
// }
// }
// }
// }
// },
// cdn
// if (IS_PRODUCTION) {
// config.plugin('html').tap(args => {
// args[0].cdn = cdn
// return args
// })
// //视为一个外部库，而不将它打包进来
// config.externals(externals)
// // 生产模式去除console.log
// config.optimization
// .minimizer('terser')
// .tap(args => {
// Object.assign(args[0].terserOptions.compress, {
// pure_funcs: ['console.log']
// })
// return args
// })
// }
// 提升构建速度近50%
config.cache(true)
},
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论