szugift-fe/sourcecode/h5app/vue/src/views/giftDetail.vue

<template>
    <div>
        <nav-bar path="index" title="礼品卡"/>
        <!--对方的礼物信息-->
        <gift-card
                v-if="myPresent.status === 2 || myPresent.status === 3"
                :present-img="recievedPresent.imgUrl"
                :present-name="recievedPresent.name"
                :present-desc="recievedPresent.desc_long"
                :owner="1"
                :placeId="recievedPresent.placeId"
                :gender="recievedPresent.gender"
                :status="recievedPresent.status"
                :wechat="recievedPresent.wechat"
        />
        <!--我写的感谢信-->
        <div class="letter" v-if="recievedPresent.comment.length !== 0">
            <p style="font-size: 110%"><strong>我送出的感谢信</strong></p>
            <p>{{recievedPresent.comment}}</p>
        </div>
        <!--我的礼物信息-->
        <gift-card
                :present-img="myPresent.imgUrl"
                :present-name="myPresent.name"
                :present-desc="myPresent.desc_long"
                :owner="0"
                :placeId="myPresent.placeId"
                :gender="myPresent.gender"
                :status="myPresent.status"
                :wechat="myPresent.wechat"
        />
        <div class="letter" v-if="myPresent.comment.length !== 0">
            <p style="font-size: 110%"><strong>我收到的感谢信</strong></p>
            <p>{{myPresent.comment}}</p>
        </div>
        <div class="letter" v-if="myPresent.status === 4">
            <p><strong>审核未通过，请前往首页重新发布礼物！</strong></p>
            <p v-if="reason.length !== 0">原因：{{reason}}</p>
        </div>
        <div style="height: 100px; width: 100%"></div>
        <img src="http://pjczv6ygf.bkt.clouddn.com/present_card_bottom.png"
             style="position: fixed; bottom: 100px; max-width: 100%; z-index: -1"
        />
        <div
                v-if="myPresent.status === 2"
                style="position: fixed; bottom: 0; width: 100%; background-color: #fff6e3"
        >
            <van-button
                    type="primary" size="large"
                    style="background-color: #fd6740; border-color: #fd6740; width: 85%;"
                    @click="toWriteComment"
            >确认交换成功</van-button>
            <p>交换成功可以开始接收对方发来的感谢信哦</p>
        </div>
        <div
                v-if="myPresent.status === 0 || myPresent.status === 1 || myPresent.status === 4"
                style="position: fixed; bottom: 0; width: 100%"
        >
            <van-button
                    type="default" size="large"
                    style="width: 85%;"
                    @click="editPresent"
                    v-if="myPresent.status !== 4"
            >修改礼物</van-button>
            <van-button
                    type="warning" size="large"
                    style="width: 85%; margin: 10px 0 10px"
                    @click="deletePresent"
            >删除礼物</van-button>
        </div>
    </div>
</template>

<script>
    import GiftCard from "../components/giftCard";
    import {Button, Dialog, Toast} from 'vant'
    import NavBar from "../components/navBar";
    import {BasicFunction} from "../connector/basic-service";
    export default {
        name: "giftDetail",
        components: {
            NavBar,
            GiftCard,
            [Button.name]: Button,
        },
        data() {
            return {
                myPresent: {
                    placeId: 1,
                    comment: '',
                },
                reason: '',
                recievedPresent: {
                    comment: ''
                }
            }
        },
        methods:{
            editPresent: function() {
                Toast.loading({
                    mask: true,
                    message: '加载中...',
                    duration: 500
                });
                let p = this.myPresent;
                this.$router.push({path: 'presentRegister', query: {present: p}});
            },
            deletePresent: function() {
                Dialog.confirm({
                    message: '确认删除礼物吗？'
                }).then(() => {
                    // on confirm
                    // TODO: 考虑 updateBatch, 就是需要 将isDel设为1， 配合首页查找进行过滤
                    Toast.loading({
                        mask: true,
                        message: '加载中...',
                        duration: 500
                    });
                    let that = this;
                    BasicFunction.get_data("smartGoods/list?goodid=" + this.myPresent.id, function (response) {
                        // console.log("------ Data Rcvd in detail --------");
                        // console.log(response);
                        try {
                            let list = response.model.list;
                            if (response.ret === "10000") {
                                list[0].isDel = 1;
                                // console.log(list);
                                BasicFunction.get_data("smartGoods/updateBatch", function (response) {
                                    // console.log(response);
                                    if (response.ret === '10000') {
                                        Toast.success('删除成功');
                                        that.$router.push('index');
                                    } else {
                                        Toast.fail('删除失败，请检查网络');
                                    }
                                }, list)
                            } else Toast.fail('获取资源失败');
                        } catch (e) {
                            console.warn(e);
                            Toast.fail('获取资源失败');
                        }
                    }, {});
                }).catch(() => {
                    // on cancel
                });
            },
            toWriteComment: function () {
                this.$router.push('assess');
            }
        },
        created: function () {
            if (!localStorage.getItem('frontend-userid')) {
                this.$router.push('login');
                return;
            }
            let present = this.$route.query.present;
            // console.log(this.$route.query.present);
            let userid = localStorage.getItem('frontend-userid');
            let that = this;
            present.comment = '';
            BasicFunction.get_data('smartIdentity/list?userId=' + userid, function (res) {
                // console.log(res);
                try {
                    let identity = res.model.list[0];
                    if (res.ret === '10000') {
                        present.placeId = identity.dormDistrict;
                        present.wechat = identity.userWxAccount;
                        that.myPresent = present;
                        // console.log(that.myPresent);
                        if (present.status === 3) BasicFunction.get_data('smartOrderFeedback/list?goodId=' + present.id, function (res) {
                            // console.log(res);
                            try {
                                let comment = res.model.list[0];
                                if (res.ret === '10000') {
                                    if (comment.length === 0) that.myPresent.comment = '暂未收到';
                                    else that.myPresent.comment = comment.content;
                                } else Toast.fail('获取信息失败');
                            } catch (e) {
                                console.warn(e);
                                Toast.fail('获取信息失败');
                            }
                        }, {});
                        if (present.status === 4) BasicFunction.get_data('smartGoodReview/list?goodId=' + present.id, function (res) {
                            // console.log(res);
                            if (res.ret === '10000') {
                                if (res.model.list.length !== 0) that.reason = res.model.list[0].displayNote;
                            } else Toast.fail('获取信息失败');
                        }, {});
                    } else Toast.fail('获取信息失败');
                } catch (e) {
                    console.warn(e);
                    Toast.fail('获取信息失败');
                }
            }, {});
        }
    }

</script>

<style scoped>
    .letter {
        background-color: white;
        margin: 20px 20px;
        border: solid 1px #e4e4e4;
        padding: 0 15px;
        text-align: left;
    }
</style>