修复大部分页面状态组件2

pages/mall/admin/marketing/checkin/reward.uvue

@@ -23,7 +23,7 @@
           <view class="th cell-type">类型</view>
           <view class="th cell-days">签到天数</view>
           <view class="th cell-reward">奖励内容</view>
-          <view class="th cell-status">是否可用</view>
+          <view class="th cell-status">状态</view>
           <view class="th cell-op">操作</view>
         </view>
 
@@ -36,9 +36,7 @@
               <text class="td-txt">积分+{{ item.integral }}, 经验+{{ item.exp }}</text>
             </view>
             <view class="td cell-status">
-              <view class="switch-mock" :class="{ active: item.is_open }" @click="toggleStatus(item)">
-                <view class="switch-dot"></view>
-              </view>
+              <StatusSwitch v-model="item.is_open" />
             </view>
             <view class="td cell-op">
               <text class="op-link" @click="handleEdit(item)">编辑</text>
@@ -81,6 +79,7 @@
 
 <script setup lang="uts">
 import { ref, reactive, computed } from 'vue'
+import StatusSwitch from '@/components/StatusSwitch.uvue'
 
 const currentTab = ref('continuous')
 const showModal = ref(false)
@@ -114,11 +113,6 @@ const openModal = (type: string) => {
   showModal.value = true
 }
 
-const toggleStatus = (item: any) => {
-  item.is_open = !item.is_open
-  uni.showToast({ title: '修改成功', icon: 'success' })
-}
-
 const handleEdit = (item: any) => {
   uni.showToast({ title: '编辑功能暂未对接', icon: 'none' })
 }
@@ -238,18 +232,6 @@ const handleSubmit = () => {
 .op-link.del { color: #ff4d4f; }
 .ml-10 { margin-left: 10px; }
 
-.switch-mock {
-  width: 44px; height: 22px; background-color: #bfbfbf; border-radius: 11px;
-  display: flex; align-items: center; padding: 0 4px; position: relative;
-  transition: background-color 0.3s; cursor: pointer;
-}
-.switch-mock.active { background-color: #1890ff; }
-.switch-dot {
-  width: 14px; height: 14px; background-color: #fff; border-radius: 50%;
-  position: absolute; left: 4px; transition: left 0.3s;
-}
-.switch-mock.active .switch-dot { left: 26px; }
-
 /* Modal */
 .modal-mask {
   position: fixed; top: 0; left: 0; right: 0; bottom: 0;