From 497d4e295fa5a6729deb92229dde03632f2d1cf7 Mon Sep 17 00:00:00 2001
From: kele <1184860403@qq.com>
Date: Mon, 13 Mar 2023 17:42:11 +0800
Subject: [PATCH] =?UTF-8?q?fix:radio=E4=BF=AE=E5=A4=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/commission/apply.vue                    | 38 ++++----
 pages/index/cart.vue                          | 37 +++++---
 pages/order/aftersale/apply.vue               | 77 ++++++++-------
 pages/pay/components/account-type-select.vue  |  5 -
 pages/pay/index.vue                           | 93 +++++++++----------
 pages/public/feedback.vue                     |  4 +-
 pages/user/goods-collect.vue                  | 29 +++---
 pages/user/goods-log.vue                      | 16 ++--
 .../components/s-auth-modal/s-auth-modal.vue  | 46 ++++-----
 .../s-coupon-select/s-coupon-select.vue       | 17 ++--
 10 files changed, 186 insertions(+), 176 deletions(-)

diff --git a/pages/commission/apply.vue b/pages/commission/apply.vue
index 174de72a..841a5dae 100644
--- a/pages/commission/apply.vue
+++ b/pages/commission/apply.vue
@@ -58,23 +58,29 @@
             </uni-forms-item>
           </view>
         </uni-forms>
-        <label class="ss-flex ss-m-t-20" @tap="onChange" v-if="state.protocol?.status == 1">
-          <radio :checked="state.isAgree" color="var(--ui-BG-Main)" style="transform: scale(0.6)" />
-          <view class="agreement-text ss-flex">
-            <view class="ss-m-r-4">勾选代表同意</view>
-            <view
-              class="tcp-text"
-              @tap.stop="
-                sheep.$router.go('/pages/public/richtext', {
-                  id: state.protocol.id,
-                  title: state.protocol.title,
-                })
-              "
-            >
-              《{{ state.protocol.title }}》
+        <radio-group @change="onChange" v-if="state.protocol?.status == 1">
+          <label class="ss-flex ss-m-t-20">
+            <radio
+              :checked="state.isAgree"
+              color="var(--ui-BG-Main)"
+              style="transform: scale(0.6)"
+            />
+            <view class="agreement-text ss-flex">
+              <view class="ss-m-r-4">勾选代表同意</view>
+              <view
+                class="tcp-text"
+                @tap.stop="
+                  sheep.$router.go('/pages/public/richtext', {
+                    id: state.protocol.id,
+                    title: state.protocol.title,
+                  })
+                "
+              >
+                《{{ state.protocol.title }}》
+              </view>
             </view>
-          </view>
-        </label>
+          </label>
+        </radio-group>
         <su-fixed bottom placeholder>
           <view class="submit-box ss-flex ss-row-center ss-p-30">
             <button class="submit-btn ss-reset-button ui-BG-Main ui-Shadow-Main" @tap="submit">
diff --git a/pages/index/cart.vue b/pages/index/cart.vue
index 545c6f2f..9d710740 100644
--- a/pages/index/cart.vue
+++ b/pages/index/cart.vue
@@ -27,13 +27,18 @@
       <view class="cart-content ss-flex-1 ss-p-x-30 ss-m-b-40">
         <view class="goods-box ss-r-10 ss-m-b-14" v-for="item in state.list" :key="item.id">
           <view class="ss-flex ss-col-center">
-            <view class="check-box ss-flex ss-col-center ss-p-l-10" @tap="onSelectSingle(item.id)">
-              <radio
-                :checked="state.selectedIds.includes(item.id)"
-                color="var(--ui-BG-Main)"
-                style="transform: scale(0.8)"
-              />
-            </view>
+            <radio-group
+              @change="onSelectSingle(item.id)"
+              class="check-box ss-flex ss-col-center ss-p-l-10"
+            >
+              <label class="radio ss-flex">
+                <radio
+                  :checked="state.selectedIds.includes(item.id)"
+                  color="var(--ui-BG-Main)"
+                  style="transform: scale(0.8)"
+                />
+              </label>
+            </radio-group>
             <s-goods-item
               :title="item.goods.title"
               :img="item.sku_price.image || item.goods.image"
