作者 lusheng

首页开始修改

@@ -3,33 +3,35 @@ @@ -3,33 +3,35 @@
3 <view class="nevbg"> 3 <view class="nevbg">
4 <view class="back" 4 <view class="back"
5 :style="[{paddingTop:titleTop+'rpx'},{height:bgHeight+'rpx'},{lineheight:titleHeight+'rpx'}]"> 5 :style="[{paddingTop:titleTop+'rpx'},{height:bgHeight+'rpx'},{lineheight:titleHeight+'rpx'}]">
6 - <image src="/static/back2.png" mode="" @click="back"></image>  
7 - <text>卖设备</text> 6 + <text>设备乐</text>
8 </view> 7 </view>
9 - <image src="@/static/image/Rectangle 16.png"  
10 - style="height: 400rpx;width: 100vw; position: absolute;top:0;z-index: -1;" mode=""></image>  
11 </view> 8 </view>
12 - 9 + <view style="height:186rpx"></view>
13 <view class="top"> 10 <view class="top">
14 <view class="flexBox" style="padding: 24rpx 24rpx 0 24rpx;"> 11 <view class="flexBox" style="padding: 24rpx 24rpx 0 24rpx;">
15 <view class="" style="width: 65vw;" @click="goRot('/pages/subPages/moreSearch')"> 12 <view class="" style="width: 65vw;" @click="goRot('/pages/subPages/moreSearch')">
16 - <u-input placeholder="请输入" prefixIcon="search" border="surround" v-model="keyword" shape="circle"  
17 - @change="change">  
18 - <view slot="prefix" style="display: flex; align-items: center; justify-content: center;">  
19 - <text style="font-size: 24rpx; margin-right: 6rpx;"  
20 - @click="goRot('/pages/subPages/moreChoose')">{{city_name ? city_name : '城市'}}</text>  
21 - <u-icon name="arrow-down-fill" size="20rpx"></u-icon> 13 + <view class="searchcity">
  14 + <view class="city">
  15 + {{city_name ? city_name : '城市'}}
22 </view> 16 </view>
23 -  
24 - </u-input> 17 + <image class="img1" src="/static/icon/xia.png" mode=""></image>
  18 + <view class="searchline">
  19 + |
  20 + </view>
  21 + <image class="img2" src="/static/icon/search.png" mode=""></image>
  22 + <input type="text" placeholder="输入关键词搜索" disabled placeholder-style="font-size: 26rpx;font-weight: 400;">
  23 + </view>
25 </view> 24 </view>
26 25
27 <button style="width: 30vw;" shape="circle" class="btn" size="small" @click="goHub">免费发布</button> 26 <button style="width: 30vw;" shape="circle" class="btn" size="small" @click="goHub">免费发布</button>
28 </view> 27 </view>
29 28
30 <view class="boxs" style="padding: 0 24rpx; justify-content: space-evenly"> 29 <view class="boxs" style="padding: 0 24rpx; justify-content: space-evenly">
31 - <view class="item" v-for="item in list.slice(0,3)" @click="goRot('/pages/subPages/moreSearch',item.name)">  
32 - <image :src="item.icon_url" class="img" mode=""></image> 30 + <view class="item" v-for="item in list.slice(0,3)"
  31 + @click="goRot('/pages/subPages/moreSearch',item.name)">
  32 + <view class="imgbtn">
  33 + <image :src="item.icon_url" class="img" mode=""></image>
  34 + </view>
