li.shaoyi 3 年 前
コミット
c4974b3aef

+ 17 - 4
src/hooks/component/index.ts

@@ -9,6 +9,14 @@ export function useComponent(callback?: (componentName?: string) => void) {
     const componentId = ref<string>() // 当前显示的组件
 
     /**
+     * 是否存在组件
+     * @returns 
+     */
+    const hasComponent = () => {
+        return components.size > 0
+    }
+
+    /**
      * 打开组件
      * @param componentName 
      */
@@ -37,17 +45,22 @@ export function useComponent(callback?: (componentName?: string) => void) {
     }
 
     /**
-     * 是否存在组件
+     * 组件关闭守卫
      * @returns 
      */
-    const hasComponent = () => {
-        return components.size > 0
+    const closeEach = () => {
+        if (hasComponent()) {
+            closeComponent()
+            return false
+        }
+        return true
     }
 
     return {
         componentId,
+        hasComponent,
         openComponent,
         closeComponent,
-        hasComponent,
+        closeEach,
     }
 }

BIN
src/packages/mobile/assets/images/lottery/lottery-hongbao.png


+ 1 - 1
src/packages/mobile/views/user/register/components/reward/index.less → src/packages/mobile/components/modules/reward/index.less

@@ -1,4 +1,4 @@
-.register-reward {
+.app-reward {
     display        : flex;
     justify-content: center;
     align-items    : center;

+ 18 - 9
src/packages/mobile/views/user/register/components/reward/index.vue → src/packages/mobile/components/modules/reward/index.vue

@@ -1,16 +1,16 @@
 <template>
-    <Overlay class="register-reward" :show="show">
-        <div class="register-reward__wrapper">
+    <Overlay class="app-reward" :show="show">
+        <div class="app-reward__wrapper" @click.stop>
             <img src="@mobile/assets/images/hongbao.png" />
             <div class="content" v-if="!showRedEnvelope">
-                <h1>注册成功!</h1>
+                <h1>{{ title }}</h1>
             </div>
             <div :class="['content', showRedEnvelope ? 'is-show' : 'is-hide']">
                 <h1>恭喜获得红包</h1>
-                <p>{{ value }}</p>
+                <p>{{ value?.toFixed(2) }}</p>
             </div>
             <div class="buttons">
-                <Button @click="router.back()" round v-if="showRedEnvelope">好的</Button>
+                <Button @click="$emit('click')" round v-if="showRedEnvelope">{{ buttonText }}</Button>
                 <Button @click="showRedEnvelope = true" round v-else>打开红包</Button>
             </div>
         </div>
@@ -18,11 +18,10 @@
 </template>
 
 <script lang="ts" setup>
-import { shallowRef } from 'vue'
+import { shallowRef, watch } from 'vue'
 import { Button, Overlay } from 'vant'
-import { useNavigation } from '@/hooks/navigation'
 
-defineProps({
+const props = defineProps({
     show: {
         type: Boolean,
         default: false
@@ -30,11 +29,21 @@ defineProps({
     value: {
         type: Number,
         default: 0
+    },
+    title: String,
+    buttonText: {
+        type: String,
+        default: '好的'
     }
 })
 
-const { router } = useNavigation()
 const showRedEnvelope = shallowRef(false)
+
+watch(() => props.show, (status) => {
+    if (status) {
+        showRedEnvelope.value = false
+    }
+})
 </script>
 
 <style lang="less" scoped>

+ 7 - 1
src/packages/mobile/views/credit/lottery/index.less

@@ -56,7 +56,6 @@
             background   : linear-gradient(180deg, #FFE8A2 0%, #FFD478 100%);
             box-shadow   : 0 .04rem .12rem 0 #FCA442;
             border-radius: .32rem;
-            padding      : .36rem;
 
             &-prize {
                 display    : flex;
@@ -128,11 +127,18 @@
                 }
             }
 
+            &-image {
+                img {
+                    width: 100%;
+                }
+            }
+
             &-info {
                 display        : flex;
                 justify-content: space-between;
                 align-items    : center;
                 color          : #E84B2D;
+                padding        : .24rem .36rem;
             }
         }
     }

+ 8 - 4
src/packages/mobile/views/credit/lottery/index.vue

@@ -9,7 +9,7 @@
         <div class="credit-lottery__container">
             <div class="credit-lottery__box credit-lottery__draw">
                 <div class="block">
-                    <ul class="block-prize">
+                    <!-- <ul class="block-prize">
                         <li>
                             <span>一等奖</span>
                             <span>现金红包</span>
@@ -24,6 +24,9 @@
                     </ul>
                     <div class="block-button">
                         <button type="button" @click="onSubmit">立即抽奖</button>
+                    </div> -->
+                    <div class="block-image" @click="onSubmit">
+                        <img src="@mobile/assets/images/lottery/lottery-hongbao.png" />
                     </div>
                     <div class="block-info">
                         <span>当前积分:{{ userAccount.curscore ?? 0 }}</span>
@@ -36,12 +39,13 @@
                     <dt class="block-title">- 我的红包 -</dt>
                     <dd class="block-item" v-for="(item, index) in creditList" :key="index">
                         <span>{{ item.createtime }}</span>
-                        <span>{{ item.redpacketvalue }}</span>
+                        <span>{{ item.redpacketvalue.toFixed(2) }}</span>
                     </dd>
                 </dl>
             </div>
         </div>
-        <Reward v-model:show="showReward" :value="redEnvelope.RedPacketAmount" :level="redEnvelope.GearLevel" />
+        <app-reward :show="showReward" :value="redEnvelope.RedPacketAmount" button-text="开心收下"
+            @click="showReward = false" />
     </app-view>
 </template>
 
@@ -50,7 +54,7 @@ import { shallowRef } from 'vue'
 import { Toast } from 'vant'
 import { fullloading } from '@/utils/vant'
 import { useCreditLottery } from '@/business/credit'
-import Reward from './components/reward/index.vue'
+import AppReward from '@mobile/components/modules/reward/index.vue'
 
 const { creditConfig, userAccount, creditList, redEnvelope, formSubmit, formRefresh } = useCreditLottery()
 const showReward = shallowRef(false) // 显示抽奖红包

+ 3 - 0
src/packages/mobile/views/goods/details/components/address/index.less

@@ -0,0 +1,3 @@
+.goods-details-address {
+    background-color: #f6f6f6;
+}

+ 19 - 3
src/packages/mobile/views/goods/details/components/address/index.vue

@@ -1,9 +1,25 @@
 <template>
-    <app-modal class="app-trade" direction="right" height="100%">
-        <app-navbar title="自提信息" />
+    <app-modal direction="right" height="100%" v-model:show="showModal">
+        <app-view class="goods-details-address">
+            <template #header>
+                <app-navbar title="自提信息" @back="closed" />
+            </template>
+        </app-view>
     </app-modal>
 </template>
 
 <script lang="ts" setup>
+import { shallowRef } from 'vue'
 import AppModal from '@/components/base/modal/index.vue'
-</script>
+
+const showModal = shallowRef(true);
+
+// 关闭弹窗
+const closed = () => {
+    showModal.value = false
+}
+</script>
+
+<style lang="less">
+@import './index.less';
+</style>

+ 12 - 6
src/packages/mobile/views/goods/details/index.vue

@@ -21,29 +21,34 @@
                     :options="presaleApplyDeposits" v-if="presaleApplyId" />
                 <Field v-model="formData.Qty" name="Qty" type="digit" label="采购数量" placeholder="必填"
                     :rules="formRules.Qty" />
-                <Field label="收货信息" placeholder="请输入" @click="showAddress = true" is-link />
+                <Field label="收货信息" placeholder="请输入" @click="openComponent('address')" is-link />
             </CellGroup>
         </Form>
         <Button type="primary" @click="formRef?.submit" round block>采购下单</Button>
-        <app-address v-model:show="showAddress" />
+        <component :is="componentMap.get(componentId)" @closed="closeComponent" v-if="componentId" />
     </app-view>
 </template>
 
 <script lang="ts" setup>
-import { shallowRef, computed } from 'vue'
+import { shallowRef, computed, defineAsyncComponent } from 'vue'
 import { CellGroup, Cell, Button, Field, Form, FormInstance, Checkbox, Toast, FieldRule, Popup, Picker, PickerOption } from 'vant'
 import { fullloading, dialog } from '@/utils/vant'
+import { useComponent } from '@/hooks/component'
 import { useNavigation } from '@/hooks/navigation'
 import { useWrstandardDetails } from '@/business/goods'
 import { usePurchaseOrderDesting } from '@/business/trade'
 import AppSelect from '@mobile/components/base/select/index.vue'
-import AppAddress from './components/address/index.vue'
 import Long from 'long'
 
-const { getQueryStringToNumber } = useNavigation()
+const componentMap = new Map<string, unknown>([
+    ['address', defineAsyncComponent(() => import('./components/address/index.vue'))],
+])
+
+const { componentId, openComponent, closeComponent, closeEach } = useComponent()
+const { getQueryStringToNumber, beforeRouteLeave } = useNavigation()
+
 const wrstandardid = getQueryStringToNumber('wrstandardid')
 const formRef = shallowRef<FormInstance>()
-const showAddress = shallowRef(false)
 
 const { details, getWrstandardDetails } = useWrstandardDetails(wrstandardid)
 const { formData, formSubmit } = usePurchaseOrderDesting()
@@ -111,6 +116,7 @@ const onSubmit = () => {
 }
 
 getWrstandardDetails()
+beforeRouteLeave(() => closeEach())
 </script>
 
 <style lang="less">

+ 1 - 1
src/packages/mobile/views/home/components/main/index.less

@@ -39,7 +39,7 @@
         }
 
         &--body {
-            padding    : .24rem .32rem;
+            padding    : .24rem;
             padding-top: 0;
 
             .van-swipe {

+ 2 - 4
src/packages/mobile/views/home/components/main/index.vue

@@ -61,10 +61,8 @@
         </div>
       </div> -->
       <div class="home-main__news">
-        <Cell class="titlebar" title-class="titlebar-title" value-class="titlebar-more" title="市场资讯" />
-        <span>
-          <a @click="routerTo('news-list')">更多资讯</a>
-        </span>
+        <Cell class="titlebar" title-class="titlebar-title" value-class="titlebar-more" title="市场资讯" value="更多资讯"
+          :to="{ name: 'news-list' }" is-link />
         <CellGroup class="article">
           <template v-for="(item, index) in newsList" :key="index">
             <Cell class="article-item" title-class="article-item__title" value-class="article-item__time"

+ 3 - 3
src/packages/mobile/views/user/register/index.vue

@@ -43,7 +43,7 @@
       <div class="g-form__footer">
         <Button type="primary" @click="formRef?.submit" round block>免费注册</Button>
       </div>
-      <Reward :show="showReward" :value="redEnvelope" />
+      <app-reward :show="showReward" :value="redEnvelope" title="注册成功!" button-text="去登录" @click="router.back()" />
     </template>
   </app-view>
 </template>
@@ -57,7 +57,7 @@ import { validateRules } from '@/constants/regex'
 import { useNavigation } from '@/hooks/navigation'
 import { userRegister, sendRegisterVerifyCode, queryMyRegisterMoney } from '@/services/api/common'
 import cryptojs from 'crypto-js'
-import Reward from './components/reward/index.vue'
+import AppReward from '@mobile/components/modules/reward/index.vue'
 // import AppQrcodeScan from '@mobile/components/base/qrcode-scan/index.vue'
 
 const { router, routerTo } = useNavigation()
@@ -69,7 +69,7 @@ const redEnvelope = ref(0) // 红包金额
 
 // 倒计时函数
 const countdown = useCountDown({
-  time: 60 * 1000,
+  time: 30 * 1000,
   onFinish: () => {
     countdown.reset()
     isCountdown.value = false