图片上传开发。详情页面图片展示
This commit is contained in:
@@ -1,15 +1,15 @@
|
||||
<template>
|
||||
<view class="container safe-area-top">
|
||||
<view>
|
||||
<!-- 自定义头部搜索框 -->
|
||||
<view class="custom-header">
|
||||
<view class="top">
|
||||
<image class="btnback button-click" src="@/static/icon/back.png" @click="navBack"></image>
|
||||
<!-- <image class="btnback button-click" src="@/static/icon/back.png" @click="navBack"></image> -->
|
||||
<view class="search-box">
|
||||
<uni-icons
|
||||
class="iconsearch"
|
||||
color="#666666"
|
||||
type="search"
|
||||
size="18"
|
||||
@confirm="searchCollection"
|
||||
></uni-icons>
|
||||
<input
|
||||
class="inputed"
|
||||
@@ -200,61 +200,16 @@ function dataToImg(data) {
|
||||
display: flex
|
||||
flex-direction: column
|
||||
background: #F4f4f4
|
||||
height: calc(100vh - var(--window-top) - var(--status-bar-height) - var(--window-bottom));
|
||||
.view-top{
|
||||
display: flex;
|
||||
justify-content: space-around
|
||||
background: #FFFFFF;
|
||||
.top-item{
|
||||
padding: 6rpx 0 18rpx 0
|
||||
}
|
||||
.active{
|
||||
color: #256BFA;
|
||||
font-weight: 500;
|
||||
position: relative;
|
||||
}
|
||||
.active::after{
|
||||
position: absolute;
|
||||
content: ''
|
||||
left: calc(50% - 12rpx)
|
||||
bottom: 10rpx
|
||||
width: 24rpx
|
||||
height: 6rpx
|
||||
background: #256BFA
|
||||
}
|
||||
}
|
||||
.main-content{
|
||||
background: #FFFFFF
|
||||
height: 100%
|
||||
.content-top{
|
||||
padding: 28rpx
|
||||
display: flex
|
||||
justify-content: space-between
|
||||
align-items: center
|
||||
.top-left{
|
||||
font-weight: 600;
|
||||
font-size: 36rpx;
|
||||
color: #000000;
|
||||
line-height: 42rpx;
|
||||
}
|
||||
}
|
||||
.content-history{
|
||||
padding: 0 28rpx;
|
||||
display: flex
|
||||
flex-wrap: wrap
|
||||
.history-tag{
|
||||
margin-right: 40rpx
|
||||
margin-bottom: 20rpx
|
||||
white-space: nowrap
|
||||
font-weight: 400;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
background: #F5F5F5;
|
||||
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
||||
width: fit-content;
|
||||
padding: 12rpx 20rpx
|
||||
}
|
||||
}
|
||||
height: 100vh;
|
||||
.custom-header {
|
||||
background-color: #fff;
|
||||
padding:0;
|
||||
box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 999;
|
||||
}
|
||||
.top {
|
||||
display: flex;
|
||||
@@ -262,8 +217,6 @@ function dataToImg(data) {
|
||||
justify-content: space-between
|
||||
background-color: #fff;
|
||||
padding: 20rpx 20rpx;
|
||||
position: sticky;
|
||||
top: 0
|
||||
.btnback{
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
@@ -304,6 +257,45 @@ function dataToImg(data) {
|
||||
color: #256BFA;
|
||||
}
|
||||
}
|
||||
.main-content{
|
||||
background: #FFFFFF
|
||||
height: 100%
|
||||
margin-top: 140rpx;
|
||||
.content-top{
|
||||
padding: 28rpx
|
||||
display: flex
|
||||
justify-content: space-between
|
||||
align-items: center
|
||||
.top-left{
|
||||
font-weight: 600;
|
||||
font-size: 36rpx;
|
||||
color: #000000;
|
||||
line-height: 42rpx;
|
||||
}
|
||||
}
|
||||
.content-history{
|
||||
padding: 0 28rpx;
|
||||
display: flex
|
||||
flex-wrap: wrap
|
||||
.history-tag{
|
||||
margin-right: 40rpx
|
||||
margin-bottom: 20rpx
|
||||
white-space: nowrap
|
||||
font-weight: 400;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
background: #F5F5F5;
|
||||
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
||||
width: fit-content;
|
||||
padding: 12rpx 20rpx
|
||||
}
|
||||
}
|
||||
}
|
||||
.Detailscroll-view{
|
||||
flex: 1
|
||||
overflow: hidden
|
||||
margin-top: 140rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.slot-item
|
||||
|
||||
Reference in New Issue
Block a user