@@ -59,14 +64,16 @@
       <su-fixed bottom :val="48" placeholder v-if="state.list.length > 0" :isInset="false">
         <view class="cart-footer ss-flex ss-col-center ss-row-between ss-p-x-30 border-bottom">
           <view class="footer-left ss-flex ss-col-center">
-            <view class="check-box ss-flex ss-col-center ss-p-r-30" @tap="onSelectAll">
-              <radio
-                :checked="state.isAllSelected"
-                color="var(--ui-BG-Main)"
-                style="transform: scale(0.7)"
-              />
-              <view> 全选 </view>
-            </view>
+            <radio-group @change="onSelectAll" class="check-box ss-flex ss-col-center ss-p-r-30">
+              <label class="radio ss-flex">
+                <radio
+                  :checked="state.isAllSelected"
+                  color="var(--ui-BG-Main)"
+                  style="transform: scale(0.8)"
+                />
+                <view class="ss-m-l-8"> 全选 </view>
+              </label>
+            </radio-group>
             <text>合计：</text>
             <view class="text-price price-text">
               {{ state.totalPriceSelected }}
diff --git a/pages/order/aftersale/apply.vue b/pages/order/aftersale/apply.vue
index 3248172a..b07407c7 100644
--- a/pages/order/aftersale/apply.vue
+++ b/pages/order/aftersale/apply.vue
@@ -17,19 +17,21 @@
       <view class="refund-item">
         <view class="item-title ss-m-b-20">售后类型</view>
         <view class="ss-flex-col">
-          <view
-            class="ss-flex ss-col-center ss-p-y-10"
-            v-for="(item, index) in state.refundTypeList"
-            :key="index"
-            @tap="formData.type = item.value"
-          >
-            <radio
-              :checked="formData.type === item.value"
-              color="var(--ui-BG-Main)"
-              style="transform: scale(0.8)"
-            />
-            <view class="item-value">{{ item.text }}</view>
-          </view>
+          <radio-group @change="onRefundChange">
+            <label
+              class="ss-flex ss-col-center ss-p-y-10"
+              v-for="(item, index) in state.refundTypeList"
+              :key="index"
+            >
+              <radio
+                :checked="formData.type === item.value"
+                color="var(--ui-BG-Main)"
+                style="transform: scale(0.8)"
+                :value="item.value"
+              />
+              <view class="item-value ss-m-l-8">{{ item.text }}</view>
+            </label>
+          </radio-group>
         </view>
       </view>
       <!-- 申请原因 -->
@@ -99,26 +101,20 @@
           >申请原因</view
         >
         <view class="modal-content content_box">
-          <view
-            class="ss-flex ss-col-center"
-            v-for="item in state.refundReasonList"
-            :key="item.value"
-          >
-            <view class="ss-flex-1 ss-p-20" @tap="onTitle(item.value, item.title)">{{
-              item.title
-            }}</view>
-            <view class="radio">
-              <radio-group @change="onChange(item.value, item.title)">
-                <label class="radio">
-                  <radio
-                    :value="item.value"
-                    color="var(--ui-BG-Main)"
-                    :checked="item.value === state.currentValue"
-                  />
-                </label>
-              </radio-group>
-            </view>
-          </view>
+          <radio-group @change="onChange">
+            <label
+              class="radio ss-flex ss-col-center"
+              v-for="item in state.refundReasonList"
+              :key="item.value"
+            >
+              <view class="ss-flex-1 ss-p-20">{{ item.title }}</view>
+              <radio
+                :value="item.value"
+                color="var(--ui-BG-Main)"
+                :checked="item.value === state.currentValue"
+              />
+            </label>
+          </radio-group>
         </view>
         <view class="modal-foot foot_box ss-flex ss-row-center ss-col-center">
           <button class="ss-reset-button close-btn ui-BG-Main-Gradient" @tap="onReason"
@@ -209,10 +205,19 @@
     }
   }
 
+  //选择售后类型
+  function onRefundChange(e) {
+    formData.type = e.detail.value;
+  }
+
   //选择申请原因
