智慧保安互联网APP
shuishen
2021-08-20 501e7180823c29e893d87efabd0e2b9a629bae40
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
<template>
    <view class="registerUser">
        <u-form :model="form" ref="uForm">
            <u-form-item :label="item.title" :prop="item.froms" label-width="200" :left-icon="item.img"
                :required="item.requireds" v-for="(item, index) in list" :key="index">
                <u-input v-model="form[item.froms]" :placeholder="item.placeholder" />
            </u-form-item>
            <u-form-item label="群成员" prop="role" left-icon="man-add" label-width="200" :required="true">
                <u-checkbox-group @change="checkboxGroupChange">
                    <u-checkbox v-model="item.checked" v-for="(item, index) in friend" :key="index"
                        :name="item.friendid">
                        {{item.realName}}
                    </u-checkbox>
                </u-checkbox-group>
            </u-form-item>
        </u-form>
        <u-button class="submit" @click="submit">
            创建</u-button>
    </view>
</template>
 
<script>
    import WxStorage from "../../../static/lib/wxStorage.js"
    export default {
        data() {
            return {
                friend: [],
                list: [{
                        title: '群名称',
                        img: 'chat',
                        froms: 'groupname',
                        requireds: true,
                        placeholder: '请输入群名称'
                    },
                    {
                        title: '群介绍',
                        img: 'order',
                        froms: 'groupcontent',
                        requireds: true,
                        placeholder: '请输入群介绍'
                    },
                    {
                        title: '群公告',
                        img: 'bell',
                        froms: 'groupnotice',
                        requireds: true,
                        placeholder: '请输入群公告'
                    },
                ],
                form: {
                    groupname: '',
                    groupcontent: '',
                    groupnotice: '',
                    groupmember: '',
                },
                rules: {
                    groupname: [{
                        required: true,
                        message: '请输入群名称',
                        // 可以单个或者同时写两个触发验证方式 
                        trigger: ['change', 'blur'],
                    }],
                    groupcontent: [{
                        required: true,
                        message: '请输入群介绍',
                        // 可以单个或者同时写两个触发验证方式 
                        trigger: ['change', 'blur'],
                    }],
                    groupnotice: [{
                        required: true,
                        message: '请输入群公告',
                        // 可以单个或者同时写两个触发验证方式 
                        trigger: ['change', 'blur'],
                    }]
                },
            }
        },
        onReady() {
            this.$refs.uForm.setRules(this.rules);
        },
        onLoad() {
            this.getFriend();
        },
        methods: {
            submit() {
                var that = this;
                this.$refs.uForm.validate(valid => {
                    if (valid) {
                        var d = that.form;
                        if (d.groupmember == "") {
                            uni.showToast({
                                title: '请至少选择一个群成员',
                                icon: "none",
                                duration: 1000
                            });
                            return;
                        }
                        d.time = that.currTime();
                        d.groupid = WxStorage.get("ids");
                        uni.request({
                            url: that.$store.state.piAPI + "/chatgroup/submit",
                            method: "POST",
                            data: d,
                            success: (res) => {
                                uni.showToast({
                                    title: '创建成功',
                                    icon: "none",
                                    duration: 1000
                                });
 
                                uni.switchTab({
                                    url: '/pages/groupChat/groupChat?'
                                });
                            }
                        });
                    }
                });
            },
            currTime() {
                var date = new Date();
                var Y = date.getFullYear() + '-';
                var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
                var D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' ';
                var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
                var m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':';
                var s = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
                return Y + M + D + h + m + s;
            },
            checkboxGroupChange(e) {
                var arr = "";
                for (var i = 0; i < e.length; i++) {
                    arr += e[i] + ",";
                }
                var obj = arr.substr(0, arr.length - 1);
                this.form.groupmember = obj;
            },
            getFriend() {
                var that = this;
                uni.request({
                    url: this.$store.state.piAPI + "/friend/page?current=1&size=9999",
                    method: "get",
                    data: {
                        applicant: WxStorage.get("ids")
                    },
                    success: (res) => {
                        var resdata = res.data.data.records;
                        that.friend = resdata;
                    }
                })
            }
        }
    }
</script>
 
<style>
    .warp {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 100%;
    }
 
    .rect {
        text-align: center;
        width: 120px;
        height: 120px;
    }
 
    .submit {
        margin: 30rpx 50rpx 50rpx;
        border: none;
        width: 572rpx;
        height: 86rpx;
        line-height: 86rpx;
        box-sizing: border-box;
        border-radius: 15rpx;
        background-color: #14b9c8;
        color: #ffffff;
 
        &::after {
            content: none;
        }
 
        &::before {
            content: none;
        }
 
        &[disabled='true'] {
            background: #e4e4e4;
            font-size: 36rpx;
            font-family: Source Han Sans CN;
            font-weight: 500;
            color: #ffffff;
        }
    }
 
    .registerUser {
        padding: 0 1.2rem;
    }
</style>