i

src/components/Auth.vue

@@ -0,0 +1,91 @@
+<template>
+    <nut-overlay v-model:visible="visible" :close-on-click-overlay="false">
+        <view class="text">
+            <view>授权提醒</view>
+            <view style="margin-top: 10px"
+                >请授权头像信息，以便为您提供更好的服务！</view
+            >
+            <view class="bom">
+                <view class="btn b" @click="onCancel">随便逛逛</view>
+                <view class="btn a" @tap="onOk">去授权</view>
+            </view>
+        </view>
+    </nut-overlay>
+</template>
+
+<script setup lang="ts">
+// import { computed, ref } from "vue";
+import Taro from "@tarojs/taro";
+import { login } from "../api/user";
+
+defineProps({
+    visible: {
+        type: Boolean,
+        default: false,
+    },
+});
+
+const emit = defineEmits(["update:visible", "update:info"]);
+
+const onCancel = () => {
+    emit("update:visible", false);
+};
+
+const onOk = () => {
+    Taro.getUserProfile({
+        desc: "用于完善会员资料",
+        success: async (user) => {
+            console.log(user);
+            Taro.login({
+                success: async ({ code }) => {
+                    const { data }: any = await login({
+                        code: code,
+                    });
+                    Taro.setStorageSync("token", data.token);
+                    emit("update:visible", false);
+                },
+                fail: (err) => {
+                    console.log(err);
+                },
+            });
+        },
+        fail: (err) => {
+            console.log(err);
+        },
+    });
+};
+</script>
+
+<style lang="scss">
+.text {
+    text-align: center;
+    background-color: #fff;
+    width: 500px;
+    padding: 20px;
+    margin: auto;
+    transform: translateY(150%);
+    border-radius: 10px;
+
+    .bom {
+        display: flex;
+        justify-content: space-evenly;
+        align-items: center;
+        margin-top: 20px;
+        .btn {
+            width: 150px;
+            padding: 10px;
+            border-radius: 15px;
+            color: #fff;
+            margin-bottom: 10px;
+        }
+
+        .a {
+            background-color: #ff5000;
+        }
+
+        .b {
+            background-color: rgba(255, 80, 0, 0.5);
+        }
+    }
+}
+</style>

src/components/Pay.vue

@@ -0,0 +1,124 @@
+<template>
+    <nut-popup
+        position="bottom"
+        closeable
+        round
+        safe-area-inset-bottom
+        :close-on-click-overlay="false"
+        :style="{ height: 'auto' }"
+        v-model:visible="isShowPay"
+        @click-close-icon="closePay"
+    >
+        <view class="div">
+            <view style="text-align: center">支付方式</view>
+            <nut-cell-group>
+                <nut-cell
+                    v-if="payType === 'wx'"
+                    title="微信支付"
+                    desc="使用微信快捷支付"
+                    is-link
+                    @click="goPay()"
+                >
+                    <template v-slot:icon>
+                        <IconFont
+                            size="30"
+                            name="https://img11.360buyimg.com/imagetools/jfs/t1/137646/13/7132/1648/5f4c748bE43da8ddd/a3f06d51dcae7b60.png"
+                        />
+                    </template>
+                </nut-cell>
+                <nut-cell
+                    v-if="payType === 'jf'"
+                    title="积分支付"
+                    desc="剩余积分:18888"
+                    is-link
+                    @click="goPay()"
+                >
+                    <template v-slot:icon>
+                        <IconFont
+                            size="30"
+                            name="https://img11.360buyimg.com/imagetools/jfs/t1/137646/13/7132/1648/5f4c748bE43da8ddd/a3f06d51dcae7b60.png"
+                        />
+                    </template>
+                </nut-cell>
+            </nut-cell-group>
+        </view>
+    </nut-popup>
+</template>
+
+<script setup lang="ts">
+import {IconFont} from "@nutui/icons-vue-taro";
+import Taro from "@tarojs/taro";
+import {payOrder} from "../api/user";
+
+const prop = defineProps({
+    isShowPay: {
+        required: true,
+        type: Boolean,
+        default: false,
+    },
+    payType: {
+        required: true,
+        type: String,
+        default: "wx",
+    },
+});
+
+const emit = defineEmits(["errPay", "closePay"]);
+
+const goPay = async () => {
+    if (prop.payType === "wx") {
+        const {data} = await payOrder({gid: 1, token: Taro.getStorageSync("token")});
+        console.log(data);
+        // Taro.request({
+        //     url: "http://192.168.2.3:9000/app/order/place",
+        //     method: "POST",
+        //     data: {
+        //         gid: 1,
+        //         token: Taro.getStorageSync("token"),
+        //     },
+        //     success: function ({data}) {
+        //         console.log(data);
+        //         Taro.requestPayment({
+        //             timeStamp: data.data.data.timeStamp,
+        //             nonceStr: data.data.data.nonceStr,
+        //             package: data.data.data.package,
+        //             signType: "MD5",
+        //             paySign: data.data.data.paySign,
+        //             success: function (res) {
+        //                 console.log(res);
+        //             },
+        //             fail: function (res) {
+        //                 console.log("1111", res);
+        //                 emit("errPay", false);
+        //             },
+        //         });
+        //     },
+        //     fail: function (res) {
+        //         console.log("1111", res);
+        //         emit("errPay", false);
+        //     },
+        // });
+    }
+};
+
+const closePay = () => {
+    emit("closePay", false);
+};
+</script>
+
+<style lang="scss">
+.nut-popup {
+    .nut-popup__container {
+        border-radius: 10px;
+    }
+}
+
+.div {
+    padding: 20px;
+    // text-align: center;
+
+    .nut-cell {
+        align-items: center;
+    }
+}
+</style>