-  function onChange(val, title) {
-    state.currentValue = val;
-    state.reasonText = title;
+  function onChange(e) {
+    state.currentValue = e.detail.value;
+    state.refundReasonList.forEach((item) => {
+      if (item.value === e.detail.value) {
+        state.reasonText = item.title;
+      }
+    });
   }
   //确定
   function onReason() {
diff --git a/pages/pay/components/account-type-select.vue b/pages/pay/components/account-type-select.vue
index 14824e35..50cccc7c 100644
--- a/pages/pay/components/account-type-select.vue
+++ b/pages/pay/components/account-type-select.vue
@@ -178,9 +178,4 @@
     width: 100%;
     height: 100%;
   }
-
-  :deep(.uni-radio-input) {
-    width: 36rpx;
-    height: 36rpx;
-  }
 </style>
diff --git a/pages/pay/index.vue b/pages/pay/index.vue
index 84ad5fda..c981ed7a 100644
--- a/pages/pay/index.vue
+++ b/pages/pay/index.vue
@@ -13,51 +13,52 @@
       </view>
       <view class="modal-content ss-flex-1">
         <view class="pay-title ss-p-l-30 ss-m-y-30">选择支付方式</view>
-        <view class="pay-type-item" v-for="item in state.payMethods" :key="item.title">
-          <view
-            class="pay-item ss-flex ss-col-center ss-row-between ss-p-x-30 border-bottom"
-            :class="{ 'disabled-pay-item': item.disabled }"
-            v-if="
-              allowedPayment.includes(item.value) &&
-              !(state.orderType === 'recharge' && item.value === 'money')
-            "
-            @tap="onTapPay(item.disabled, item.value)"
-          >
-            <view class="ss-flex ss-col-center">
-              <image
-                class="pay-icon"
-                v-if="item.disabled"
-                :src="sheep.$url.static('/static/img/shop/pay/cod_disabled.png')"
-                mode="aspectFit"
-              ></image>
-              <image
-                class="pay-icon"
-                v-else
-                :src="sheep.$url.static(item.icon)"
-                mode="aspectFit"
-              ></image>
-              <text class="pay-title">{{ item.title }}</text>
-            </view>
-            <view class="check-box ss-flex ss-col-center ss-p-l-10">
-              <view class="userInfo-money ss-m-r-10" v-if="item.value == 'money'">
-                余额: {{ userInfo.money }}元
+        <radio-group @change="onTapPay">
+          <label class="pay-type-item" v-for="item in state.payMethods" :key="item.title">
+            <view
+              class="pay-item ss-flex ss-col-center ss-row-between ss-p-x-30 border-bottom"
+              :class="{ 'disabled-pay-item': item.disabled }"
+              v-if="
+                allowedPayment.includes(item.value) &&
+                !(state.orderType === 'recharge' && item.value === 'money')
+              "
+            >
+              <view class="ss-flex ss-col-center">
+                <image
+                  class="pay-icon"
+                  v-if="item.disabled"
+                  :src="sheep.$url.static('/static/img/shop/pay/cod_disabled.png')"
+                  mode="aspectFit"
+                ></image>
+                <image
+                  class="pay-icon"
+                  v-else
+                  :src="sheep.$url.static(item.icon)"
+                  mode="aspectFit"
+                ></image>
+                <text class="pay-title">{{ item.title }}</text>
               </view>
-              <view
-                class="userInfo-money ss-m-r-10"
-                v-if="item.value == 'offline' && item.disabled"
-              >
-                部分商品不支持
+              <view class="check-box ss-flex ss-col-center ss-p-l-10">
+                <view class="userInfo-money ss-m-r-10" v-if="item.value == 'money'">
+                  余额: {{ userInfo.money }}元
+                </view>
+                <view
+                  class="userInfo-money ss-m-r-10"
+                  v-if="item.value == 'offline' && item.disabled"
+                >
+                  部分商品不支持
+                </view>
+                <radio
+                  :value="item.value"
+                  color="var(--ui-BG-Main)"
+                  style="transform: scale(0.8)"
+                  :disabled="item.disabled"
+                  :checked="state.payment === item.value"
+                />
               </view>
-              <radio
-                :value="item.value"
-                color="var(--ui-BG-Main)"
-                style="transform: scale(0.8)"
-                :disabled="item.disabled"
-                :checked="state.payment === item.value"
-              />
             </view>
-          </view>
-        </view>
+          </label>
+        </radio-group>
       </view>
       <!-- 工具 -->
       <view class="modal-footer ss-flex ss-row-center ss-col-center ss-m-t-80 ss-m-b-40">
@@ -191,12 +192,8 @@
     state.payStatus = 2;
   }
 
