提交 5c6fa038 authored 作者: 龙菲's avatar 龙菲

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

上级 a66de86d
差异被折叠。
This image diff could not be displayed because it is too large. You can view the blob instead.
This image diff could not be displayed because it is too large. You can view the blob instead.
差异被折叠。
差异被折叠。
差异被折叠。
差异被折叠。
This image diff could not be displayed because it is too large. You can view the blob instead.
This image diff could not be displayed because it is too large. You can view the blob instead.
差异被折叠。
差异被折叠。
差异被折叠。
......@@ -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 {
......
<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;
......
......@@ -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);
......
......@@ -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
......@@ -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 {
......
......@@ -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;
......
......@@ -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;
......
......@@ -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
......@@ -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 {
......
......@@ -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 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论