add js logic

src/components/tab_bar.vue

@@ -1,17 +1,34 @@
 <script setup>
-import { reactive, ref } from "vue";
-const emits = defineEmits([ 'click:tab' ]);
+import { reactive, ref, computed } from "vue";
+const emits = defineEmits([ 'click:tab', 'update:idx' ]);
+
 const props = defineProps({
-    tabs: { default: [ {a: 1}, { a: 2} ] },
+    tabs: { default: [] },
+    idx: { default: 0 }
+});
+
+const tabIdx = computed({
+    get: () => props.idx,
+    set: val => emits('update:idx', val)
 });
-const tabIdx = ref(0);
+
+function tabChange(ele, idx){
+    tabIdx.value  = idx;
+    emits('click:tab', { ele, idx });
+}
 
 </script>
 
 <template>
 	<view class="tab-bar">
-        <view class="tb-item" v-for="(e, i) in tabs" :key="i" :class="{'tb-active': tabIdx === i}" @click="tabIdx = i">
-            <view class="ti-txt">889</view>
+        <view 
+            class="tb-item" 
+            v-for="(e, i) in tabs" 
+            :key="i" 
+            :class="{'tb-active': tabIdx === i}"
+            @click="tabChange(e, i)"
+        >
+            <view class="ti-txt">{{ e.name || '-' }}</view>
         </view>
 	</view>
 </template>

src/pages/member/index.vue

@@ -1,22 +1,32 @@
 <script setup>
 import { onLoad } from '@dcloudio/uni-app';
 import { reactive, ref } from 'vue';
+import { routeTo } from "@/utils/polish";
 
 onLoad(() => {
     
 });
 
+function toLogin(){
+    routeTo('/subpackage/authorize/pages/index');
+}
+
 </script>
 
 <template>
     <view class="member-index">
         <view class="mi-header">
+            <view class="mh-user" v-if="false">
                 <image class="mh-avatar"></image>
                 <view class="mh-info">
                     <view class="mi-name">抖音用户</view>
                     <view class="mi-num">17688184874</view>
                 </view>
             </view>
+            <view class="mh-unlogin" v-else>
+                <view class="mu-btn" @click="toLogin">登录</view>
+            </view>
+        </view>
         <view class="mi-section">
             <view class="ms-tool">
                 <view class="mt-tit">我的工具</view>
@@ -36,8 +46,9 @@ onLoad(() => {
 
     }
     .mi-header{
-        padding: 40upx 48upx 48upx;
         background: $mColor;
+        .mh-user{
+            padding: 40upx 48upx 48upx;
             @include ctf;
             .mh-avatar{
                 flex-shrink: 0;
@@ -61,6 +72,18 @@ onLoad(() => {
                 }
             }
         }
+        .mh-unlogin{
+            min-height: 216upx;
+            @include ctf(center);
+            .mu-btn{
+                width: 240rpx;
+				text-align: center;
+				border-radius: 46rpx;
+                background-color: #FFF;
+                @include flcw(32upx, 88upx, $mColor, 500);
+            }
+        }
+    }
     .mi-section{
         margin-top: 24upx;
     }

src/pages/order/list.vue

@@ -2,6 +2,11 @@
 import { onLoad } from '@dcloudio/uni-app';
 import tabBar from "@/components/tab_bar.vue";
 import { routeTo } from '@/utils/polish';
+import { reactive, ref } from 'vue';
+const tab = reactive({
+    list: [ {name: '全部'}, {name: '已核销'}, {name: '已退款'}, ],
+    idx: 0
+});
 onLoad(() => {
     
 });
@@ -15,7 +20,7 @@ function toOrderDetail(){
 <template>
 	<view class="order-list">
         <view class="ol-header">
-            <tab-bar></tab-bar>
+            <tab-bar :tabs="tab.list" v-model:idx="tab.idx"></tab-bar>
         </view>
         <view class="ol-list-content">
             <view class="ol-item" v-for="i in 10" :key="i" @click="toOrderDetail">