newyqlm/pages/friend/userset.vue

<template>
    <view class="page">
        <view class="usertop" v-if="from!='detail'">
            <view @tap='openinfo()'>
                <view class="avatar">
                    <image :src="image_cache(userinfo.avatar)"></image>
                </view>
                <view class="nickname">
                    {{userinfo.showname}}
                </view>
                <view class="icon">
                    <uni-icons type='arrowright'></uni-icons>
                </view>
            </view>
            <view @tap="addgroup()">
                <view class="avatar">
                    <image src="../../static/img/icon-plus.png"></image>
                </view>
                <view class="nickname">
                    发起群聊
                </view>
                <view class="icon">

                </view>
            </view>
        </view>
        <ul class="profile" @click="search()" style="height: 40px;line-height: 40px;">
            <li>聊天记录</li>
            <li>
                <div class="tagshow" style="width: 100%;">
                </div>
            </li>
            <li>
                <uni-icons type='arrowright'></uni-icons>
            </li>
        </ul>
        <ul class="profile" style="height: 40px;line-height: 40px;">
            <li>备注名：</li>
            <li>
                <button class="btn" @tap="sub_rename()">修改</button>
                <input type="text" class="input1" id="nickname" placeholder="请输入备注名"
                    style="width: 100px;text-align:left;float: right;" v-model="markname" maxlength="10" />

            </li>

        </ul>

        <ul class="profile" style="height: 40px;line-height: 40px;">
            <li>设为置顶：</li>
            <li>
                <switch :checked="istop" @change="user_setmenu('top')" style="vertical-align: middle;" />

            </li>

        </ul>
        
        <ul class="profile" style="height: 40px;line-height: 40px;">
            <li>消息免打扰：</li>
            <li>
                <switch :checked="no_tip" @change="user_setmenu('tip')" style="vertical-align: middle;" />

            </li>

        </ul>
        <ul class="profile" style="height: 40px;line-height: 40px;">
            <li>加入黑名单：</li>
            <li>
                <switch :checked="backlist" @change="user_setmenu('backlist')" style="vertical-align: middle;" />

            </li>

        </ul>



        <ul v-if="userinfo.from!='system'" class="profile" @tap="deleteFriend()"
            style="height: 40px;line-height: 40px;text-align: center;color: #007AFF;">
            删除好友
        </ul>
        <ul v-if="userinfo.from!='system'" class="profile" @tap="jbFriend()"
            style="height: 40px;line-height: 40px;text-align: center;color: #007AFF;">
            举报
        </ul>


    </view>
</template>

