<template>
    <view class="container">
        <u--form ref="formRef" :model="form" :rules="rules" label-width="165px" label-position="top"
            :labelStyle="{ fontSize: '32rpx' }" errorType="toast">
            <!-- 物流单号输入 -->
            <u-form-item label="" prop="packageCode">
                <u-input :placeholderStyle="placeholderStyle" :customStyle="customStyle" v-model="form.packageCode"
                    placeholder="扫描/输入物流单号" border="surround" name="packageCode" />
            </u-form-item>

            <!-- 重量输入 -->
            <u-form-item label="重量（kg）" prop="actualWeight">
                <u-input :placeholderStyle="placeholderStyle" :customStyle="customStyle" v-model="form.actualWeight"
                    placeholder="请输入重量" border="surround" name="actualWeight" type="number" />
            </u-form-item>

            <!-- 图片上传 -->
            <u-form-item label="上传图片" prop="imgUrlList">
                <cy-upload v-model:filename="form.imgUrlList" name="imgUrlList" :limit="10" :max-size="1024 * 1024">
                </cy-upload>
            </u-form-item>
        </u--form>

        <!-- 底部按钮 -->
        <view class="fixed-bottom">
            <u-button size="large" type="warning" @click="scanCode" text="扫码" class="scan-button" />
            <u-button size="large" v-permission="'app:express:changeWeight:confirm'" type="success" @click="submitForm"
                text="提交" class="submit-button" />
        </view>
    </view>
</template>

<script setup>
import {
    ref,
    reactive
} from 'vue';
import {
    onLoad,
    onShow,
    onUnload
} from '@dcloudio/uni-app'
import cyUpload from '@/components/cy-upload/index.vue'

const placeholderStyle = "font-size:32rpx"
const customStyle = reactive({
    height: '90rpx'
})

const formRef = ref(null);
const form = ref({
    "packageCode": "",
    "batchNum": "",
    "godownId": '',
    "otherInfo": "",
    "actualWeight": '',
    "imgUrlList": []
});

const rules = {
    packageCode: [{
        required: true,
        message: '请输入物流单号',
        trigger: 'blur'
    }],
    actualWeight: [{
        required: true,
        message: '请输入重量',
        trigger: 'blur'
    }]
};

function scanCode() {
    uni.scanCode({
        success: (res) => {
            form.value.packageCode = res.result;
        },
        fail: (err) => {
            uni.$u.toast('扫码失败')
        }
    });
}

function submitForm() {
    formRef.value.validate().then((valid) => {
        if (valid) {
            uni.$u.http.post('/app/ordersign/changeWeight', form.value).then(res => {
                if (res.code == 200) {
                    uni.$u.toast('重量修改成功')
                    let text = code + '已提交审核'
                    uni.$u.ttsModule.speak(text)
                } else {
                    let text = code + '订单不存在'
                    uni.$u.ttsModule.speak(text)
                }
            })
        }
    });
}

onLoad(() => {
    // #ifdef APP-PLUS
    uni.$u.useGlobalEvent((e) => {
        form.value.packageCode = e.barcode
    })
    // #endif
})
onShow(() => {
    uni.$u.updateActivePageOnShow()
})
onUnload(() => {
    uni.$u.cleanupOnPageUnload();
});
</script>

<style>
page {
    background-color: #ffffff;
}
</style>
<style scoped>
.container {
    display: flex;
    flex-direction: column;
    padding: 20px;
}
</style>