-  function onTapPay(disabled, value) {
-    if (disabled) {
-      state.payment = '';
-    } else {
-      state.payment = value;
-    }
+  function onTapPay(e) {
+    state.payment = e.detail.value;
   }
 
   async function setRechargeOrder(id) {
diff --git a/pages/public/feedback.vue b/pages/public/feedback.vue
index 2ef62d3a..f482d60d 100644
--- a/pages/public/feedback.vue
+++ b/pages/public/feedback.vue
@@ -10,9 +10,7 @@
               v-for="item in state.radioList"
               :key="item.type"
             >
-              <view>
-                <radio :value="item.type" color="var(--ui-BG-Main)" style="transform: scale(0.8)" />
-              </view>
+              <radio :value="item.type" color="var(--ui-BG-Main)" style="transform: scale(0.8)" />
               <view class="radio-subtitle">{{ item.type }}</view>
             </label>
           </radio-group>
diff --git a/pages/user/goods-collect.vue b/pages/user/goods-collect.vue
index 32ba05c1..f734a54b 100644
--- a/pages/user/goods-collect.vue
+++ b/pages/user/goods-collect.vue
@@ -32,10 +32,10 @@
           :key="item.id"
         >
           <view class="ss-flex ss-col-center">
-            <view
-              v-show="state.editMode"
+            <radio-group
               class="check-box ss-flex ss-col-center ss-p-l-10"
-              @tap="onSelect(item.goods_id)"
+              @change="onSelect(item.goods_id)"
+              v-show="state.editMode"
             >
               <label class="radio">
                 <radio
@@ -44,7 +44,7 @@
                   style="transform: scale(0.8)"
                 />
               </label>
-            </view>
+            </radio-group>
             <s-goods-item
               :title="item.goods.title"
               :img="item.goods.image"
@@ -66,17 +66,16 @@
       <su-fixed bottom :val="0" placeholder v-show="state.editMode">
         <view class="cart-footer ss-flex ss-col-center ss-row-between ss-p-x-30 border-bottom">
           <view class="footer-left ss-flex ss-col-center">
-            <view class="check-box ss-flex ss-col-center ss-p-r-30" @tap="onSelectAll">
-              <label class="radio">
+            <radio-group @change="onSelectAll">
+              <label class="check-box ss-flex ss-col-center ss-p-r-30">
                 <radio
                   :checked="state.selectAll"
                   color="var(--ui-BG-Main)"
                   style="transform: scale(0.7)"
                 />
+                <view> 全选 </view>
               </label>
-
-              <view> 全选 </view>
-            </view>
+            </radio-group>
           </view>
           <view class="footer-right">
             <button
@@ -133,11 +132,11 @@
       page,
     });
     if (res.error === 0) {
-        let orderList = _.concat(state.pagination.data, res.data.data);
-        state.pagination = {
-          ...res.data,
-          data: orderList,
-        };
+      let orderList = _.concat(state.pagination.data, res.data.data);
+      state.pagination = {
+        ...res.data,
+        data: orderList,
+      };
       if (state.pagination.current_page < state.pagination.last_page) {
         state.loadStatus = 'more';
       } else {
@@ -181,7 +180,7 @@
         state.editMode = false;
         state.selectedCollectList = [];
         state.selectAll = false;
-        state.pagination = pagination
+        state.pagination = pagination;
         getData();
       }
     }
diff --git a/pages/user/goods-log.vue b/pages/user/goods-log.vue
index c203e0d3..205a15da 100644
--- a/pages/user/goods-log.vue
+++ b/pages/user/goods-log.vue
@@ -35,10 +35,10 @@
           :key="item.id"
         >
           <view class="ss-flex ss-col-center">
-            <view
-              v-show="state.editMode"
+            <radio-group
+            v-show="state.editMode"
               class="check-box ss-flex ss-col-center ss-p-l-10"
-              @tap="onSelect(item.goods_id)"
+              @change="onSelect(item.goods_id)"
             >
               <label class="radio">
                 <radio
@@ -47,7 +47,7 @@
                   style="transform: scale(0.8)"
                 />
               </label>
-            </view>
+            </radio-group>
             <s-goods-item
               :title="item.goods.title"
               :img="item.goods.image"
