Procházet zdrojové kódy

修改反馈的bug和样式问题

秦鹏 před 3 roky
rodič
revize
c4e65cde35

binární
src/assets/__MACOSX/pay/._active.png


binární
src/assets/__MACOSX/pay/._shouxinyi.png


binární
src/assets/pay/active.png


binární
src/assets/pay/shouxinyi.png


+ 71 - 0
src/components/payment/Payment.vue

@@ -25,6 +25,19 @@
         <p>¥{{ data.price }}</p>
       </div>
     </div>
+    <div class="pay-platform">
+      <p class="pay-platform-title">选择支付平台</p>
+      <ul class="pay-platform-list">
+        <li
+          :class="item.isSelected ? 'active' : ''"
+          v-for="(item, index) in platList"
+          :key="'plat' + index"
+        >
+          <img :src="item.img" class="plat-logo" />
+          <img src="../../assets/pay/active.png" class="active-icon" />
+        </li>
+      </ul>
+    </div>
     <div class="total">
       <p class="p1">
         <span> 一件商品,总金额: </span>
@@ -66,6 +79,12 @@ export default {
       discount_money: 0.0, // 优惠金额
       receivables_money: this.data.price, // 应收款
       loading: false,
+      platList: [
+        {
+          img: require("../../assets/pay/shouxinyi.png"),
+          isSelected: true,
+        },
+      ],
     };
   },
   //计算属性 类似于data概念
@@ -292,5 +311,57 @@ export default {
       cursor: pointer;
     }
   }
+  .pay-platform {
+    width: 656px;
+    box-sizing: border-box;
+    padding: 16px 0 16px;
+    border-top: 1px rgba(44, 44, 44, 0.15) solid;
+    border-bottom: 1px rgba(44, 44, 44, 0.15) solid;
+    &-title {
+      padding: 0;
+      margin: 0;
+      font-style: normal;
+      font-weight: normal;
+      font-size: 16px;
+      line-height: 150%;
+      color: #000000;
+      margin-bottom: 16px;
+    }
+    &-list {
+      display: flex;
+      flex-wrap: wrap;
+      margin: 0;
+      padding: 0;
+      > li {
+        position: relative;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        width: 152px;
+        height: 60px;
+        background: #ffffff;
+        border: 1px solid rgba(44, 44, 44, 0.15);
+        box-sizing: border-box;
+        border-radius: 4px;
+        cursor: pointer;
+        margin: 0 8px 8px 0;
+        > .plat-logo {
+          width: 99px;
+          height: 26px;
+        }
+        > .active-icon {
+          position: absolute;
+          bottom: -1px;
+          right: -1px;
+          width: 20px;
+          height: 20px;
+          display: block;
+        }
+        &.active {
+          border-color: #ff9900;
+        }
+      }
+    }
+  }
 }
 </style>

+ 3 - 1
src/views/teacher-dev/Preview.vue

@@ -77,11 +77,11 @@
       </div>
     </div>
     <el-dialog
-      title="商品详情"
       :visible.sync="NopymentShow"
       width="720px"
       :before-close="closeNoPyment"
     >
+      <div class="dialogTitle" slot="title">商品详情</div>
       <Confirmorder
         :data="data"
         :goods_type="401"
@@ -479,5 +479,7 @@ export default {
     position: relative;
     top: -150px;
   }
+  .dialogTitle {
+  }
 }
 </style>

+ 3 - 0
src/views/teacher-dev/Viewmore.vue

@@ -464,4 +464,7 @@ export default {
     height: 100%;
   }
 }
+.el-pagination.is-background .el-pager li:not(.disabled).active {
+  background: #ff9900;
+}
 </style>