miniprogram / shop · 提交

转到一个项目

作者 cuiyuan
提交 2bbdbc9839714cf698ea0921965b8b8248918528 1 个父辈 4548c23e

update

内嵌 并排对比
正在显示 20 个修改的文件 包含 1810 行增加 和 14 行删除
1 { 1 {
2 "pages": [ 2 "pages": [
  3 + "pages/homeindex/result/result",
  4 + "pages/homeindex/search/search",
  5 + "pages/index/index",
  6 + "pages/kind/kind",
  7 + "pages/mine/mine",
  8 + "pages/homeindex/homeindex",
3 "pages/kind/detail_1/detail_1", 9 "pages/kind/detail_1/detail_1",
4 "pages/kind/firm_order2/firm_order2", 10 "pages/kind/firm_order2/firm_order2",
5 "pages/kind/firm_order1/firm_order1", 11 "pages/kind/firm_order1/firm_order1",
6 "pages/kind/success/success", 12 "pages/kind/success/success",
7 - "pages/kind/kind",  
8 "pages/mine/contactUs/contactUs", 13 "pages/mine/contactUs/contactUs",
9 "pages/mine/eOrder/eOrder", 14 "pages/mine/eOrder/eOrder",
10 "pages/mine/myOrder/myOrder", 15 "pages/mine/myOrder/myOrder",
11 "pages/mine/addr_2/addr_2", 16 "pages/mine/addr_2/addr_2",
12 "pages/mine/addr_1/addr_1", 17 "pages/mine/addr_1/addr_1",
13 - "pages/homeindex/homeindex",  
14 - "pages/index/index",  
15 "pages/logs/logs", 18 "pages/logs/logs",
16 - "pages/mine/mine",  
17 "pages/mine/collect/collect" 19 "pages/mine/collect/collect"
  20 +
18 ], 21 ],
19 "window": { 22 "window": {
20 "backgroundTextStyle": "light", 23 "backgroundTextStyle": "light",

562 字节
1 { 1 {
2 - "navigationBarTitleText": "首页" 2 + "navigationBarTitleText": "首页",
  3 + "navigationBarBackgroundColor": "#6EAC3D",
  4 + "navigationBarTextStyle": "white"
3 } 5 }
1 <!--pages/homeindex/homeindex.wxml--> 1 <!--pages/homeindex/homeindex.wxml-->
2 -<text>pages/homeindex/homeindex.wxml</text> 2 +<!-- <text>pages/homeindex/homeindex.wxml</text> -->
  3 +
  4 +<view class='search'>
  5 + <view class='search_inp'>
  6 + <input type='text' placeholder='请输入商品名称'></input>
  7 + <image src='../../img/search.png'></image>
  8 + </view>
  9 + <view class='search_txt'>
  10 + 搜索
  11 + </view>
  12 +</view>
  13 +<view class='banner'>
  14 + <swiper indicator-dots="true" indicator-active-color="#fff" style="width:100%;height:100%;">
  15 + <swiper-item>
  16 + <image style="width: 688px; height: 336px; " mode='widthFix' src='../../img/蒙版组 33@2x.png'></image>
  17 + </swiper-item>
  18 + <swiper-item>
  19 + <image style="width: 688px; height: 336px; " src='../../img/蒙版组 33@2x.png'></image>
  20 + </swiper-item>
  21 + </swiper>
  22 + <view class='banner_Mask'></view>
  23 +</view>
  24 +<view class='commodity'>
  25 + <view class='jujia'>
  26 + <image src='../../img/jujia@3x.png'></image>
  27 + <text>居家用品</text>
  28 + </view>
  29 + <view class='riyong'>
  30 + <image src='../../img/riyongsahngpin@3x.png'></image>
  31 + <text>日用商品</text>
  32 + </view>
  33 + <view class='shuam'>
  34 + <image src='../../img/shuma@3x.png'></image>
  35 + <text>数码商品</text>
  36 + </view>
  37 + <view class='fenlei'>
  38 + <image src='../../img/fenlei@3x.png'></image>
  39 + <text>全部分类</text>
  40 + </view>
  41 +</view>
  42 +<view class='introduce'>
  43 + <view class='introduce_list'>
  44 + <view class='introduce_item'>
  45 + <image src='../../img/anquan@3x.png'></image>
  46 + <text>安心检测</text>
  47 + </view>
  48 + <view class='introduce_item'>
  49 + <image src='../../img/youxuan@3x.png'></image>
  50 + <text>优选源头</text>
  51 + </view>
  52 + <view class='introduce_item'>
  53 + <image src='../../img/baozhang@3x.png'></image>
  54 + <text>赔付保障</text>
  55 + </view>
  56 + </view>
  57 + <image src='../../img/20190311140242.png'></image>
  58 +</view>
  59 +<view class='container'>
  60 + <view class='mid'>
  61 + <view class='mid_item'>
  62 + <!-- 顶部 -->
  63 + <view class='mid_item_top'>
  64 + <!-- 左边 -->
  65 + <view class='mid_item_top_left'>
  66 + <view class='top_left_pic'>
  67 + <image src='../../../img/goods_1.png'></image>
  68 + </view>
  69 + <view class='top_left_text'>
  70 + 距结束23时59分距结束23时59分
  71 + </view>
  72 + </view>
  73 + <!-- 右边 -->
  74 + <view class='mid_item_top_right'>
  75 + <!-- 右上 -->
  76 + <view class='right_top'>
  77 + <view class='right_top_lef'>
  78 + 纯进口有机菜花
  79 + </view>
  80 + <view class='right_top_rig'>
  81 + 产地：智利
  82 + </view>
  83 + </view>
  84 + <!-- 右中1 -->
  85 + <view class='right_mid'>
  86 + <view class='right_mid_lef'>
  87 + <view class='right_mid_lef_color'></view>
  88 + </view>
  89 + <view class='right_mid_rig'>
  90 + 42%
  91 + </view>
  92 + </view>
  93 + <!-- 右中2 -->
  94 + <view class='right_text'>
  95 + 已拼300份，目标500份
  96 + </view>
  97 + <!-- 右下 -->
  98 + <view class='right_bottom'>
  99 + <!-- 右下左 -->
  100 + <view class='right_bottom_lef'>
  101 + <span class='RBM'>￥</span>
  102 + <span class='number'>52/</span>
  103 + <span class='text'>1磅1份1磅1份</span>
  104 + </view>
  105 + <!-- 右下中 -->
  106 + <view class='right_bottom_mid'>
  107 + <view class='right_bottom_mid_t'>
  108 + 40mm-50m
  109 + </view>
  110 + <view class='right_bottom_mid_b'>
  111 + 番茄果径番茄果径番茄果径
  112 + </view>
  113 + </view>
  114 + <!-- 右下右 -->
  115 + <view class='right_bottom_rig'>
  116 + 立即参团
  117 + </view>
  118 + </view>
  119 + </view>
  120 +
  121 +
  122 + </view>
  123 + <view class='mid_item_bottom'>
  124 + <view class='mid_item_bottom_left'>
  125 + 经典推荐
  126 + </view>
  127 + <!-- 竖线 -->
  128 + <view class='mid_line'></view>
  129 + <!-- 底部文本 -->
  130 + <view class='mid_item_bottom_bot'>
  131 + 智利进口，绿色健康，硕大饱满
  132 + </view>
  133 + </view>
  134 + </view>
  135 +
  136 + <view class='mid_item'>
  137 + <!-- 顶部 -->
  138 + <view class='mid_item_top'>
  139 + <!-- 左边 -->
  140 + <view class='mid_item_top_left'>
  141 + <view class='top_left_pic'>
  142 + <image src='../../../img/goods_1.png'></image>
  143 + </view>
  144 + <view class='text_color'>
  145 + 距结束2时22分距结束2时22分
  146 + </view>
  147 + </view>
  148 + <!-- 右边 -->
  149 + <view class='mid_item_top_right'>
  150 + <!-- 右上 -->
  151 + <view class='right_top'>
  152 + <view class='right_top_lef'>
  153 + 纯进口有机菜花
  154 + </view>
  155 + <view class='right_top_rig'>
  156 + 产地：罗利
  157 + </view>
  158 + </view>
  159 + <!-- 右中1 -->
  160 + <view class='right_mid'>
  161 + <view class='right_mid_lef'>
  162 + <view class='right_mid_lef_color'></view>
  163 + </view>
  164 + <view class='right_mid_rig'>
  165 + 42%
  166 + </view>
  167 + </view>
  168 + <!-- 右中2 -->
  169 + <view class='right_text'>
  170 + 已拼300份，目标500份
  171 + </view>
  172 + <!-- 右下 -->
  173 + <view class='right_bottom'>
  174 + <!-- 右下左 -->
  175 + <view class='right_bottom_lef'>
  176 + <span class='RBM'>￥</span>
  177 + <span class='number'>52/</span>
  178 + <span class='text'>1磅1份1磅1份</span>
  179 +
  180 + </view>
  181 + <!-- 右下中 -->
  182 + <view class='right_bottom_mid'>
  183 + <view class='right_bottom_mid_t'>
  184 + 40mm-50m
  185 + </view>
  186 + <view class='right_bottom_mid_b'>
  187 + 番茄果径 番茄果径番茄果径
  188 + </view>
  189 + </view>
  190 + <!-- 右下右 -->
  191 + <view class='right_bottom_rig'>
  192 + 立即参团
  193 + </view>
  194 + </view>
  195 + </view>
  196 +
  197 +
  198 + </view>
  199 + <view class='mid_item_bottom'>
  200 + <view class='mid_item_bottom_left'>
  201 + 经典推荐
  202 + </view>
  203 + <!-- 竖线 -->
  204 + <view class='mid_line'></view>
  205 + <!-- 底部文本 -->
  206 + <view class='mid_item_bottom_bot'>
  207 + 智利进口，绿色健康，硕大饱满
  208 + </view>
  209 + </view>
  210 + </view>
  211 + </view>
  212 +</view>
  213 +
3 214
4 215
1 /* pages/homeindex/homeindex.wxss */ 1 /* pages/homeindex/homeindex.wxss */
  2 +.search{
  3 + padding: 16rpx 32rpx;
  4 + height: 64rpx;
  5 + background: #6EAC3D;
  6 + display: flex;
  7 + justify-content: center;
  8 + align-content: space-between;
  9 +}
  10 +.search_inp{
  11 + box-sizing: border-box;
  12 + width: 608rpx;
  13 + height: 64rpx;
  14 + border-radius: 32rpx;
  15 + display:flex;
  16 + align-items: center;
  17 + padding-left: 76rpx;
  18 + padding-right: 32rpx;
  19 + background:#fff;
  20 + border: 0;
  21 + outline: none;
  22 + font-size: 26rpx;
  23 + position: relative;
  24 +}
  25 +.search_inp input{
  26 + width: 100%;
  27 +}
  28 +.search_inp image{
  29 + position: absolute;
  30 + left: 32rpx;
  31 + width: 32rpx;
  32 + height: 32rpx;
  33 +}
  34 +.search_txt{
  35 + height: 64rpx;
  36 + font-size: 30rpx;
  37 + color: #fff;
  38 + line-height: 64rpx;
  39 + padding-left: 16rpx;
  40 +}
  41 +.banner{
  42 + width: 688rpx;
  43 + height: 336rpx;
  44 + margin: 0 auto;
  45 + margin-top: 48rpx;
  46 + position: relative;
  47 + border-radius: 8rpx;
  48 +}
  49 +.swiper{
  50 + height: 100%;
  51 + position: absolute;
  52 + z-index: 99;
  53 +}
  54 +.swiper-item{
  55 + width: 688rpx;
  56 + margin: 0 auto;
  57 + height: 336rpx;
  58 + border-radius: 8rpx;
  59 +}
  60 +.swiper-item image{
  61 + height: auto;
  62 +}
  63 +.banner_Mask{
  64 + width:656rpx;
  65 + height: 336rpx;
  66 + background:rgba(181,222,150,1);
  67 + box-shadow:0rpx 6rpx 40rpx rgba(93,255,0,0.44);
  68 + opacity:0.3;
  69 + position: absolute;
  70 + bottom: 16rpx;
  71 + z-index: -1;
  72 + left: 16rpx;
  73 + border-radius: 8rpx;
  74 +}
  75 +.commodity{
  76 + width: 688rpx;
  77 + /* margin: 0 auto; */
  78 + padding: 64rpx 32rpx;
  79 + display: flex;
  80 + justify-content:space-around;
  81 + align-items: center;
  82 + font-size: 24rpx;
  83 + color: #333333;
  84 + border-bottom: 8px solid rgba(249,250,252,1);
  85 +}
  86 +.commodity view{
  87 +}
  88 +.introduce_list {
  89 + display: flex;
  90 + justify-content: space-around;
  91 + align-items: center;
  92 + padding: 36rpx 32rpx 48rpx 32rpx;
  93 +}
  94 +.introduce_list .introduce_item{
  95 + display: flex;
  96 + justify-content: space-between;
  97 + align-items: center;
  98 +}
  99 +.introduce_list .introduce_item:first-child image{
  100 + width: 32rpx;
  101 + height: 36rpx;
  102 +}
  103 +.introduce_list .introduce_item:nth-child(2) image{
  104 + width: 36rpx;
  105 + height: 31rpx;
  106 +}
  107 +.introduce_list .introduce_item:nth-child(3) image{
  108 + width: 32rpx;
  109 + height: 29rpx;
  110 +}
  111 +.introduce_list .introduce_item text{
  112 + font-size: 28rpx;
  113 + display: flex;
  114 + align-items: center;
  115 + margin-left: 16rpx;
  116 +}
  117 +.introduce image{
  118 + width: 668rpx;
  119 + height: 208rpx;
  120 + display: block;
  121 + margin: 0 auto;
  122 +}
  123 +.commodity image{
  124 + display: flex;
  125 + width: 112rpx;
  126 + height: 112rpx;
  127 + margin: 0 auto;
  128 +}
  129 +.commodity text{
  130 + display: flex;
  131 + margin-top: 14rpx;
  132 + text-align: center;
  133 + justify-content: center;
  134 + align-items: center;
  135 +}
  136 +
  137 +.container{
  138 + width: 750rpx;
  139 + display: flex;
  140 + align-items: center;
  141 + flex-flow: column;
  142 +}
  143 +.mid{
  144 + margin-top: 16rpx;
  145 + display: flex;
  146 + flex-flow: column;
  147 +}
  148 +.mid_item{
  149 + margin-top: 16rpx;
  150 + width:688rpx;
  151 + /* height:400rpx; */
  152 + background:rgba(249,250,252,1);
  153 + opacity:1;
  154 + border-radius:8rpx;
  155 + display: flex;
  156 + align-items: center;
  157 + flex-flow: column;
  158 + box-sizing: border-box;
  159 + padding: 52rpx 16rpx 48rpx;
  160 +}
  161 +.mid_item_top{
  162 + display: flex;
  163 + width: 100%;
  164 +}
  165 +.mid_item_top_left{
  166 + width:208rpx;
  167 + height:208rpx;
  168 + /* background:rgba(250,250,250,1); */
  169 + opacity:1;
  170 + display: flex;
  171 + flex-flow: column;
  172 +}
  173 +.top_left_pic{
  174 + width: 208rpx;
  175 + height: 160rpx;
  176 + display: flex;
  177 +}
  178 +.top_left_pic image{
  179 + width: 100%;
  180 + height: 100%;
  181 +}
  182 +.top_left_text{
  183 + width: 202rpx;
  184 + height:48rpx;
  185 + background:rgba(251,4,4,1);
  186 + opacity:0.2;
  187 + text-align: center;
  188 + font-size:24rpx;
  189 + font-family:PingFang SC;
  190 + font-weight:400;
  191 + line-height:48rpx;
  192 + color:rgba(255,255,255,1);
  193 +
  194 + overflow: hidden;
  195 + text-overflow: ellipsis;
  196 + white-space: nowrap;
  197 +}
  198 +.mid_item_top_right{
  199 + width: 100%;
  200 + margin-left: 14rpx;
  201 +}
  202 +.right_top{
  203 + display: flex;
  204 + align-items: center;
  205 + justify-content: space-between;
  206 + margin-top: 20rpx;
  207 +}
  208 +.right_top_lef{
  209 + width: 270rpx;
  210 + font-size:32rpx;
  211 + font-family:PingFang SC;
  212 + font-weight:600;
  213 + color:rgba(51,51,51,1);
  214 + opacity:1;
  215 + overflow: hidden;
  216 + text-overflow: ellipsis;
  217 + white-space: nowrap;
  218 +}
  219 +.right_top_rig{
  220 + font-size:22rpx;
  221 + font-family:PingFang SC;
  222 + font-weight:400;
  223 + line-height:32rpx;
  224 + color:rgba(204,204,204,1);
  225 + opacity:1;
  226 +}
  227 +.right_mid{
  228 + margin-top: 16rpx;
  229 + display: flex;
  230 + align-items: center;
  231 +}
  232 +.right_mid_lef{
  233 + width:288rpx;
  234 + height:16rpx;
  235 + background:rgba(236,236,236,1);
  236 + opacity:1;
  237 + border-radius:8rpx;
  238 +}
  239 +.right_mid_lef_color{
  240 + width:206rpx;
  241 + height:16rpx;
  242 + background:rgba(181,222,150,1);
  243 + opacity:1;
  244 + border-radius:8rpx;
  245 +}
  246 +.right_mid_rig{
  247 + margin-left: 16rpx;
  248 + font-size:24rpx;
  249 + font-family:PingFang SC;
  250 + font-weight:400;
  251 + line-height:34rpx;
  252 + color:rgba(181,222,150,1);
  253 + opacity:1;
  254 +}
  255 +.right_text{
  256 + margin-top: 14rpx;
  257 + font-size:22rpx;
  258 + font-family:PingFang SC;
  259 + font-weight:400;
  260 + color:rgba(204,204,204,1);
  261 + opacity:1;
  262 +}
  263 +.right_bottom{
  264 + display: flex;
  265 + align-items: center;
  266 + justify-content: space-between;
  267 +}
  268 +.RBM{
  269 + font-size: 22rpx;
  270 + color: #ff0000;
  271 +}
  272 +.number{
  273 + font-size: 30rpx;
  274 + color: #ff0000;
  275 +}
  276 +.text{
  277 +
  278 + font-size:22rpx;
  279 + font-family:PingFang SC;
  280 + font-weight:400;
  281 + line-height:32rpx;
  282 + color:rgba(204,204,204,1);
  283 + opacity:1;
  284 +}
  285 +.right_bottom_mid{
  286 + width: 122rpx;
  287 +}
  288 +.right_bottom_mid_t{
  289 +
  290 + font-size:22rpx;
  291 + font-family:PingFang SC;
  292 + font-weight:400;
  293 + color:rgba(51,51,51,1);
  294 + opacity:1;
  295 +
  296 + overflow: hidden;
  297 + text-overflow: ellipsis;
  298 + white-space: nowrap;
  299 +
  300 +}
  301 +.right_bottom_mid_b{
  302 + font-size:18rpx;
  303 + font-family:PingFang SC;
  304 + font-weight:400;
  305 + color:rgba(153,153,153,1);
  306 + opacity:1;
  307 +
  308 + overflow: hidden;
  309 + text-overflow: ellipsis;
  310 + white-space: nowrap;
  311 +}
  312 +.right_bottom_rig{
  313 + width:144rpx;
  314 + height:48rpx;
  315 + line-height: 48rpx;
  316 + background:rgba(249,150,20,1);
  317 + box-shadow:0rpx 2rpx 12rpx rgba(255,145,0,0.16);
  318 + opacity:1;
  319 + border-radius:24rpx;
  320 +
  321 + text-align: center;
  322 + font-size:26rpx;
  323 + font-family:PingFang SC;
  324 + font-weight:400;
  325 + color:rgba(255,255,255,1);
  326 +}
  327 +.mid_item_bottom{
  328 + margin-top: 32rpx;
  329 + width:640rpx;
  330 + height:80rpx;
  331 + background:rgba(181,222,150,0.1);
  332 + border-radius:16rpx;
  333 + display: flex;
  334 + align-items: center;
  335 + box-sizing: border-box;
  336 + padding: 0 32rpx;
  337 +}
  338 +.mid_item_bottom_left{
  339 + font-size:30rpx;
  340 + font-family:汉真广标;
  341 + font-weight:400;
  342 + color:rgba(110,172,61,1);
  343 + opacity:1;
  344 +
  345 +}
  346 +.mid_line{
  347 + margin: 0 36rpx;
  348 + width:2rpx;
  349 + height:60rpx;
  350 + background:rgba(181,222,150,1);
  351 + opacity:1;
  352 + border-radius:4rpx;
  353 +}
  354 +.mid_item_bottom_bot{
  355 + font-size:24rpx;
  356 + font-family:PingFang SC;
  357 + font-weight:400;
  358 + color:rgba(153,153,153,1);
  359 + opacity:1;
  360 + overflow: hidden;
  361 + text-overflow: ellipsis;
  362 + white-space: nowrap;
  363 +}
  364 +.text_color{
  365 + width:202rpx;
  366 + height:48rpx;
  367 + line-height: 48rpx;
  368 + text-align: center;
  369 + background:rgba(204,204,204,0.7);
  370 + font-size:24rpx;
  371 + font-family:PingFang SC;
  372 + font-weight:400;
  373 + color:rgba(255,255,255,1);
  374 + opacity:1;
  375 + overflow: hidden;
  376 + text-overflow: ellipsis;
  377 + white-space: nowrap;
  378 +}
  379 +.right_bottom_lef{
  380 + width: 140rpx;
  381 + overflow: hidden;
  382 + text-overflow: ellipsis;
  383 + white-space: nowrap;
  384 +}
  1 +// pages/homeindex/result/result.js
  2 +Page({
  3 +
  4 + /**
  5 + * 页面的初始数据
  6 + */
  7 + data: {
  8 +
  9 + },
  10 +
  11 + /**
  12 + * 生命周期函数--监听页面加载
  13 + */
  14 + onLoad: function (options) {
  15 +
  16 + },
  17 +
  18 + /**
  19 + * 生命周期函数--监听页面初次渲染完成
  20 + */
  21 + onReady: function () {
  22 +
  23 + },
  24 +
  25 + /**
  26 + * 生命周期函数--监听页面显示
  27 + */
  28 + onShow: function () {
  29 +
  30 + },
  31 +
  32 + /**
  33 + * 生命周期函数--监听页面隐藏
  34 + */
  35 + onHide: function () {
  36 +
  37 + },
  38 +
  39 + /**
  40 + * 生命周期函数--监听页面卸载
  41 + */
  42 + onUnload: function () {
  43 +
  44 + },
  45 +
  46 + /**
  47 + * 页面相关事件处理函数--监听用户下拉动作
  48 + */
  49 + onPullDownRefresh: function () {
  50 +
  51 + },
  52 +
  53 + /**
  54 + * 页面上拉触底事件的处理函数
  55 + */
  56 + onReachBottom: function () {
  57 +
  58 + },
  59 +
  60 + /**
  61 + * 用户点击右上角分享
  62 + */
  63 + onShareAppMessage: function () {
  64 +
  65 + }
  66 +})
  1 +{
  2 + "usingComponents": {}
  3 +}
  1 +<!--pages/homeindex/result/result.wxml-->
  2 +<!-- <text>pages/homeindex/result/result.wxml</text> -->
  3 +<view class='search'>
  4 + <view class='search_inp'>
  5 + <input type='text' placeholder='请输入商品名称'></input>
  6 + <image src='../../../img/search.png'></image>
  7 + </view>
  8 + <view class='search_txt'>
  9 + 取消
  10 + </view>
  11 +</view>
  12 +
  13 +<view class='container'>
  14 + <view class='mid'>
  15 + <view class='mid_item'>
  16 + <!-- 顶部 -->
  17 + <view class='mid_item_top'>
  18 + <!-- 左边 -->
  19 + <view class='mid_item_top_left'>
  20 + <view class='top_left_pic'>
  21 + <image src='../../../img/goods_1.png'></image>
  22 + </view>
  23 + <view class='top_left_text'>
  24 + 距结束23时59分距结束23时59分
  25 + </view>
  26 + </view>
  27 + <!-- 右边 -->
  28 + <view class='mid_item_top_right'>
  29 + <!-- 右上 -->
  30 + <view class='right_top'>
  31 + <view class='right_top_lef'>
  32 + 纯进口有机菜花
  33 + </view>
  34 + <view class='right_top_rig'>
  35 + 产地：智利
  36 + </view>
  37 + </view>
  38 + <!-- 右中1 -->
  39 + <view class='right_mid'>
  40 + <view class='right_mid_lef'>
  41 + <view class='right_mid_lef_color'></view>
  42 + </view>
  43 + <view class='right_mid_rig'>
  44 + 42%
  45 + </view>
  46 + </view>
  47 + <!-- 右中2 -->
  48 + <view class='right_text'>
  49 + 已拼300份，目标500份
  50 + </view>
  51 + <!-- 右下 -->
  52 + <view class='right_bottom'>
  53 + <!-- 右下左 -->
  54 + <view class='right_bottom_lef'>
  55 + <span class='RBM'>￥</span>
  56 + <span class='number'>52/</span>
  57 + <span class='text'>1磅1份1磅1份</span>
  58 + </view>
  59 + <!-- 右下中 -->
  60 + <view class='right_bottom_mid'>
  61 + <view class='right_bottom_mid_t'>
  62 + 40mm-50m
  63 + </view>
  64 + <view class='right_bottom_mid_b'>
  65 + 番茄果径番茄果径番茄果径
  66 + </view>
  67 + </view>
  68 + <!-- 右下右 -->
  69 + <view class='right_bottom_rig'>
  70 + 立即参团
  71 + </view>
  72 + </view>
  73 + </view>
  74 +
  75 +
  76 + </view>
  77 + <view class='mid_item_bottom'>
  78 + <view class='mid_item_bottom_left'>
  79 + 经典推荐
  80 + </view>
  81 + <!-- 竖线 -->
  82 + <view class='mid_line'></view>
  83 + <!-- 底部文本 -->
  84 + <view class='mid_item_bottom_bot'>
  85 + 智利进口，绿色健康，硕大饱满
  86 + </view>
  87 + </view>
  88 + </view>
  89 +
  90 + <view class='mid_item'>
  91 + <!-- 顶部 -->
  92 + <view class='mid_item_top'>
  93 + <!-- 左边 -->
  94 + <view class='mid_item_top_left'>
  95 + <view class='top_left_pic'>
  96 + <image src='../../../img/goods_1.png'></image>
  97 + </view>
  98 + <view class='text_color'>
  99 + 距结束2时22分距结束2时22分
  100 + </view>
  101 + </view>
  102 + <!-- 右边 -->
  103 + <view class='mid_item_top_right'>
  104 + <!-- 右上 -->
  105 + <view class='right_top'>
  106 + <view class='right_top_lef'>
  107 + 纯进口有机菜花
  108 + </view>
  109 + <view class='right_top_rig'>
  110 + 产地：罗利
  111 + </view>
  112 + </view>
  113 + <!-- 右中1 -->
  114 + <view class='right_mid'>
  115 + <view class='right_mid_lef'>
  116 + <view class='right_mid_lef_color'></view>
  117 + </view>
  118 + <view class='right_mid_rig'>
  119 + 42%
  120 + </view>
  121 + </view>
  122 + <!-- 右中2 -->
  123 + <view class='right_text'>
  124 + 已拼300份，目标500份
  125 + </view>
  126 + <!-- 右下 -->
  127 + <view class='right_bottom'>
  128 + <!-- 右下左 -->
  129 + <view class='right_bottom_lef'>
  130 + <span class='RBM'>￥</span>
  131 + <span class='number'>52/</span>
  132 + <span class='text'>1磅1份1磅1份</span>
  133 +
  134 + </view>
  135 + <!-- 右下中 -->
  136 + <view class='right_bottom_mid'>
  137 + <view class='right_bottom_mid_t'>
  138 + 40mm-50m
  139 + </view>
  140 + <view class='right_bottom_mid_b'>
  141 + 番茄果径 番茄果径番茄果径
  142 + </view>
  143 + </view>
  144 + <!-- 右下右 -->
  145 + <view class='right_bottom_rig'>
  146 + 立即参团
  147 + </view>
  148 + </view>
  149 + </view>
  150 +
  151 +
  152 + </view>
  153 + <view class='mid_item_bottom'>
  154 + <view class='mid_item_bottom_left'>
  155 + 经典推荐
  156 + </view>
  157 + <!-- 竖线 -->
  158 + <view class='mid_line'></view>
  159 + <!-- 底部文本 -->
  160 + <view class='mid_item_bottom_bot'>
  161 + 智利进口，绿色健康，硕大饱满
  162 + </view>
  163 + </view>
  164 + </view>
  165 + </view>
  166 +</view>
  1 +/* pages/homeindex/result/result.wxss */
  2 +.search{
  3 + padding: 16rpx 32rpx;
  4 + height: 64rpx;
  5 + background: #6EAC3D;
  6 + display: flex;
  7 + justify-content: center;
  8 + align-content: space-between;
  9 +}
  10 +.search_inp{
  11 + box-sizing: border-box;
  12 + width: 608rpx;
  13 + height: 64rpx;
  14 + border-radius: 32rpx;
  15 + display:flex;
  16 + align-items: center;
  17 + padding-left: 76rpx;
  18 + padding-right: 32rpx;
  19 + background:#fff;
  20 + border: 0;
  21 + outline: none;
  22 + font-size: 26rpx;
  23 + position: relative;
  24 +}
  25 +.search_inp input{
  26 + width: 100%;
  27 +}
  28 +.search_inp image{
  29 + position: absolute;
  30 + left: 32rpx;
  31 + width: 32rpx;
  32 + height: 32rpx;
  33 +}
  34 +.search_txt{
  35 + height: 64rpx;
  36 + font-size: 30rpx;
  37 + color: #fff;
  38 + line-height: 64rpx;
  39 + padding-left: 16rpx;
  40 +}
  41 +.container{
  42 + width: 750rpx;
  43 + display: flex;
  44 + align-items: center;
  45 + flex-flow: column;
  46 +}
  47 +.mid{
  48 + margin-top: 16rpx;
  49 + display: flex;
  50 + flex-flow: column;
  51 +}
  52 +.mid_item{
  53 + margin-top: 16rpx;
  54 + width:688rpx;
  55 + /* height:400rpx; */
  56 + background:rgba(249,250,252,1);
  57 + opacity:1;
  58 + border-radius:8rpx;
  59 + display: flex;
  60 + align-items: center;
  61 + flex-flow: column;
  62 + box-sizing: border-box;
  63 + padding: 52rpx 16rpx 48rpx;
  64 +}
  65 +.mid_item_top{
  66 + display: flex;
  67 + width: 100%;
  68 +}
  69 +.mid_item_top_left{
  70 + width:208rpx;
  71 + height:208rpx;
  72 + /* background:rgba(250,250,250,1); */
  73 + opacity:1;
  74 + display: flex;
  75 + flex-flow: column;
  76 +}
  77 +.top_left_pic{
  78 + width: 208rpx;
  79 + height: 160rpx;
  80 + display: flex;
  81 +}
  82 +.top_left_pic image{
  83 + width: 100%;
  84 + height: 100%;
  85 +}
  86 +.top_left_text{
  87 + width: 202rpx;
  88 + height:48rpx;
  89 + background:rgba(251,4,4,1);
  90 + opacity:0.2;
  91 + text-align: center;
  92 + font-size:24rpx;
  93 + font-family:PingFang SC;
  94 + font-weight:400;
  95 + line-height:48rpx;
  96 + color:rgba(255,255,255,1);
  97 +
  98 + overflow: hidden;
  99 + text-overflow: ellipsis;
  100 + white-space: nowrap;
  101 +}
  102 +.mid_item_top_right{
  103 + width: 100%;
  104 + margin-left: 14rpx;
  105 +}
  106 +.right_top{
  107 + display: flex;
  108 + align-items: center;
  109 + justify-content: space-between;
  110 + margin-top: 20rpx;
  111 +}
  112 +.right_top_lef{
  113 + width: 270rpx;
  114 + font-size:32rpx;
  115 + font-family:PingFang SC;
  116 + font-weight:600;
  117 + color:rgba(51,51,51,1);
  118 + opacity:1;
  119 + overflow: hidden;
  120 + text-overflow: ellipsis;
  121 + white-space: nowrap;
  122 +}
  123 +.right_top_rig{
  124 + font-size:22rpx;
  125 + font-family:PingFang SC;
  126 + font-weight:400;
  127 + line-height:32rpx;
  128 + color:rgba(204,204,204,1);
  129 + opacity:1;
  130 +}
  131 +.right_mid{
  132 + margin-top: 16rpx;
  133 + display: flex;
  134 + align-items: center;
  135 +}
  136 +.right_mid_lef{
  137 + width:288rpx;
  138 + height:16rpx;
  139 + background:rgba(236,236,236,1);
  140 + opacity:1;
  141 + border-radius:8rpx;
  142 +}
  143 +.right_mid_lef_color{
  144 + width:206rpx;
  145 + height:16rpx;
  146 + background:rgba(181,222,150,1);
  147 + opacity:1;
  148 + border-radius:8rpx;
  149 +}
  150 +.right_mid_rig{
  151 + margin-left: 16rpx;
  152 + font-size:24rpx;
  153 + font-family:PingFang SC;
  154 + font-weight:400;
  155 + line-height:34rpx;
  156 + color:rgba(181,222,150,1);
  157 + opacity:1;
  158 +}
  159 +.right_text{
  160 + margin-top: 14rpx;
  161 + font-size:22rpx;
  162 + font-family:PingFang SC;
  163 + font-weight:400;
  164 + color:rgba(204,204,204,1);
  165 + opacity:1;
  166 +}
  167 +.right_bottom{
  168 + display: flex;
  169 + align-items: center;
  170 + justify-content: space-between;
  171 +}
  172 +.RBM{
  173 + font-size: 22rpx;
  174 + color: #ff0000;
  175 +}
  176 +.number{
  177 + font-size: 30rpx;
  178 + color: #ff0000;
  179 +}
  180 +.text{
  181 +
  182 + font-size:22rpx;
  183 + font-family:PingFang SC;
  184 + font-weight:400;
  185 + line-height:32rpx;
  186 + color:rgba(204,204,204,1);
  187 + opacity:1;
  188 +}
  189 +.right_bottom_mid{
  190 + width: 122rpx;
  191 +}
  192 +.right_bottom_mid_t{
  193 +
  194 + font-size:22rpx;
  195 + font-family:PingFang SC;
  196 + font-weight:400;
  197 + color:rgba(51,51,51,1);
  198 + opacity:1;
  199 +
  200 + overflow: hidden;
  201 + text-overflow: ellipsis;
  202 + white-space: nowrap;
  203 +
  204 +}
  205 +.right_bottom_mid_b{
  206 + font-size:18rpx;
  207 + font-family:PingFang SC;
  208 + font-weight:400;
  209 + color:rgba(153,153,153,1);
  210 + opacity:1;
  211 +
  212 + overflow: hidden;
  213 + text-overflow: ellipsis;
  214 + white-space: nowrap;
  215 +}
  216 +.right_bottom_rig{
  217 + width:144rpx;
  218 + height:48rpx;
  219 + line-height: 48rpx;
  220 + background:rgba(249,150,20,1);
  221 + box-shadow:0rpx 2rpx 12rpx rgba(255,145,0,0.16);
  222 + opacity:1;
  223 + border-radius:24rpx;
  224 +
  225 + text-align: center;
  226 + font-size:26rpx;
  227 + font-family:PingFang SC;
  228 + font-weight:400;
  229 + color:rgba(255,255,255,1);
  230 +}
  231 +.mid_item_bottom{
  232 + margin-top: 32rpx;
  233 + width:640rpx;
  234 + height:80rpx;
  235 + background:rgba(181,222,150,0.1);
  236 + border-radius:16rpx;
  237 + display: flex;
  238 + align-items: center;
  239 + box-sizing: border-box;
  240 + padding: 0 32rpx;
  241 +}
  242 +.mid_item_bottom_left{
  243 + font-size:30rpx;
  244 + font-family:汉真广标;
  245 + font-weight:400;
  246 + color:rgba(110,172,61,1);
  247 + opacity:1;
  248 +
  249 +}
  250 +.mid_line{
  251 + margin: 0 36rpx;
  252 + width:2rpx;
  253 + height:60rpx;
  254 + background:rgba(181,222,150,1);
  255 + opacity:1;
  256 + border-radius:4rpx;
  257 +}
  258 +.mid_item_bottom_bot{
  259 + font-size:24rpx;
  260 + font-family:PingFang SC;
  261 + font-weight:400;
  262 + color:rgba(153,153,153,1);
  263 + opacity:1;
  264 + overflow: hidden;
  265 + text-overflow: ellipsis;
  266 + white-space: nowrap;
  267 +}
  268 +.text_color{
  269 + width:202rpx;
  270 + height:48rpx;
  271 + line-height: 48rpx;
  272 + text-align: center;
  273 + background:rgba(204,204,204,0.7);
  274 + font-size:24rpx;
  275 + font-family:PingFang SC;
  276 + font-weight:400;
  277 + color:rgba(255,255,255,1);
  278 + opacity:1;
  279 + overflow: hidden;
  280 + text-overflow: ellipsis;
  281 + white-space: nowrap;
  282 +}
  283 +.right_bottom_lef{
  284 + width: 140rpx;
  285 + overflow: hidden;
  286 + text-overflow: ellipsis;
  287 + white-space: nowrap;
  288 +}
  1 +// pages/homeindex/search/search.js
  2 +Page({
  3 +
  4 + /**
  5 + * 页面的初始数据
  6 + */
  7 + data: {
  8 +
  9 + },
  10 +
  11 + /**
  12 + * 生命周期函数--监听页面加载
  13 + */
  14 + onLoad: function (options) {
  15 +
  16 + },
  17 +
  18 + /**
  19 + * 生命周期函数--监听页面初次渲染完成
  20 + */
  21 + onReady: function () {
  22 +
  23 + },
  24 +
  25 + /**
  26 + * 生命周期函数--监听页面显示
  27 + */
  28 + onShow: function () {
  29 +
  30 + },
  31 +
  32 + /**
  33 + * 生命周期函数--监听页面隐藏
  34 + */
  35 + onHide: function () {
  36 +
  37 + },
  38 +
  39 + /**
  40 + * 生命周期函数--监听页面卸载
  41 + */
  42 + onUnload: function () {
  43 +
  44 + },
  45 +
  46 + /**
  47 + * 页面相关事件处理函数--监听用户下拉动作
  48 + */
  49 + onPullDownRefresh: function () {
  50 +
  51 + },
  52 +
  53 + /**
  54 + * 页面上拉触底事件的处理函数
  55 + */
  56 + onReachBottom: function () {
  57 +
  58 + },
  59 +
  60 + /**
  61 + * 用户点击右上角分享
  62 + */
  63 + onShareAppMessage: function () {
  64 +
  65 + }
  66 +})
  1 +{
  2 + "navigationBarTitleText": "",
  3 + "navigationBarBackgroundColor": "#6EAC3D",
  4 + "navigationBarTextStyle": "white"
  5 +}
  1 +<!--pages/homeindex/search/search.wxml-->
  2 +<!-- <text>pages/homeindex/search/search.wxml</text> -->
  3 +<view class='search'>
  4 + <view class='search_inp'>
  5 + <input type='text' placeholder='请输入商品名称'></input>
  6 + <image src='../../../img/search.png'></image>
  7 + </view>
  8 + <view class='search_txt'>
  9 + 搜索
  10 + </view>
  11 +</view>
  12 +<view class='Popular'>
  13 + <view class='Popular_title'>
  14 + <text>热门搜索</text>
  15 + <image src='../../../img/zuire@3x.png'></image>
  16 + </view>
  17 + <view class='Popular_list'>
  18 + <view class='Popular_item'>
  19 + 有机菜花
  20 + </view>
  21 + <view class='Popular_item'>
  22 + 有机菜
  23 + </view>
  24 + <view class='Popular_item'>
  25 + 有机菜花
  26 + </view>
  27 + <view class='Popular_item'>
  28 + 有机菜花
  29 + </view>
  30 + <view class='Popular_item'>
  31 + 有机菜花
  32 + </view>
  33 + </view>
  34 + <view class='History'>
  35 + <view class='History_title'>历史搜索</view>
  36 + <view class='History_list'>
  37 + <view class='History_item'>有机菜花</view>
  38 + <view class='History_item'>有机菜花</view>
  39 + <view class='History_item'>有机菜花</view>
  40 + </view>
  41 + </view>
  42 +</view>
  1 +/* pages/homeindex/search/search.wxss */
  2 +.search{
  3 + padding: 16rpx 32rpx;
  4 + height: 64rpx;
  5 + background: #6EAC3D;
  6 + display: flex;
  7 + justify-content: center;
  8 + align-content: space-between;
  9 +}
  10 +.search_inp{
  11 + box-sizing: border-box;
  12 + width: 608rpx;
  13 + height: 64rpx;
  14 + border-radius: 32rpx;
  15 + display:flex;
  16 + align-items: center;
  17 + padding-left: 76rpx;
  18 + padding-right: 32rpx;
  19 + background:#fff;
  20 + border: 0;
  21 + outline: none;
  22 + font-size: 26rpx;
  23 + position: relative;
  24 +}
  25 +.search_inp input{
  26 + width: 100%;
  27 +}
  28 +.search_inp image{
  29 + position: absolute;
  30 + left: 32rpx;
  31 + width: 32rpx;
  32 + height: 32rpx;
  33 +}
  34 +.search_txt{
  35 + height: 64rpx;
  36 + font-size: 30rpx;
  37 + color: #fff;
  38 + line-height: 64rpx;
  39 + padding-left: 16rpx;
  40 +}
  41 +.Popular{
  42 + padding: 32rpx;
  43 + padding-bottom: 0rpx;
  44 +
  45 +}
  46 +.Popular_title{
  47 + display: flex;
  48 + align-items: center;
  49 + font-size: 26rpx;
  50 + color: #333;
  51 + font-weight: 400;
  52 +}
  53 +.Popular_title text{
  54 + margin-right: 12rpx;
  55 +}
  56 +.Popular image{
  57 + width: 28rpx;
  58 + height: 32rpx;
  59 +}
  60 +.Popular_list{
  61 + display: flex;
  62 + justify-content: flex-start;
  63 + flex-wrap: wrap;
  64 + align-items: center;
  65 + margin-top: 28rpx;
  66 + padding-bottom: 16rpx;
  67 + border-bottom: 1rpx solid #F5F5F5;
  68 +}
  69 +.Popular_item,.History_item{
  70 + padding: 8rpx 26rpx;
  71 + border-radius: 24rpx;
  72 + background:rgba(247,247,247,1);
  73 + font-size: 26rpx;
  74 + margin-bottom: 16rpx;
  75 + margin-right: 16rpx;
  76 +}
  77 +.History{
  78 + margin-top: 30rpx;
  79 +}
  80 +.History_title{
  81 + font-size: 26rpx;
  82 + color: #333;
  83 + font-weight: 400;
  84 +}
  85 +.History_list{
  86 + display: flex;
  87 + justify-content: flex-start;
  88 + flex-wrap: wrap;
  89 + align-items: center;
  90 +
  91 +}
@@ -5,7 +5,26 @@ Page({ @@ -5,7 +5,26 @@ Page({
5 * 页面的初始数据 5 * 页面的初始数据
6 */ 6 */
7 data: { 7 data: {
8 - 8 + navbar: [{
  9 + name: '居家用品'
  10 + },
  11 + {
  12 + name: '日用商品'
  13 + },
  14 + {
  15 + name: '数码商品'
  16 + },
  17 + {
  18 + name: '富硒生疏'
  19 + },
  20 + {
  21 + name: '野生海鲜'
  22 + },
  23 + {
  24 + name: '有机菜花'
  25 + },
  26 + ],
  27 + currentTab: 0,
9 }, 28 },
10 29
11 /** 30 /**
@@ -14,7 +33,13 @@ Page({ @@ -14,7 +33,13 @@ Page({
14 onLoad: function (options) { 33 onLoad: function (options) {
15 34
16 }, 35 },
17 - 36 + navbarTap: function (e) {
  37 + console.log(88)
  38 + let that = this;
  39 + this.setData({
  40 + currentTab: e.currentTarget.dataset.idx,
  41 + })
  42 + },
18 /** 43 /**
19 * 生命周期函数--监听页面初次渲染完成 44 * 生命周期函数--监听页面初次渲染完成
20 */ 45 */
1 { 1 {
2 - "navigationBarTitleText": "分类" 2 + "navigationBarTitleText": "分类",
  3 + "navigationBarBackgroundColor": "#6EAC3D",
  4 + "navigationBarTextStyle": "white"
3 } 5 }
1 <!--pages/kind/kind.wxml--> 1 <!--pages/kind/kind.wxml-->
2 -<text>pages/kind/kind.wxml</text> 2 +<!-- <text>pages/kind/kind.wxml</text> -->
  3 +<view class='container'>
  4 + <view class="nav mainindex_nav top">
  5 + <view wx:for="{{navbar}}" data-idx="{{index}}" class="nav_item {{currentTab==index ? 'active' : ''}}" wx:key="unique" bindtap="navbarTap" data-categoryid="{{item.id}}">{{item.name}}
  6 + </view>
  7 + </view>
  8 + <view class='mid'>
  9 + <view class='mid_item'>
  10 + <!-- 顶部 -->
  11 + <view class='mid_item_top'>
  12 + <!-- 左边 -->
  13 + <view class='mid_item_top_left'>
  14 + <view class='top_left_pic'>
  15 + <image src='../../../img/goods_1.png'></image>
  16 + </view>
  17 + <view class='top_left_text'>
  18 + 距结束23时59分距结束23时59分
  19 + </view>
  20 + </view>
  21 + <!-- 右边 -->
  22 + <view class='mid_item_top_right'>
  23 + <!-- 右上 -->
  24 + <view class='right_top'>
  25 + <view class='right_top_lef'>
  26 + 纯进口有机菜花
  27 + </view>
  28 + <view class='right_top_rig'>
  29 + 产地：智利
  30 + </view>
  31 + </view>
  32 + <!-- 右中1 -->
  33 + <view class='right_mid'>
  34 + <view class='right_mid_lef'>
  35 + <view class='right_mid_lef_color'></view>
  36 + </view>
  37 + <view class='right_mid_rig'>
  38 + 42%
  39 + </view>
  40 + </view>
  41 + <!-- 右中2 -->
  42 + <view class='right_text'>
  43 + 已拼300份，目标500份
  44 + </view>
  45 + <!-- 右下 -->
  46 + <view class='right_bottom'>
  47 + <!-- 右下左 -->
  48 + <view class='right_bottom_lef'>
  49 + <span class='RBM'>￥</span>
  50 + <span class='number'>52/</span>
  51 + <span class='text'>1磅1份1磅1份</span>
  52 + </view>
  53 + <!-- 右下中 -->
  54 + <view class='right_bottom_mid'>
  55 + <view class='right_bottom_mid_t'>
  56 + 40mm-50m
  57 + </view>
  58 + <view class='right_bottom_mid_b'>
  59 + 番茄果径番茄果径番茄果径
  60 + </view>
  61 + </view>
  62 + <!-- 右下右 -->
  63 + <view class='right_bottom_rig'>
  64 + 立即参团
  65 + </view>
  66 + </view>
  67 + </view>
  68 +
  69 +
  70 + </view>
  71 + <view class='mid_item_bottom'>
  72 + <view class='mid_item_bottom_left'>
  73 + 经典推荐
  74 + </view>
  75 + <!-- 竖线 -->
  76 + <view class='mid_line'></view>
  77 + <!-- 底部文本 -->
  78 + <view class='mid_item_bottom_bot'>
  79 + 智利进口，绿色健康，硕大饱满
  80 + </view>
  81 + </view>
  82 + </view>
  83 +
  84 + <view class='mid_item'>
  85 + <!-- 顶部 -->
  86 + <view class='mid_item_top'>
  87 + <!-- 左边 -->
  88 + <view class='mid_item_top_left'>
  89 + <view class='top_left_pic'>
  90 + <image src='../../../img/goods_1.png'></image>
  91 + </view>
  92 + <view class='text_color'>
  93 + 距结束2时22分距结束2时22分
  94 + </view>
  95 + </view>
  96 + <!-- 右边 -->
  97 + <view class='mid_item_top_right'>
  98 + <!-- 右上 -->
  99 + <view class='right_top'>
  100 + <view class='right_top_lef'>
  101 + 纯进口有机菜花
  102 + </view>
  103 + <view class='right_top_rig'>
  104 + 产地：罗利
  105 + </view>
  106 + </view>
  107 + <!-- 右中1 -->
  108 + <view class='right_mid'>
  109 + <view class='right_mid_lef'>
  110 + <view class='right_mid_lef_color'></view>
  111 + </view>
  112 + <view class='right_mid_rig'>
  113 + 42%
  114 + </view>
  115 + </view>
  116 + <!-- 右中2 -->
  117 + <view class='right_text'>
  118 + 已拼300份，目标500份
  119 + </view>
  120 + <!-- 右下 -->
  121 + <view class='right_bottom'>
  122 + <!-- 右下左 -->
  123 + <view class='right_bottom_lef'>
  124 + <span class='RBM'>￥</span>
  125 + <span class='number'>52/</span>
  126 + <span class='text'>1磅1份1磅1份</span>
  127 +
  128 + </view>
  129 + <!-- 右下中 -->
  130 + <view class='right_bottom_mid'>
  131 + <view class='right_bottom_mid_t'>
  132 + 40mm-50m
  133 + </view>
  134 + <view class='right_bottom_mid_b'>
  135 + 番茄果径 番茄果径番茄果径
  136 + </view>
  137 + </view>
  138 + <!-- 右下右 -->
  139 + <view class='right_bottom_rig'>
  140 + 立即参团
  141 + </view>
  142 + </view>
  143 + </view>
  144 +
  145 +
  146 + </view>
  147 + <view class='mid_item_bottom'>
  148 + <view class='mid_item_bottom_left'>
  149 + 经典推荐
  150 + </view>
  151 + <!-- 竖线 -->
  152 + <view class='mid_line'></view>
  153 + <!-- 底部文本 -->
  154 + <view class='mid_item_bottom_bot'>
  155 + 智利进口，绿色健康，硕大饱满
  156 + </view>
  157 + </view>
  158 + </view>
  159 + </view>
  160 +</view>
1 /* pages/kind/kind.wxss */ 1 /* pages/kind/kind.wxss */
  2 +.top{
  3 + width: 750rpx;
  4 + height: 80rpx;
  5 + background: #6EAC3D;
  6 +
  7 + display: flex;
  8 + align-items: center;
  9 + font-size:28rpx;
  10 + font-family:PingFang SC;
  11 + font-weight:600;
  12 + color:rgba(255,255,255,0.5);
  13 + opacity:1;
  14 + overflow-x: scroll;
  15 + flex-wrap: nowrap
  16 +}
  17 +.nav_item{
  18 + /* width: 200rpx; */
  19 + padding: 0 38rpx;
  20 + text-align: center;
  21 + flex:0 0 auto;
  22 +}
  23 +.active{
  24 + color: #FFFFFF;
  25 + position: relative;
  26 +}
  27 +.active:before{
  28 + content: "";
  29 + width:48rpx;
  30 + height:4rpx;
  31 + background:rgba(255,255,255,1);
  32 + opacity:1;
  33 + position: absolute;
  34 + left: 0;
  35 + right: 0;
  36 + bottom: -15rpx;
  37 + margin: 0 auto;
  38 +}
  39 +.container{
  40 + width: 750rpx;
  41 + display: flex;
  42 + align-items: center;
  43 + flex-flow: column;
  44 +}
  45 +.mid{
  46 + margin-top: 16rpx;
  47 + display: flex;
  48 + flex-flow: column;
  49 +}
  50 +.mid_item{
  51 + margin-top: 16rpx;
  52 + width:688rpx;
  53 + /* height:400rpx; */
  54 + background:rgba(249,250,252,1);
  55 + opacity:1;
  56 + border-radius:8rpx;
  57 + display: flex;
  58 + align-items: center;
  59 + flex-flow: column;
  60 + box-sizing: border-box;
  61 + padding: 52rpx 16rpx 48rpx;
  62 +}
  63 +.mid_item_top{
  64 + display: flex;
  65 + width: 100%;
  66 +}
  67 +.mid_item_top_left{
  68 + width:208rpx;
  69 + height:208rpx;
  70 + /* background:rgba(250,250,250,1); */
  71 + opacity:1;
  72 + display: flex;
  73 + flex-flow: column;
  74 +}
  75 +.top_left_pic{
  76 + width: 208rpx;
  77 + height: 160rpx;
  78 + display: flex;
  79 +}
  80 +.top_left_pic image{
  81 + width: 100%;
  82 + height: 100%;
  83 +}
  84 +.top_left_text{
  85 + width: 202rpx;
  86 + height:48rpx;
  87 + background:rgba(251,4,4,1);
  88 + opacity:0.2;
  89 + text-align: center;
  90 + font-size:24rpx;
  91 + font-family:PingFang SC;
  92 + font-weight:400;
  93 + line-height:48rpx;
  94 + color:rgba(255,255,255,1);
  95 +
  96 + overflow: hidden;
  97 + text-overflow: ellipsis;
  98 + white-space: nowrap;
  99 +}
  100 +.mid_item_top_right{
  101 + width: 100%;
  102 + margin-left: 14rpx;
  103 +}
  104 +.right_top{
  105 + display: flex;
  106 + align-items: center;
  107 + justify-content: space-between;
  108 + margin-top: 20rpx;
  109 +}
  110 +.right_top_lef{
  111 + width: 270rpx;
  112 + font-size:32rpx;
  113 + font-family:PingFang SC;
  114 + font-weight:600;
  115 + color:rgba(51,51,51,1);
  116 + opacity:1;
  117 + overflow: hidden;
  118 + text-overflow: ellipsis;
  119 + white-space: nowrap;
  120 +}
  121 +.right_top_rig{
  122 + font-size:22rpx;
  123 + font-family:PingFang SC;
  124 + font-weight:400;
  125 + line-height:32rpx;
  126 + color:rgba(204,204,204,1);
  127 + opacity:1;
  128 +}
  129 +.right_mid{
  130 + margin-top: 16rpx;
  131 + display: flex;
  132 + align-items: center;
  133 +}
  134 +.right_mid_lef{
  135 + width:288rpx;
  136 + height:16rpx;
  137 + background:rgba(236,236,236,1);
  138 + opacity:1;
  139 + border-radius:8rpx;
  140 +}
  141 +.right_mid_lef_color{
  142 + width:206rpx;
  143 + height:16rpx;
  144 + background:rgba(181,222,150,1);
  145 + opacity:1;
  146 + border-radius:8rpx;
  147 +}
  148 +.right_mid_rig{
  149 + margin-left: 16rpx;
  150 + font-size:24rpx;
  151 + font-family:PingFang SC;
  152 + font-weight:400;
  153 + line-height:34rpx;
  154 + color:rgba(181,222,150,1);
  155 + opacity:1;
  156 +}
  157 +.right_text{
  158 + margin-top: 14rpx;
  159 + font-size:22rpx;
  160 + font-family:PingFang SC;
  161 + font-weight:400;
  162 + color:rgba(204,204,204,1);
  163 + opacity:1;
  164 +}
  165 +.right_bottom{
  166 + display: flex;
  167 + align-items: center;
  168 + justify-content: space-between;
  169 +}
  170 +.RBM{
  171 + font-size: 22rpx;
  172 + color: #ff0000;
  173 +}
  174 +.number{
  175 + font-size: 30rpx;
  176 + color: #ff0000;
  177 +}
  178 +.text{
  179 +
  180 + font-size:22rpx;
  181 + font-family:PingFang SC;
  182 + font-weight:400;
  183 + line-height:32rpx;
  184 + color:rgba(204,204,204,1);
  185 + opacity:1;
  186 +}
  187 +.right_bottom_mid{
  188 + width: 122rpx;
  189 +}
  190 +.right_bottom_mid_t{
  191 +
  192 + font-size:22rpx;
  193 + font-family:PingFang SC;
  194 + font-weight:400;
  195 + color:rgba(51,51,51,1);
  196 + opacity:1;
  197 +
  198 + overflow: hidden;
  199 + text-overflow: ellipsis;
  200 + white-space: nowrap;
  201 +
  202 +}
  203 +.right_bottom_mid_b{
  204 + font-size:18rpx;
  205 + font-family:PingFang SC;
  206 + font-weight:400;
  207 + color:rgba(153,153,153,1);
  208 + opacity:1;
  209 +
  210 + overflow: hidden;
  211 + text-overflow: ellipsis;
  212 + white-space: nowrap;
  213 +}
  214 +.right_bottom_rig{
  215 + width:144rpx;
  216 + height:48rpx;
  217 + line-height: 48rpx;
  218 + background:rgba(249,150,20,1);
  219 + box-shadow:0rpx 2rpx 12rpx rgba(255,145,0,0.16);
  220 + opacity:1;
  221 + border-radius:24rpx;
  222 +
  223 + text-align: center;
  224 + font-size:26rpx;
  225 + font-family:PingFang SC;
  226 + font-weight:400;
  227 + color:rgba(255,255,255,1);
  228 +}
  229 +.mid_item_bottom{
  230 + margin-top: 32rpx;
  231 + width:640rpx;
  232 + height:80rpx;
  233 + background:rgba(181,222,150,0.1);
  234 + border-radius:16rpx;
  235 + display: flex;
  236 + align-items: center;
  237 + box-sizing: border-box;
  238 + padding: 0 32rpx;
  239 +}
  240 +.mid_item_bottom_left{
  241 + font-size:30rpx;
  242 + font-family:汉真广标;
  243 + font-weight:400;
  244 + color:rgba(110,172,61,1);
  245 + opacity:1;
  246 +
  247 +}
  248 +.mid_line{
  249 + margin: 0 36rpx;
  250 + width:2rpx;
  251 + height:60rpx;
  252 + background:rgba(181,222,150,1);
  253 + opacity:1;
  254 + border-radius:4rpx;
  255 +}
  256 +.mid_item_bottom_bot{
  257 + font-size:24rpx;
  258 + font-family:PingFang SC;
  259 + font-weight:400;
  260 + color:rgba(153,153,153,1);
  261 + opacity:1;
  262 + overflow: hidden;
  263 + text-overflow: ellipsis;
  264 + white-space: nowrap;
  265 +}
  266 +.text_color{
  267 + width:202rpx;
  268 + height:48rpx;
  269 + line-height: 48rpx;
  270 + text-align: center;
  271 + background:rgba(204,204,204,0.7);
  272 + font-size:24rpx;
  273 + font-family:PingFang SC;
  274 + font-weight:400;
  275 + color:rgba(255,255,255,1);
  276 + opacity:1;
  277 + overflow: hidden;
  278 + text-overflow: ellipsis;
  279 + white-space: nowrap;
  280 +}
  281 +.right_bottom_lef{
  282 + width: 140rpx;
  283 + overflow: hidden;
  284 + text-overflow: ellipsis;
  285 + white-space: nowrap;
  286 +}
@@ -76,15 +76,15 @@ @@ -76,15 +76,15 @@
76 }, 76 },
77 { 77 {
78 "id": -1, 78 "id": -1,
79 - "name": "评价订单",  
80 - "pathName": "pages/mine/eOrder/eOrder", 79 + "name": "首页",
  80 + "pathName": "pages/homeindex/homeindex",
81 "query": "", 81 "query": "",
82 "scene": null 82 "scene": null
83 }, 83 },
84 { 84 {
85 "id": -1, 85 "id": -1,
86 - "name": "加入我们",  
87 - "pathName": "pages/mine/contactUs/contactUs", 86 + "name": "搜索",
  87 + "pathName": "pages/homeindex/search/search",
88 "scene": null 88 "scene": null
89 } 89 }
90 ] 90 ]