33 <p style="font-size: 24rpx; margin-top: 16rpx;">{{item.name}}</p> 35 <p style="font-size: 24rpx; margin-top: 16rpx;">{{item.name}}</p>
34 </view> 36 </view>
35 <view class="item" style="margin-right: 0;" @click="goRot('/pages/subPages/more?val=1')"> 37 <view class="item" style="margin-right: 0;" @click="goRot('/pages/subPages/more?val=1')">
@@ -192,26 +194,66 @@ @@ -192,26 +194,66 @@
192 194
193 <style scoped lang="scss"> 195 <style scoped lang="scss">
194 .top { 196 .top {
195 - padding-top: 200rpx;  
196 height: 300rpx; 197 height: 300rpx;
  198 + background: linear-gradient(180deg, #d0e3ef 0%, #e0eaf2 100%);
  199 +
  200 + .searchcity {
  201 + display: flex;
  202 + align-items: center;
  203 + width: 466rpx;
  204 + height: 80rpx;
  205 + border-radius: 48rpx;
  206 + opacity: 1;
  207 + border: 1rpx solid #c1ddedff;
  208 + background: #ffffffff;
  209 + padding: 32rpx 24rpx;
  210 + box-sizing: border-box;
  211 +
  212 + .city {
  213 + color: #000000e6;
  214 + font-size: 26rpx;
  215 + font-weight: 400;
  216 + }
  217 +
  218 + .img1 {
  219 + margin-left: 4rpx;
  220 + width: 32rpx;
  221 + height: 32rpx;
  222 + }
  223 +
  224 + .searchline {
  225 + opacity: 0.6;
  226 + margin:0 10rpx;
  227 + }
  228 +
  229 + .img2 {
  230 + margin-left: 4rpx;
  231 + margin-top: 4rpx;
  232 + width: 40rpx;
  233 + height: 40rpx;
  234 + }
  235 + input{
  236 + margin-top: 4rpx;
  237 + flex:1;
  238 + margin-left: 16rpx;
  239 + }
  240 + }
197 } 241 }
198 242
199 .nevbg { 243 .nevbg {
200 position: fixed; 244 position: fixed;
201 - height: 196rpx; 245 + height: 186rpx;
202 width: 100%; 246 width: 100%;
203 z-index: 99; 247 z-index: 99;
204 - height: 224rpx;  
205 opacity: 1; 248 opacity: 1;
206 overflow: hidden; 249 overflow: hidden;
207 - // background: linear-gradient(180deg, #ffffff4a 0%, #ffffff12 100%); 250 + background: linear-gradient(180deg, #cde2ef 0%, #d0e3ef 100%);
208 } 251 }
209 252
210 .back { 253 .back {
211 position: fixed; 254 position: fixed;
212 display: flex; 255 display: flex;
213 align-items: center; 256 align-items: center;
214 - justify-content: center;  
215 z-index: 999; 257 z-index: 999;
216 width: 100%; 258 width: 100%;
217 259
@@ -225,11 +267,12 @@ @@ -225,11 +267,12 @@
225 } 267 }
226 268
227 text { 269 text {
228 - color: #ffffffff;  
229 - font-size: 32rpx;  
230 - font-weight: 500;  
231 - font-family: "PingFang SC";  
232 - text-align: center; 270 + margin-left: 32rpx;
  271 + color: #000000e6;
  272 + font-size: 48rpx;
  273 + font-weight: 700;
  274 + text-align: left;
  275 + font-family: "Alibaba PuHuiTi";
233 } 276 }
234 } 277 }
235 278
@@ -324,6 +367,16 @@ @@ -324,6 +367,16 @@
324 } 367 }
325 368
326 .item { 369 .item {
  370 + .imgbtn{
  371 + width: 104rpx;
  372 + height: 104rpx;
  373 + border-radius: 16rpx;
  374 + background-color: #ffffff;
  375 + .img {
  376 + width: 104rpx;
  377 + height: 104rpx;
  378 + }
  379 + }
327 .img { 380 .img {
328 width: 104rpx; 381 width: 104rpx;
329 height: 104rpx; 382 height: 104rpx;
@@ -363,6 +416,12 @@ @@ -363,6 +416,12 @@
363 416
364 .activeBox { 417 .activeBox {
365 background: url("/static/image/Rectangle 38.png"); 418 background: url("/static/image/Rectangle 38.png");
  419 + .title{
  420 + color: #3375D8;
  421 + }
  422 + .tip{
  423 + color: #3375D8;
  424 + }
366 } 425 }
367 426
368 .right { 427 .right {