<template>
    <div>
        <div class='card'>
            <h3><strong>礼物匹配</strong></h3>
            <p>希望对方的性别是</p>
            <van-radio-group v-model="radio">
                <van-radio name="0" checked-color="#fd6740" style="float: left; margin-right: 20px">男</van-radio>
                <van-radio name="1" checked-color="#fd6740">女</van-radio>
            </van-radio-group>
            <p>礼物名称</p>
            <van-field
                    placeholder="给你的礼物起个名字吧"
                    v-model="presentName"
                    :error="pnError"
                    @click="pnError=false"
                    required
                    maxlength="10"
            />
            <p>我的礼物丨走心介绍</p>
            <van-cell-group>
                <van-field
                        type="textarea"
                        placeholder="请在此输入你的礼物介绍和礼物故事"
                        rows="5"
                        autosize
                        v-model="desc"
                        :error="descError"
                        @click="descError=false"
                        required
                        maxlength="300"
                />
            </van-cell-group>

            <p>礼物标签</p>
            <div style="margin-bottom: 20px">
                <van-checkbox-group v-model="result">
                    <van-checkbox
                            v-for="(item, index) in tags"
                            :key="index"
                            :name="index"
                            :style="(index+1) % 4 === 0 ? br : nobr"
                    >{{ item }}</van-checkbox>
                </van-checkbox-group>
            </div>

        </div>
        <div class="card">
            <p>上传礼物照片</p>
            <add-photo @uploadPhoto="onReadPhoto"/>
        </div>
        <van-button size="large" type="primary" @click="publishPresent">下一步</van-button>

    </div>
</template>

<script>
    import {
        Uploader, Icon,
        CellGroup, Field,
        RadioGroup, Radio,
        CheckboxGroup, Checkbox,
        Picker,
        Button,
        Toast
    } from 'vant';
    import {BasicFunction} from "../connector/basic-service";
    import AddPhoto from "../components/addPhoto";
    export default {
        name: "PresentRegister",
        components: {
            AddPhoto,
            [Uploader.name]: Uploader, [Icon.name]: Icon,
            [CellGroup.name]: CellGroup, [Field.name]: Field,
            [RadioGroup.name]: RadioGroup, [Radio.name]: Radio,
            [CheckboxGroup.name]: CheckboxGroup, [Checkbox.name]: Checkbox,
            [Picker.name]: Picker,
            [Button.name]: Button
        },
        data() {
            return {
                radio: '0',
                presentId: '',
                presentName: '',
                pnError: false,
                desc: '',
                descError: false,
                tags: [
                    "情怀","复古", "有趣", "学霸",  "实用",
                    "同年", "吃货", "佛系",  "土味", "活力",
                    "洋气", "精致",  "轻奢",  "其它",
                ],
                result: [],
                photo: null,
                nobr: "float: left; margin-right: 5px",
                br: ""
            }
        },
        methods: {
            publishPresent() {
                // 检验输入
                if (this.presentName.length === 0) {
                    this.pnError = true;
                    return;
                } else if (this.desc.length <= 15) {
                    this.descError = true;
                    Toast.fail('请输入至少15个字的礼物介绍');
                    return;
                } else if (this.photo === null) {
                    Toast.fail('请上传礼物照片');
                    return;
                }
                // post_present()
                let userId = localStorage.getItem("frontend-userid");
                // tags
                let gender_tags = '';
                this.result = this.result.sort(function (a, b) {
                    if (a > b) return 1;
                    else if (a < b) return -1;
                    else return 0;
                });
                console.log(this.result);
                let i = 0;
                this.result.forEach(res => {
                    for (i; i < res; i++) gender_tags += '0';
                    gender_tags += '1';
                    i++;
                });
                for (i; i < 14; i++) gender_tags += '0';
                gender_tags += this.radio;
                console.log(gender_tags);
                gender_tags = parseInt(gender_tags, 2);
                console.log(gender_tags);
                console.log(this.photo);

                let present = [{
                    "goodid": this.presentId,
                    "name": this.presentName,
                    "goodsNo": "A2", "modelId": "1",
                    "ownerId": userId.toString(),
                    "goodFirstKind": gender_tags.toString(),
                    "goodSecondKind": "2000", "sellPrice": "0.0", "marketPrice": "0.0", "costPrice": "0.0",
                    "upTime": getNowFormatDate(), "downTime": getNowFormatDate(), "createTime": getNowFormatDate(),
                    "storeNums": "1",
                    "img": this.photo.file.name,
                    "isDel": "0", "content": "none", "keywords": "none",
                    "description": this.desc,
                    "searchWords": "", "weight": "0.4", "point": "4", "unit": "10", "brandId": "1",
                    "visit": "1", "favorite": "1", "sort": "1", "listImg": "xx.jpg",
                    "smallImg": "xx.jpg", "specArray": "{}", "exp": "0"
                }];
                console.log(present);
                let that = this;
                let url = "updateBatch";
                if (this.presentId === '') url = "saveBatch";
                BasicFunction.get_data("smartGoods/" + url, function (response) {
                    console.log("------ Data Rcvd in PresentReg --------");
                    console.log(response);
                    if(response.ret === "10000"){
                        that.$router.push('index');
                    } else {
                        Toast.fail("上传失败，请检查网络");
                    }
                }, present);
            },
            onReadPhoto(file) {
                this.photo = file;
            }
        },
        created: function () {
            if(this.$route.query.present) {
                let present = this.$route.query.present;
                console.log(present);
                this.presentId = present.id;
                this.radio = present.gender.toString();
                this.presentName = present.presentName;
                this.desc = present.presentDesc;
                let tags = present.tags;
                let j = 13;
                for (let i = tags.length - 1; i >= 0; i--) {
                    if (tags.charAt(i) === '1') this.result.push(j);
                    j--;
                }
            }
        }
    }

    function getNowFormatDate() {
        let date = new Date();
        let seperator = "-";
        let year = date.getFullYear();
        let month = date.getMonth() + 1;
        let strDate = date.getDate();
        let hour = date.getHours();
        let minutes = date.getMinutes();
        let seconds = date.getSeconds();
        if (month >= 1 && month <= 9) {
            month = "0" + month;
        }
        if (strDate >= 0 && strDate <= 9) {
            strDate = "0" + strDate;
        }
        if (hour >= 0 && hour <= 9) {
            hour = "0" + hour;
        }
        if (minutes >= 0 && minutes <= 9) {
            minutes = "0" + minutes;
        }
        if (seconds >= 0 && seconds <= 9) {
            seconds = "0" + seconds;
        }
        let currentdate = year + seperator + month + seperator + strDate;
        currentdate = currentdate + ' ' + hour + ':' + minutes + ':' + seconds;
        return currentdate;
    }
</script>

<style scoped>
    p, h3 {
        color: #fd6740;
    }
    h3 {
        padding: 5px;
        border-bottom: solid 1px #e4e4e4;
    }
    .card {
        background-color: white;
        margin: 20px 20px;
        border: solid 1px #e4e4e4;
        padding: 15px;
        text-align: left;
    }
    .van-button {
        background-color: #fd6740;
        border-color: #fd6740;
        margin: 10px 0 10px;
        width: 85%;
    }
</style>