<template>
    <div>
        <div class="card">
            <h3 > 交换成功！写一封感谢信送给ta吧~
            </h3>
            <van-cell-group>
                <van-field
                        type="textarea"
                        placeholder="请输入你想写给ta的感谢信..."
                        rows="5"
                        autosize
                        v-model="substance"
                        :error="assessError"
                        @click="assessError=false"
                        required
                        maxlength="300"
                />
            </van-cell-group>
            <div>
                <van-rate
                        v-model="value"
                        icon="like"
                        void-icon="like-o"
                />
                <van-button round type="primary" class='assess' @click="Assess">送出感谢信</van-button>
            </div>

        </div>
        <div style="position: relative;">
            <img :src="Assessimage" style="max-width: 100%; position: relative;"/>
        </div>
    </div>
</template>

<script>

    import {
        CellGroup, Field,
        Rate,
        Button,
        Toast
    } from 'vant'
    import {BasicFunction} from "../connector/basic-service";
    // import { wx } from "http://res2.wx.qq.com/open/js/jweixin-1.4.0.js";

    export default {
        name: "Assess",
        components: {
            [CellGroup.name]: CellGroup, [Field.name]: Field,
            [Rate.name]: Rate, [Button.name]: Button,
        },
        data() {
            return {
                value:0,
                substance: '',
                assessError: false,
                assessDo:{},
                active: 0,
                Assessimage: require('../assets/thanks.png'),

            }
        },
        methods: {
            assessPresent : function () {
                // 检验输入
                if (this.substance.length <= 15) {
                    this.assessError = true;
                    Toast.fail('请输入至少15个字的礼物评价！');
                    return;
                }
                else if(this.substance.length > 300) {
                    this.assessError = true;
                    Toast.fail('最多输入300个字的礼物评价！');
                    return;
                }
                if (!localStorage.getItem('frontend-userid')) {
                    this.$router.push('login');
                    return;
                }
                this.assessDo.content=this.substance;
                this.assessDo.ratingMajor=this.value;
                let orderId=BasicFunction.utils_get_param("orderId");
                // assess_present()
                console.log(present);
                BasicFunction.get_data("smartOrderFeedback/saveBatch?orderId="+orderId, function (response) {
                    console.log("------ Data Rcvd in assessPersent --------");
                    console.log(response);
                    if(response.ret === "10000"){
                        Toast.success("上传成功");
                    } else {
                        // 评价失败的处理
                        Toast.fail("上传失败，请检查网络");
                    }
                }, [this.assessDo]
                );

                // this.$router.push('index');
            },
            Assess() {
                this.$router.push('index');
            },
        },
        created: function () {
            if (!localStorage.getItem('frontend-userid')) {
                this.$router.push('login');
                return;
            }
            let that=this;
            let orderId=BasicFunction.utils_get_param("orderId");
            BasicFunction.get_data("smartOrderFeedback/list?orderId="+orderId, function (response) {
                    console.log("------ Data Rcvd in assessPersent --------");
                    console.log(response);
                    if(response.ret === "10000"){
                        var t=response.model.list;
                        that.assessDo=t[0];
                    } else {
                        // 评价失败的处理
                        Toast.fail("读取失败，请检查网络");
                    }
                }, [{}]
            );
        }
    }
</script>

<style scoped>
    h3 {
        color: #fd6740;
        text-align: left;
        padding: 5px;
        border-bottom: solid 1px #e4e4e4;
    }

    .assess {

    }
    .card {
        background-color: white;
        margin: 20px 20px;
        border: solid 1px #e4e4e4;
        padding: 15px;
    }

    .van-button {
        background-color: red;
        border-color: red;
        margin: auto;
        width: 50%;
    }
    .van-rate{
        margin: auto;
    }
    p{
        margin: auto;
        size: 5px;
    }

</style>