TeamSetting.vue
3.29 KB
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
<template>
<div class='g-inherit m-article p-setting'>
<x-header class="m-tab" :left-options="{backText: ' '}">
<h1 class="m-tab-top">{{config.title}}</h1>
<a slot="left"></a>
<a v-if='config.inputType!=="select" && config.enable' slot="right" @click='() => update()'>确定</a>
</x-header>
<group>
<x-input v-if='config.inputType==="text"' :placeholder="placeHolder" v-model='inputModel' ref='input' :disabled='!config.enable' :max='10'></x-input>
<x-textarea v-else-if='config.inputType==="textarea"' :placeholder="placeHolder" v-model="inputModel" ref='input' :readonly='!config.enable' :max='30'></x-textarea>
<cell v-else-if='config.inputType==="select"' v-for="(item, index) in selects" :key='index' value-align="left" @click.native='() => update(item.key)'>
{{item.value}}
<span v-if='inputModel === item.key' slot='child' width="25" height="25" class='icon-selected'></span>
</cell>
</group>
</div>
</template>
<script>
import Utils from '../utils'
export default {
data(){
return {
inputModel:'',
placeHolder: ''
}
},
computed: {
config(){
var config = this.$store.state.teamSettingConfig
this.inputModel = config.defaultValue ? config.defaultValue : ''
this.placeHolder = config.placeHolder ? config.placeHolder : config.enable? '请输入':'无'
return config
},
selects(){
var map = Utils.teamConfigMap[this.config.updateKey]
var list = []
for (const key in map) {
if (map.hasOwnProperty(key)) {
list.push({'key':key, 'value': map[key]})
}
}
return list
}
},
mounted() {
// 立即focus会引起切页时白屏，故增加timeout
setTimeout(() => {
this.$refs.input && this.$refs.input.focus()
}, 500);
},
methods:{
update(value){
if (value===undefined && this.inputModel.length < 1) {
this.$toast('请输入内容后提交')
return
}
var callback = this.config.confirmCallback
if(callback && typeof callback === 'function') {
callback(this.config.teamId, this.config.updateKey, value? value: this.inputModel)
return
}
this.$store.dispatch('showLoading')
var action = this.config.updateInfoInTeam? 'updateInfoInTeam' : 'updateTeam'
this.$store.dispatch('delegateTeamFunction',{
functionName: action,
options: {
teamId: this.config.teamId,
[this.config.updateKey]: value ? value: this.inputModel,
done: (error, team)=>{
this.$store.dispatch('hideLoading')
if(error) {
this.$toast(error)
}else{
this.$toast('更改成功')
setTimeout(() => {
history.go(-1)
}, 200);
}
}
}
})
}
}
}
</script>
<style scoped>
.p-setting{
background-color: #e6ebf0;
padding-top: 4.6rem;
}
.weui-cell{
background-color: white;
}
.select {
img{
position: absolute;
right: 0;
}
}
.icon-selected{
display: inline-block;
width: 1.4rem;
height: 1.4rem;
background-size: 20rem;
background-image: url(http://yx-web.nos.netease.com/webdoc/h5/im/icons.png);
background-position: -3.7rem -2.95rem;
}
</style>