企业-余额充值

src/components/QrCode/index.vue

@@ -45,7 +45,7 @@ const props = defineProps({
   },
 })
 
-const emit = defineEmits(['done', 'click', 'disabled-click'])
+const emit = defineEmits(['done', 'click', 'disabled-click', 'refresh'])
 
 const { getPrefixCls } = useDesign()
 

src/components/pay/index.vue

@@ -381,7 +381,7 @@ const formatDuration = (remainder) => {
 }
 
 const handleToJump = () => {
-  window.open('/recruit/enterprise/membershipPackage')
+  window.open('/recruit/enterprise/membershipPackage?key=0')
 }
 
 </script>

src/layout/company/navBar.vue

@@ -18,7 +18,7 @@
             <span @click="enterpriseClick(1)" class="ml-3 commonHover">{{ baseInfo?.enterpriseAnotherName || baseInfo?.enterpriseName || '--' }}</span>
           </div>
           <div class="ml-3 cursor-pointer border-left border-right px-3 commonHover" @click="handleLogout(false)">我要求职</div>
-          <div class="d-flex align-center px-3 border-right">
+          <div class="d-flex align-center px-3 border-right cursor-pointer commonHover" @click="router.push('/recruit/enterprise/membershipPackage?key=1')">
             <div>剩余M豆：{{ enterpriseUserAccount?.balance ? enterpriseUserAccount?.balance / 100 : 0 }}个</div>
           </div>
           <!-- <svg-icon @click="handleToVip" name="vip" size="30" class="cursor-pointer ml-3"></svg-icon> -->

src/layout/personal/slider.vue

