<template>
    <div class="image-cropper">
        <image-cropper ref="imageCropper" @crop="handleCrop" />
    </div>
</template>
<script>
import { post } from "@/request/api.js";
import imageCropper from "@/components/image-cropper/image-cropper.vue";
export default {
    name: "image-cropper",
    props: {},
    components: { imageCropper },
    data() {
        return {
            headImgPath: uni.getStorageSync("headImgPath"),
            userinfo: uni.getStorageSync("userinfo"),
        };
    },
    methods: {
        handleCrop(e) {
            this.$up(e.tempFilePath).then((res) => {
                post("v1/user/setup", {
                    head_pic: res,
                    nickname: this.userinfo.nickname
                }).then(async (res) => {
                    await uni.userfun();
                    setTimeout(() => {
                        uni.navigateBack();
                    }, 100);
                });
            });
        },
    },
    onLoad(da) {
        this.$refs.imageCropper.initImage(this.headImgPath);
    },
    onShow() {},
    mounted() {},
};
</script>
<style scoped lang='scss'>
</style>