@@ -69,16 +69,16 @@
       <su-fixed bottom :val="0" placeholder v-show="state.editMode">
         <view class="cart-footer ss-flex ss-col-center ss-row-between ss-p-x-30 border-bottom">
           <view class="footer-left ss-flex ss-col-center">
-            <view class="check-box ss-flex ss-col-center ss-p-r-30" @tap="onSelectAll">
-              <label class="radio">
+            <radio-group @change="onSelectAll">
+              <label class="check-box ss-flex ss-col-center ss-p-r-30">
                 <radio
                   :checked="state.selectAll"
                   color="var(--ui-BG-Main)"
                   style="transform: scale(0.7)"
                 />
+                <view>全选</view>
               </label>
-              <view>全选</view>
-            </view>
+            </radio-group>
           </view>
           <view class="footer-right">
             <button
diff --git a/sheep/components/s-auth-modal/s-auth-modal.vue b/sheep/components/s-auth-modal/s-auth-modal.vue
index 2868ba2c..116bfa78 100644
--- a/sheep/components/s-auth-modal/s-auth-modal.vue
+++ b/sheep/components/s-auth-modal/s-auth-modal.vue
@@ -75,29 +75,31 @@
         v-if="['accountLogin', 'smsLogin', 'smsRegister'].includes(authType)"
         class="agreement-box ss-flex ss-row-center"
       >
-        <label class="radio ss-flex" @tap="onChange">
-          <radio
-            :checked="state.protocol"
-            color="var(--ui-BG-Main)"
-            style="transform: scale(0.8)"
-          />
-          <view class="agreement-text ss-flex ss-col-center">
-            我已阅读并遵守
-            <view
-              class="tcp-text"
-              @tap.stop="onProtocol(appInfo.user_protocol.id, appInfo.user_protocol.title)"
-            >
-              《{{ appInfo.user_protocol.title }}》
+      <radio-group @change="onChange" class="ss-flex ss-col-center">
+          <label class="radio ss-flex">
+            <radio
+              :checked="state.protocol"
+              color="var(--ui-BG-Main)"
+              style="transform: scale(0.8)"
+            />
+            <view class="agreement-text ss-flex ss-col-center ss-m-l-8">
+              我已阅读并遵守
+              <view
+                class="tcp-text"
+                @tap.stop="onProtocol(appInfo.user_protocol.id, appInfo.user_protocol.title)"
+              >
+                《{{ appInfo.user_protocol.title }}》
+              </view>
+              <view class="agreement-text">与</view>
+              <view
+                class="tcp-text"
+                @tap.stop="onProtocol(appInfo.privacy_protocol.id, appInfo.privacy_protocol.title)"
+              >
+                《{{ appInfo.privacy_protocol.title }}》
+              </view>
             </view>
-            <view class="agreement-text">与</view>
-            <view
-              class="tcp-text"
-              @tap.stop="onProtocol(appInfo.privacy_protocol.id, appInfo.privacy_protocol.title)"
-            >
-              《{{ appInfo.privacy_protocol.title }}》
-            </view>
-          </view>
-        </label>
+          </label>
+        </radio-group>
       </view>
       <view class="safe-box"></view>
     </view>
diff --git a/sheep/components/s-coupon-select/s-coupon-select.vue b/sheep/components/s-coupon-select/s-coupon-select.vue
index acfc39a8..489e9257 100644
--- a/sheep/components/s-coupon-select/s-coupon-select.vue
+++ b/sheep/components/s-coupon-select/s-coupon-select.vue
@@ -19,14 +19,15 @@
         <view v-for="(item, index) in state.couponInfo.can_use" :key="index">
           <s-coupon-list :data="item" type="user" :disabled="false">
             <template #default>
-              <label class="radio">
-                <radio
-                  color="var(--ui-BG-Main)"
-                  style="transform: scale(0.8)"
-                  @tap.stop="radioChange(item.id)"
-                  :checked="state.couponId == item.id"
-                />
-              </label>
+              <radio-group @change="radioChange(item.id)" class="ss-flex ss-col-center">
+                <label class="radio">
+                  <radio
+                    color="var(--ui-BG-Main)"
+                    style="transform: scale(0.8)"
+                    :checked="state.couponId == item.id"
+                  />
+                </label>
+              </radio-group>
             </template>
           </s-coupon-list>
         </view>