@@ -28,7 +28,7 @@ const defaultList = [
 const hasTokenList = [
   { mdi: 'mdi-arrow-up-bold', tips: '返回顶部' },
   { mdi: 'mdi-qrcode', tips: '微信公众号', showImg: 'https://minio.citupro.com/dev/menduner/official-account-code4.jpg' },
-  { mdi: 'mdi-bell-outline', tips: '消息', path: '/recruit/personal/message' },
+  { mdi: 'mdi-bell-outline', tips: '通知', path: '/recruit/personal/message' },
   { mdi: 'mdi-list-box-outline', tips: '在线简历', path: '/recruit/personal/personalCenter/resume/online' }
 ]
 const list = getToken() ? hasTokenList : defaultList

src/views/mall/exchangeRecords.vue

@@ -30,7 +30,8 @@ const headers = [
   { title: '消耗积分', key: 'point', sortable: false },
   { title: '收货人姓名', key: 'contactName', sortable: false },
   { title: '联系电话/收货人电话', key: 'contactPhone', sortable: false },
-  { title: '收货详细地址', key: 'contactAddress', sortable: false }
+  { title: '收货详细地址', key: 'contactAddress', sortable: false },
+  { title: '订单编号', key: 'orderNo', sortable: false }
 ]
 const queryParams = ref({
   pageNo: 1,

src/views/recruit/enterprise/hirePosition/components/item.vue

@@ -44,8 +44,8 @@
           <span v-if="val.status === '1' && tab === 2" class="cursor-pointer actions" @click="toPay(val)">职位已关闭，点击激活职位</span>
           <span v-if="(val.status-0) === 99" class="cursor-pointer color-primary" @click="toPay(val)">去支付</span>
           <span v-if="(val.status - 0) !== 99 && val.status !== '1' && tab === 1" class="cursor-pointer actions" @click="handleAction(0, val)">{{ $t('common.close') }}</span>
-          <span v-if="(val.status - 0) !== 99 && val.status !== '1' && tab === 1" class="lines"></span>
-          <span v-if="tab === 1" class="cursor-pointer actions" @click="handleEdit(val)">编辑</span>
+          <span v-if="(val.status - 0) !== 99 && val.status !== '1' && tab === 1 && val.edit" class="lines"></span>
+          <span v-if="tab === 1 && val.edit" class="cursor-pointer actions" @click="handleEdit(val)">编辑</span>
           <!-- <span v-if="tab === 3" class="cursor-pointer actions" @click="handleUpdateExpireTime(val)">修改到期时间</span> -->
           <span class="lines" v-if="tab !== 3"></span>
           <span class="cursor-pointer actions" @click="handleDetail(val)">详情</span> 

src/views/recruit/enterprise/membershipPackage/dynamic/balance.vue

@@ -0,0 +1,345 @@
+<template>
+  <div>
+    <div class="d-flex align-center justify-center mt-5">
+      <div
+        v-for="(item, index) in list"
+        :key="index"
+        class="packagesItem cursor-pointer mx-3"
+        :class="{'active': current === (index+1)}"
+        style="width: 200px;"
+        @click="handleClick(index, item)"
+      >
+        <div class="d-flex flex-column align-center pb-5" style="position: relative;">  
+          <div class="my-5 font-size-16 font-weight-bold" style="z-index: 2;">{{ item.name }}</div>  
+          <div class="priceBox mt-3" style="position: relative;">
+            <span v-if="item.custom">
+              <div v-if="inputValue" class="custom-point-show" style="position: absolute; top: -24px;">{{ inputValue }}M豆</div>
+              <input v-model="inputValue" @blur="inputChange" type="text" class="custom-input-num mr-1" :placeholder="item.placeholder">元
+              <div class="color-warning font-size-12 text-center mt-1">只能输入整数</div>
+            </span>
+            <span class="color-primary" v-else>
+              ￥
+              <span style="font-size: 25px;">{{ FenYuanTransform(item.payPrice) }}</span>
+              元
+            </span>
+          </div>
+          <div class="vip">
+            <svg-icon name="diamond" size="50"></svg-icon>
+          </div> 
+        </div> 
+      </div>
+    </div>
+    <div class="text-end color-primary my-3 text-decoration-underline cursor-pointer" @click="handleToOrder">充值记录<v-icon>mdi-chevron-double-right</v-icon></div>
+    <div v-if="payType && payQrCodeTxt" class="code pa-5 resume-box">
+      <div class="resume-header">
+        <div class="resume-title">扫码支付</div>
+      </div>
+      <div class="d-flex align-end mt-3">
+        <div class="code-left">
+          <QrCode :text="payQrCodeTxt" :disabled="!remainderTimer" :width="170" @refresh="refreshQRCode" />
+        </div>
+        <div class="code-right ml-5">
+          <div class="price">
+            <span class="font-size-13">￥</span>
+            {{ FenYuanTransform(select?.payPrice || 0) }}元
+          </div>
+          <div class="mt-3 d-flex align-center">
+            <span class="color-666 font-weight-bold mr-5">支付方式</span>
+            <v-chip-group v-model="payType" selected-class="text-primary" column mandatory @update:modelValue="payTypeChange">
+              <v-chip filter v-for="k in payTypeList" :key="k.code" :value="k.code" class="mr-3" label>
+                {{ k.name }}
+                <svg-icon v-if="k.icon" class="ml-1" :name="k.icon" :size="k.size"></svg-icon>
+              </v-chip>
+            </v-chip-group>
+          </div>
+        </div>
+      </div>
+      <div class="mt-5 ml-2" style="color: var(--v-error-base);">
+        扫码支付时请勿离开
+        <span v-if="remainderZhShow">{{ remainderZhShow }}</span>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+defineOptions({ name: 'membershipPackageBalance' })
+import { ref, onUnmounted, nextTick, watch } from 'vue'
+import { FenYuanTransform } from '@/utils/position'
+import { getEnableCodeList, payOrderSubmit, getOrderPayStatus } from '@/api/common'
+import { definePayTypeList, qrCodePay } from '@/utils/payType'
+import { rechargeOrderCreate } from '@/api/recruit/enterprise/member/points'
+import { getEnterpriseRechargePackageList } from '@/api/recruit/enterprise/member/points'
+import { useUserStore } from '@/store/user'; const store = useUserStore()
+import Snackbar from '@/plugins/snackbar'
+import { useRouter } from 'vue-router'
+
+const router = useRouter()
+const current = ref(1)
+const inputValue = ref('')
+const payQrCodeTxt = ref('')
+const remainderZhShow = ref('') // 倒计时展示
+const select = ref({})
+const list = ref([])
+const getData = async () => {
+  const data = await getEnterpriseRechargePackageList()
+  const end = { name: '自定义金额', id: 'custom', placeholder: '请输入', custom: true }
+  list.value = data ? [...data, end] : [end]
+  select.value = list.value[0]
+}
+
+const handleClick = (index, item) => {
+  current.value = index + 1
+  select.value = item
+  getUnpaidOrderList()
+}
+
+const inputChange = () => {
+  if (!inputValue.value) return
+  current.value = list.value.length
+  const item = list.value[list.value.length-1]
+  item.payPrice = FenYuanTransform(inputValue.value, 'toCent')
+  item.id = 'custom' + inputValue.value
+  select.value = item
+  getUnpaidOrderList()
+}
+
+const timeout = ref(null)
+watch(
+  () => inputValue.value,
+  (val) => {
+    let num = val && val !=='0' ? (val.match(/\d+/g)?.join('') || null) : null
+    if (num > 100000000) {
+      num = '100000000'
+      Snackbar.warning('最多不可超过一亿元')
+    }
+    inputValue.value = num
+    clearTimeout(timeout.value)
+    timeout.value = setTimeout(() => inputChange(), 500) // 防抖
+  }
+)
+
+// 2.发起充值
+const loading = ref(true)
+const payOrder = ref({})
+const getUnpaidOrderList = async () => {
+  if (select.value.payPrice === undefined) return payQrCodeTxt.value = ''
+  const params = {
+    payPrice: (select.value.payPrice-0),
+  }
+  if (typeof select.value.id === 'string' && !select.value.id.includes('custom')) params.packageId = select.value.id
+  const data = await rechargeOrderCreate(params)
+  payOrder.value = data || {}
+  paySubmit()
+}
+
+const payTypeChange = (val) => {
+  payType.value = val
+  paySubmit()
+}
+const timer = ref(null)
+onUnmounted(() => {
+  if (timer.value) clearInterval(timer.value); timer.value = null
+})
+
+// 更新账户余额
+const updateAccountInfo = async (init = false) => {
+  await store.getEnterpriseUserAccountInfo()
+  if (init) return
+  loading.value = false
+}
+
+const payStatus = async () => {
+  try {
+    const data = await getOrderPayStatus({ id: payOrder.value.payOrderId })
+    if ((data?.status - 0) === 10) {
+      // 支付成功
+      if (timer.value) clearInterval(timer.value); timer.value = null
+      setTimeout(() => {
+        // 更新点数(充值、发布职位)
+        updateAccountInfo()
+        // 清除定时器
+        clearTimer()
+        // 支付成功
+        Snackbar.success('支付成功')
+      }, 2000);
+    }
+  } catch (error) {
+    console.log(error)
+  }
+}
+
+const paySubmit = async () => {
+  if (!payType.value) return
+  try {
+    if (payOrder.value) {
+      if (!payOrder.value?.payOrderId) return
+      // 提交支付订单
+      const params = {
+        channelCode: payType.value, // 支付渠道
+        id: payOrder.value.payOrderId // 支付单编号
+      }
+      const res = await payOrderSubmit(params)
+      payQrCodeTxt.value = res?.displayContent || '' // 生成二维码内容
+      initIntervalFun()
+      if (timer.value) clearInterval(timer.value); timer.value = null
+      timer.value = setInterval(() => { payStatus() }, 1000) // 轮巡查询用户是否支付
+    }
+  } catch (error) {
+    console.log(error)
+  }
+}
+
+// 1.支付方式
+const payType = ref('')
+const payTypeList = ref([])
+const codeList = ref([])
+const getCodeList = async () => {
+  try {
+    const list = await getEnableCodeList({ appId: 11 })
+    codeList.value = list || []
+  } catch (error) {
+    console.log(error)
+  } finally {
+    if (definePayTypeList?.length && codeList.value?.length) {
+      codeList.value.forEach(code => {
+        const item = definePayTypeList.find(p => p.code === code)
+        if (item) {
+          if (!payType.value) {
+            // 默认值赋值(暂时只支持扫码)
+            const bool = qrCodePay.includes(code)
+            if (bool) payTypeChange(code)
+          }
+          payTypeList.value.push(item)
+        }
+      })
+    }
+    getUnpaidOrderList()
+  }
+}
+nextTick(async () => {
+  await getData()
+  await getCodeList()
+})
+
+const refreshQRCode =() => { // 刷新二维码
+  getUnpaidOrderList()
+}
+
+const remainderTimer = ref(null)
+const countdownTime = 60000 * 3 // 倒计时三分钟
+let remainder = 0 // number
+// 初始化倒计时
+const initIntervalFun = () => {
+  remainder = countdownTime // 初始倒计时时间
+  if (remainderTimer.value) clearInterval(remainderTimer.value); remainderTimer.value = null // 每一次点击都清除上一个轮询
+  // 倒计时计算
+  remainderCalc()
+  remainderTimer.value = setInterval(() => { remainderCalc() }, 1000)
+
+  if (timer.value) clearInterval(timer.value); timer.value = null
+  timer.value = setInterval(() => { payStatus() }, 2000) // 轮巡查询用户是否支付
+}
+
+const formatDuration = (remainder) => {
+  // 将毫秒转换为秒
+  var seconds = Math.floor(remainder / 1000)
+  // 计算分钟和剩余的秒数
+  var minutes = Math.floor(seconds / 60)
+  var remainingSeconds = seconds % 60
+  // 格式化分钟和秒数，确保秒数为两位数（如果小于10，则前面补0）
+  minutes = minutes.toString().padStart(2, '0')
+  remainingSeconds = remainingSeconds.toString().padStart(2, '0')
+  // 返回格式化的字符串
+  return `${minutes}分${remainingSeconds}秒`
+}
+
+const clearTimer = () => {
+  if (timer.value) clearInterval(timer.value); timer.value = null
+  if (remainderTimer.value) clearInterval(remainderTimer.value); remainderTimer.value = null
+  remainderZhShow.value = ''
+}
+
+const remainderCalc = () => {
+  remainder -= 1000
+  remainderZhShow.value = formatDuration(remainder)
+  if (remainder <= 0) clearTimer()
+}
+
+const handleToOrder = () => {
+  router.push('/recruit/enterprise/tradingOrder?key=tab_recharge')
+}
+</script>
+
+<style scoped lang="scss">
+.packagesItem {
+  border: 1px solid var(--color-f3);
+  border-radius: 8px;
+  background-color: var(--color-f2f4f742);
+}
+.dailyPrice {
+  border-radius: 14px;
+  background-color: #dde3e94f;
+  padding: 2px 18px;
+  color: var(--color-666);
+}
+.active {
+  border: 2px solid #00897B;
+  .priceBox {
+    color: var(--v-primary-base);
+  }
+  .dailyPrice {
+    color: var(--v-error-base);
+    background-color: #fff4e7;
+  }
+}
+.custom-input-num {
+  border: none;
+  outline: none;
+  background-color: transparent;
+  width: 120px;
+  max-width: 120px;
+  text-align: center;
+  background-color: #d9d9d98c;
+  border-radius: 20px;
+  font-size: 20px;
+  color: var(--v-primary-base);
+}
+.code {
+  max-width: 1100px;
+  background-color: #f7f8fa;
+  border-radius: 6px;
+  margin: 0 auto;
+  &-left {
+    border: 1px solid #00897B;
+    border-radius: 6px;
+    padding: 5px;
+  }
+  &-right {
+    .price {
+      font-size: 30px;
+      font-weight: 700;
+      color: var(--v-error-base);
+    }
+  }
+}
+.vip {
+  width: 50px; 
+  height: 50px;
+  position: absolute; 
+  top: 0; 
+  right: 0;
+  overflow: hidden;
+  border-radius: 8px
+}
+.custom-point-show {
+  width: 100%;
+  text-align: center;
+  font-weight: normal;
+  color: gray;
+  font-size: 13px; 
+}
+:deep(.v-slide-group__content) {
+  background: none !important;
+}
+</style>

src/views/recruit/enterprise/membershipPackage/dynamic/package.vue

@@ -0,0 +1,50 @@
+<template>
+  <div class="d-flex list">
+    <div v-for="(val, index) in list" :key="index" class="list-item text-center cursor-pointer" :class="{'active': index === active}" @click="active = index">
+      <h4 class="mt-5">{{ val.title }}</h4>
+      <div class="color-primary">
+        <span>￥</span>
+        <span style="font-size: 35px;">{{ val.price }}</span>
+        <span> 元</span>
+      </div>
+      <div class="text-decoration-line-through color-666">原价：{{ val.originalPrice }}元</div>
+      <div class="font-size-14 color-999 mt-3 periodValidity py-2">有效期：120天</div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+defineOptions({ name: 'membershipPackageDynamicPackage' })
+import { ref } from 'vue'
+
+const active = ref(0)
+const list = [
+  { title: '1个职位', price: 399, originalPrice: 599 },
+  { title: '2个职位', price: 599, originalPrice: 799 },
+  { title: '3个职位', price: 799, originalPrice: 999 },
+  { title: '5个职位', price: 999, originalPrice: 1299 }
+]
+</script>
+
+<style scoped lang="scss">
+.list {
+  &-item {
+    width: 25%;
+    height: 172px;
+    background-color: #fcfcfd;
+    border: 1px solid #f3f3f3;
+    border-radius: 8px;
+    margin-right: 12px;
+    &:last-child {
+      margin-right: 0;
+    }
+    .periodValidity {
+      background-color: #f2f4f7;
+      border-radius: 0 0 8px 8px;
+    }
+  }
+  .active {
+    border: 1px solid #00897B;
+  }
+}
+</style>

src/views/recruit/enterprise/membershipPackage/index.vue

@@ -1,69 +1,27 @@
 <!-- 购买套餐 -->
 <template>
   <v-card class="card-box pa-3" style="min-width: 1100px;">
-    <!-- <v-tabs v-model="tab" align-tabs="center" color="rgb(195 15 15)">
-      <v-tab :value="0" class="font-weight-bold font-size-18">套餐列表</v-tab>
-      <v-tab :value="1" class="font-weight-bold font-size-18">当前套餐</v-tab>
+    <v-tabs v-model="tab" class="mb-3" align-tabs="center" color="primary" bg-color="#f7f8fa">
+      <v-tab :value="0">会员套餐</v-tab>
+      <v-tab :value="1">余额充值</v-tab>
     </v-tabs>
     <Package v-if="tab === 0"></Package>
-    <div v-if="tab === 1">
-      <empty :elevation="false" message="无购买的套餐内容" class="mt-15"></empty>
-    </div> -->
-
-    <div class="d-flex list">
-      <div v-for="(val, index) in list" :key="index" class="list-item text-center cursor-pointer" :class="{'active': index === active}" @click="active = index">
-        <h4 class="mt-5">{{ val.title }}</h4>
-        <div class="color-primary">
-          <span>￥</span>
-          <span style="font-size: 35px;">{{ val.price }}</span>
-          <span> 元</span>
-        </div>
-        <div class="text-decoration-line-through color-666">原价：{{ val.originalPrice }}元</div>
-        <div class="font-size-14 color-999 mt-3 periodValidity py-2">有效期：120天</div>
-      </div>
-    </div>
+    <Balance v-else></Balance>
   </v-card>
 </template>
 
 <script setup>
 defineOptions({name: 'enterprise-memberCenter-myAccount'})
 import { ref } from 'vue'
-// import Package from './components/package.vue'
+import Package from './dynamic/package.vue'
+import Balance from './dynamic/balance.vue';
+import { useRouter } from 'vue-router'
 
-// const tab = ref(0)
+const router = useRouter()
+const tab = ref(0)
 
-const active = ref(0)
-const list = [
-  { title: '1个职位', price: 399, originalPrice: 599 },
-  { title: '2个职位', price: 599, originalPrice: 799 },
-  { title: '3个职位', price: 799, originalPrice: 999 },
-  { title: '5个职位', price: 999, originalPrice: 1299 }
-]
+if (router.currentRoute.value.query.key) tab.value = Number(router.currentRoute.value.query.key)
 </script>
 
 <style lang="scss" scoped>
-:deep(.v-slide-group__content) {
-  background: linear-gradient(45deg, #ff8a04, transparent);
-}
-
-.list {
-  &-item {
-    width: 25%;
-    height: 172px;
-    background-color: #fcfcfd;
-    border: 1px solid #f3f3f3;
-    border-radius: 8px;
-    margin-right: 12px;
-    &:last-child {
-      margin-right: 0;
-    }
-    .periodValidity {
-      background-color: #f2f4f7;
-      border-radius: 0 0 8px 8px;
-    }
-  }
-  .active {
-    border: 1px solid #00897B;
-  }
-}
 </style>

src/views/recruit/enterprise/positionManagement/components/item.vue

@@ -58,8 +58,8 @@
               <span class="cursor-pointer actions" @click="handleAction(val.top ? 4 : 3, '', val)">{{ val.top ? '取消置顶' : $t('common.topping') }}</span>
               <span class="lines"></span>
               <span class="cursor-pointer actions" @click="handleAction(0, '', val)">{{ $t('common.close') }}</span>
-              <span class="lines"></span>
-              <span class="cursor-pointer actions" @click="handleEdit(val)">{{ $t('common.edit') }}</span>
+              <span v-if="val.edit" class="lines"></span>
+              <span v-if="val.edit" class="cursor-pointer actions" @click="handleEdit(val)">{{ $t('common.edit') }}</span>
             </div>
             <!-- <div v-if="tab === 3" class="cursor-pointer actions" @click="handleUpdateExpireTime(val)">修改到期时间</div> -->
             <span v-if="(val.status-0) === 99" class="cursor-pointer color-primary" @click="toPay(val)">去支付</span>

src/views/recruit/enterprise/tradingOrder/components/trading.vue

@@ -1,12 +1,11 @@
-<!--  -->
 <template>
   <div class="white-bgc pa-3 pt-3">
     <v-tabs v-model="tab" align-tabs="start" color="primary" bg-color="#f7f8fa">
       <v-tab value="tab_transaction">{{ '交易订单' }}</v-tab>
-      <!-- <v-tab value="tab_recharge">{{ '充值订单' }}</v-tab> -->
+      <v-tab value="tab_recharge">{{ '充值订单' }}</v-tab>
     </v-tabs>
     <Transaction v-if="tab === 'tab_transaction'"></Transaction>
-    <!-- <Recharge v-if="tab === 'tab_recharge'"></Recharge> -->
+    <Recharge v-if="tab === 'tab_recharge'"></Recharge>
   </div>
 </template>
 
@@ -14,7 +13,7 @@
 defineOptions({name: 'enterprise-memberCenter-tradingOrder'})
 import { ref } from 'vue'
 import Transaction from './trading/transaction.vue'
-// import Recharge from './trading/recharge.vue'
+import Recharge from './trading/recharge.vue'
 
 const tab = ref('tab_transaction')
 </script>

src/views/recruit/enterprise/tradingOrder/components/trading/recharge.vue

@@ -24,7 +24,7 @@ import { getEnterpriseCurrencyRechargePage } from '@/api/recruit/enterprise/memb
 
 const dataList = ref([])
 const headers = [
-  { title: '充值点数', key: '点数', value: item => rechargeRatio()*FenYuanTransform(item.payPrice), sortable: false },
+  { title: '充值M豆', key: '点数', value: item => rechargeRatio()*FenYuanTransform(item.payPrice), sortable: false },
   { title: '支付金额', key: 'payPrice', value: item => FenYuanTransform(item.payPrice)+'元', sortable: false },
   { title: '订单支付时间', key: 'payTime', value: item =>  timesTampChange(item.payTime), sortable: false },
   { title: '支付成功的外部订单号', key: 'payOrderChannelOrderNo', sortable: false },

src/views/recruit/enterprise/tradingOrder/index.vue

@@ -1,30 +1,30 @@
-<!-- 购买套餐 -->
 <template>
-  <v-card class="card-box pa-3" style="min-width: 1100px;">
-    <!-- <div class="tabsBox">
-      <v-tabs v-model="tab" align-tabs="center" color="var(--v-primary-base)">
-        <v-tab :value="0" class="font-weight-bold font-size-18">充值</v-tab>
-        <v-tab :value="1" class="font-weight-bold font-size-18">交易</v-tab>
-      </v-tabs>
-    </div> -->
-    <!-- <PointsAndBalance v-if="tab === 0"></PointsAndBalance> -->
-    <trading></trading>
-  </v-card>
+  <div class="white-bgc pa-3 pt-3">
+    <v-tabs v-model="tab" align-tabs="start" color="primary" bg-color="#f7f8fa">
+      <v-tab value="tab_transaction">{{ '交易订单' }}</v-tab>
+      <v-tab value="tab_recharge">{{ '充值订单' }}</v-tab>
+    </v-tabs>
+    <Transaction v-if="tab === 'tab_transaction'"></Transaction>
+    <Recharge v-if="tab === 'tab_recharge'"></Recharge>
+  </div>
 </template>
 
 <script setup>
 defineOptions({name: 'enterprise-memberCenter-myAccount'})
 import { ref } from 'vue'
-// import PointsAndBalance from './components/pointsAndBalance.vue'
-import trading from './components/trading.vue'
+import { useUserStore } from '@/store/user'
+import Transaction from './components/trading/transaction.vue'
+import Recharge from './components/trading/recharge.vue'
+import { useRouter } from 'vue-router'
 
-const tab = ref(0)
+const router = useRouter()
+const store = useUserStore()
+store.getEnterpriseUserAccountInfo()
+
+const tab = ref('tab_transaction')
+
+if (router.currentRoute.value.query.key === 'tab_recharge') tab.value = 'tab_recharge'
 </script>
 
 <style lang="scss" scoped>
-.tabsBox {
-  :deep(.v-slide-group__content) {
-    background: linear-gradient(45deg, #e2f0ef, transparent);
-  }
-}
 </style>