开发勋章弹窗

components/medal/index.js

@@ -0,0 +1,23 @@
+// components/medal/index.js
+Component({
+  /**
+   * 组件的属性列表
+   */
+  properties: {
+
+  },
+
+  /**
+   * 组件的初始数据
+   */
+  data: {
+
+  },
+
+  /**
+   * 组件的方法列表
+   */
+  methods: {
+
+  }
+})

components/medal/index.json

@@ -0,0 +1,4 @@
+{
+  "component": true,
+  "usingComponents": {}
+}

components/medal/index.less

@@ -0,0 +1,15 @@
+.mediaBox {
+  position: fixed;
+  top: 0px;
+  left: 0px;
+  width: 100vw;
+  height: 100vh;
+  background-color: rgba(0, 0, 0, 0.35);
+
+  .media {
+    width: 470rpx;
+    height: 608rpx;
+    background-color: #FEF2C7;
+    border-radius: 20rpx;
+  }
+}

components/medal/index.wxml

@@ -0,0 +1,6 @@
+<view class="mediaBox">
+  <view class="mediaBg"></view>
+  <view class="media">
+    
+  </view>
+</view>

components/medal/index.wxss

@@ -0,0 +1,14 @@
+.mediaBox {
+  position: fixed;
+  top: 0px;
+  left: 0px;
+  width: 100vw;
+  height: 100vh;
+  background-color: rgba(0, 0, 0, 0.35);
+}
+.mediaBox .media {
+  width: 470rpx;
+  height: 608rpx;
+  background-color: #FEF2C7;
+  border-radius: 20rpx;
+}

pages/medalStore/index.json

@@ -1,5 +1,7 @@
 {
-  "usingComponents": {},
+  "usingComponents": {
+    "Media": "/components/medal/index"
+  },
   "navigationBarTitleText": "勋章墙",
   "navigationBarBackgroundColor": "#30C866",
   "navigationBarTextStyle": "white"

pages/medalStore/index.wxml

@@ -20,4 +20,5 @@
       </view>
     </view>
   </view>
+  <Media />
 </view>

pages/my/index.wxml

@@ -62,7 +62,7 @@
     </button>
   </view>
   <!-- 勋章 -->
-  <!--   <view class="medalBox">
+  <view class="medalBox">
     <view class="header">
       <view class="title">我的勋章</view>
       <view class="jump" bindtap='jump' data-url="/pages/medalStore/index">查看全部
@@ -72,7 +72,7 @@
     <view class="body">
       <image src="/static/concern.png" class="medal" wx:for="{{5}}" wx:key="index" />
     </view>
-  </view> -->
+  </view>
   <!-- 支付 -->
   <view class="payBox" wx:if="{{!isIos}}">
     <view class="title">