<script>
    import {
        mapState
    } from 'vuex';
    import api from '../../library/index.js'
    import http from '../../library/http.js'
    import uniIcons from '../../components/uni-icons/uni-icons.vue'
    export default {
        components: {
            uniIcons

        },
        data() {
            return {
                system: uni.getStorageSync('system'),
                userinfo: [],
                group_id: 0,
                userid: 0,
                myid: uni.getStorageSync('access_token'),
                group_users: [],
                group_user: [],
                thistype: '',
                usertype: '',
                markname: '',
                istop: false,
                no_tip: false,
                backlist: false,
                myuser: uni.getStorageSync('userInfo'),
                from: ''
            }
        },
        computed: {

        },
        methods: {
            search() {
                console.log('查找聊天记录');
                uni.navigateTo({
                    url: '/pages/index/record?group_id=' + this.userid + '&isgroup=0'
                })
            },
            user_setmenu(type) {
                if (type == 'top') {
                    this.istop = !this.istop;
                    var msgtop = uni.getStorageSync('msgtop') ? uni.getStorageSync('msgtop') : [];
                    if (this.istop) {
                        msgtop.push('U' + this.userid)
                    } else {
                        for (var i = 0; i < msgtop.length; i++) {
                            if (msgtop[i] == 'U' + this.userid) {
                                msgtop.splice(i, 1)
                            }
                        }
                    }
                    uni.setStorageSync('msgtop', msgtop);
                    this.$store.commit('chat/set_istop');
                    var data = {
                        cache_key: 'U' + this.userid,
                        userid: this.myid,
                        istop: this.istop
                    };

                    http.setWait(false).get('group.php?act=set_msgtop', data).then(res => {

                    })
                }
                if (type == 'tip') {
                    this.no_tip = !this.no_tip;
                    var msgtop = uni.getStorageSync('msgnotip') ? uni.getStorageSync('msgnotip') : [];
                    if (this.no_tip) {
                        msgtop.push('U' + this.userid)
                    } else {
                        for (var i = 0; i < msgtop.length; i++) {
                            if (msgtop[i] == 'U' + this.userid) {
                                msgtop.splice(i, 1)
                            }
                        }
                    }
                    uni.setStorageSync('msgnotip', msgtop);
                    var data = {
                        cache_key: 'U' + this.userid,
                        userid: this.myid,
                        notip: this.no_tip
                    };

                    http.setWait(false).get('group.php?act=set_msgnotip', data).then(res => {

                    })

                }


                if (type == 'backlist') {
                    this.backlist = !this.backlist;
                    if (this.backlist == true) {
                        uni.showModal({
                            title: '提示',
                            content: '加入黑名单后将无法收到对方的消息\n确认要把' + this.userinfo.nickname + '加入名单？',
                            showCancel: true,
                            cancelText: '取消',
                            confirmText: '确认',
                            success: res => {
                                if (res.confirm) {
                                    this.addbacklist();
                                } else {
                                    this.backlist = false;
                                }
                            }
                        });
                    } else {
                        this.addbacklist();
                    }

                }

            },
            addbacklist() {
                http.setWait(false).get('user.php?act=backlist', {
                    id: this.userid,
                    userid: this.myid
                }).then(res => {
                    this.getmyinfo();
                    if (this.backlist == true) this.delete_msg('U' + this.userid);
                })
            },
            sub_rename() {
                var data = {
                    friend_uid: this.userid,
                    userid: this.myid,
                    mark: this.markname
                };
                http.setWait(false).get('user.php?act=setmark', data).then(res => {
                    uni.showToast({
                        title: "备注成功",
                        icon: 'none'
                    })
                    this.getuserinfo(this.userid);
                })

            },
            deleteFriend() {
                var that = this;
                uni.showModal({
                    title: '提示',
                    content: '确定要删除好友吗？',
                    showCancel: true,
                    cancelText: '取消',
                    confirmText: '删除',
                    success: res => {
                        if (res.confirm) {
                            api.deleteFriend({
                                friendid: that.userid,
                                userid: that.myid
                            }).then(res => {
                                this.$toast('删除成功').then(() => {

                                    this.delete_msg('U' + that.userid);
                                    uni.reLaunch({
                                        url: '../index/index'
                                    });
                                });
                            });
                        }
                    }
                });
            },
            getmyinfo() {
                var postdata = {
                    id: uni.getStorageSync('access_token')
                };
                http.setWait(false).post('user.php?act=userinfo', postdata).then(res => {
                    this.myuser = res.data;
                    uni.setStorageSync('userInfo', this.myuser)
                    var backlist = this.myuser.backlist.toString();
                    if (backlist.indexOf(this.userid) > -1) this.backlist = true;
                    else this.backlist = false;
                })

            },
            getuserinfo(userid) {

                if (uni.getStorageSync('members_' + userid)) this.userinfo = uni.getStorageSync('members_' + userid);

                http.setWait(false).get('user.php?act=userdetail', {
                    id: userid,
                    group_id: 0,
                    userid: this.myid
                }).then(res => {
                    if (res.code == 200) {
                        this.isloading = false;

                        this.userinfo = res.data;
                        this.markname = this.userinfo.nickname;
                        uni.setStorageSync('members_' + userid, res.data)
                    } else {
                        uni.showToast({
                            title: '网络错误，请稍后再试',
                            icon: 'none'
                        })
                    }


                })

            },
            openinfo() {
                uni.redirectTo({
                    url: 'detail?id=' + this.userid + '&from=chat'
                })
            },
            addgroup() {
                uni.navigateTo({
                    url: 'userlist?disabled_id=' + this.userid + '&next=group/create&subtitle=立即创建'
                })
            },
            init() {
                var msgtop = uni.getStorageSync('msgtop');
                var istop = 0;
                for (var i = 0; i < msgtop.length; i++) {
                    if (msgtop[i] == 'U' + this.userid) {
                        this.istop = true;
                        break;
                    }
                }

                var msgnotip = uni.getStorageSync('msgnotip');
                for (var i = 0; i < msgnotip.length; i++) {
                    if (msgnotip[i] == 'U' + this.userid) {
                        this.no_tip = true;
                        break;
                    }
                }

                var backlist = this.myuser.backlist;
                if (backlist.indexOf(this.userid) > -1) this.backlist = true;
                else this.backlist = false;


            },
            jbFriend() {
                uni.showActionSheet({
                    itemList: ['发布不适当内容', '存在欺诈骗钱行为','此账号可能被盗用了','存在侵权行为','冒充他人'],
                    success: function(res) {
                        console.log(res, '上传')
                        uni.showModal({
                            content:'提交成功，请等待平台审核。',
                            showCancel:false
                        })
                    },
                    fail: function(res) {
                        erro(res)
                        console.log(res.errMsg);
                    }
                });
            }

        },

        onShow() {

        },
        onLoad(opts) {
            this.userid = opts.id;
            if (opts.from) this.from = opts.from;
            if (uni.getStorageSync('members_' + this.userid)) {
                this.userinfo = uni.getStorageSync('members_' + this.userid);
                this.markname = this.userinfo.nickname;
            }
            this.getuserinfo(this.userid);
            this.init();
        }
    }
</script>
<style lang="scss" scoped>
    @import "@/static/css/user.css";

    .page {
        background-color: #fafafa;
    }

    .usertop {
        background-color: #fff;
        line-height: 40px;
        width: 100%;
        min-height: 40px;
    }

    .usertop>view {
        width: 100%;
        display: table;
        table-layout: fixed;
        padding: 5px 0px;
        border-top: 1px solid #eee;
    }

    .usertop>view>view {
        display: table-cell;
        vertical-align: middle;

    }

    .usertop>view>view.avatar {
        width: 60px;
        text-align: center;
    }

    .usertop>view>view.avatar image {
        height: 40px;
        width: 40px;
        border-radius: 5px;
        vertical-align: middle;
    }

    .usertop>view>view.nickname {
        font-size: 16px;
        color: #222;
        line-height: 40px;
    }

    .usertop>view>view.icon {
        width: 30px;
        text-align: center;
    }

    .profile {
        background-color: #fff;
        margin: 10px auto;
        width: 100%;
    }

    .profile li {
        vertical-align: middle;
    }

    .profile li:first-child {
        padding-left: 10px;
        width: 150px;
        text-align: left;
    }

    .profile li:last-child {
        padding-right: 10px;
        text-align: right;
        width: calc(100% - 180px);
        vertical-align: middle;
    }

    .btn {
        height: 30px;
        line-height: 30px;
        background-color: #3388ff;
        float: right;
        color: #fff;
        padding: 0px 15px;

        margin-left: 5px;
        cursor: pointer;

        vertical-align: middle;
    }
</style>