移动端-油卡 手机卡充值，添加通道质量

src/pages/phoneSubPages/phoneMobileCard.vue

@@ -24,11 +24,20 @@
               v-for="(item,idx) in phone_amount"
               :key="idx"
               @click="hRecharge(item,idx)"
-              size="small"
+              size="mini"
               style="margin-left:0;margin-right:6px">{{item}}</el-button>
           </template>
           <span v-else style="margin-left: 20px;font-size: 13px;color: #909399;">请选择充值金额</span>
         </el-form-item>
+        <el-form-item label="通道质量：">
+          <el-button
+            :type="item.value === qualityBtn ? 'success' : 'info'"
+            v-for="item in qualityCon"
+            :key="item.value"
+            @click="hQucharge(item)"
+            size="mini"
+            style="margin-left:0;margin-right:6px">{{item.label}}</el-button>
+        </el-form-item>
         <el-form-item label="手机号：">
             <el-input
               type="textarea"
@@ -121,6 +130,7 @@
 <script>
 // getRechargeAmount-充值金额 OilCardRecharge-油卡充值
 import { getRechargeAmount, OilCardRecharge } from '@/api'
+import { qualityCon } from '@/utils/constants'
 export default {
   name: 'phoneMobileCard',
   data() {
@@ -158,7 +168,11 @@ export default {
       loadingSeeCard: false,
       disabled: false,
       disabledRecharge: false,
-      btnLoading: false
+      btnLoading: false,
+      // 通道质量
+      qualityCon,
+      // 通道按钮
+      qualityBtn: 1
     }
   },
   created() {
@@ -312,6 +326,7 @@ export default {
         let param = new URLSearchParams()
         param.append('cardno', this.splitStr)
         param.append('amount', this.curMoney)
+        param.append('quality', this.qualityBtn)
         // const res = await OilCardRecharge({
         //   cardno: this.splitStr,
         //   amount: this.curMoney

src/pages/phoneSubPages/phoneOilCard.vue

@@ -24,6 +24,15 @@
           </template>
           <span v-else style="font-size: 13px;color: #909399;">请选择充值金额</span>
         </el-form-item>
+        <el-form-item label="通道质量：">
+          <el-button
+            :type="item.value === qualityBtn ? 'success' : 'info'"
+            v-for="item in oilQuCon"
+            :key="item.value"
+            @click="hQucharge(item)"
+            size="mini">{{item.label}}</el-button>
+            <span style="margin-left: 10px;font-size: 13px;color: #909399;">请选择通道质量</span>
+        </el-form-item>
         <el-form-item label="卡号：">
             <el-input
               type="textarea"
@@ -108,6 +117,7 @@
 <script>
 // getRechargeAmount-充值金额 OilCardRecharge-油卡充值
 import { getRechargeAmount, OilCardRecharge } from '@/api'
+import { oilQuCon } from '@/utils/constants'
 export default {
   name: 'phoneOilCard',
   data() {
@@ -145,7 +155,11 @@ export default {
       // 失败数
       error_no: 0,
       disabled: false,
-      disabledRecharge: false
+      disabledRecharge: false,
+      // 通道质量
+      oilQuCon,
+      // 通道按钮
+      qualityBtn: 1
     }
   },
   created() {
@@ -312,6 +326,7 @@ export default {
         let param = new URLSearchParams()
         param.append('cardno', this.splitStr)
         param.append('amount', this.curMoney)
+        param.append('quality', this.qualityBtn)
         // const res = await OilCardRecharge({
         //   cardno: this.splitStr,
         //   amount: this.curMoney
@@ -353,6 +368,10 @@ export default {
             // }
         }
     },
+    // 选择通道质量
+    hQucharge(item) {
+      this.qualityBtn = item.value
+    }
   }
 }
 </script>