etc/Sharkey
0
0
Fork 0
mirror of https://activitypub.software/TransFem-org/Sharkey synced 2024-11-22 14:05:12 +00:00
Code Issues Projects Releases Packages Wiki Activity

Better mobile setting

Browse source
This commit is contained in:
syuilo 2018-05-20 14:01:47 +09:00
parent ff6409be3f
commit 853ee415ae
4 changed files with 95 additions and 60 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
locales/ja.yml
View file

@ -813,9 +813,13 @@ mobile/views/pages/settings/settings.profile.vue:
location: "場所"
description: "自己紹介"
birthday: "誕生日"
avatar: "アイコン"
banner: "バナー"
is-bot: "このアカウントはBotです"
save: "保存"
saved: "プロフィールを保存しました"
uploading: "アップロード中"
upload-failed: "アップロードに失敗しました"
mobile/views/pages/search.vue:
search: "検索"

4
src/client/app/mobile/script.ts
View file

@ -5,7 +5,7 @@
import Vue from 'vue';
import VueRouter from 'vue-router';
import { MdCard, MdButton, MdField, MdMenu, MdList, MdSwitch, MdSubheader } from 'vue-material/dist/components';
import { MdCard, MdButton, MdField, MdMenu, MdList, MdSwitch, MdSubheader, MdDialog, MdDialogAlert } from 'vue-material/dist/components';
import 'vue-material/dist/vue-material.min.css';
import 'vue-material/dist/theme/default.css';
@ -47,6 +47,8 @@ Vue.use(MdMenu);
Vue.use(MdList);
Vue.use(MdSwitch);
Vue.use(MdSubheader);
Vue.use(MdDialog);
Vue.use(MdDialogAlert);
/**
* init

60
src/client/app/mobile/views/pages/settings.vue
View file

@ -229,8 +229,11 @@ export default Vue.extend({
</script>
<style lang="stylus" scoped>
main
root(isDark)
padding 0 16px
margin 0 auto
max-width 500px
width 100%
> div
> *
@ -240,57 +243,12 @@ main
display block
margin 24px
text-align center
color #cad2da
color isDark ? #cad2da : #848e9a
> ul
$radius = 8px
main[data-darkmode]
root(true)
display block
margin 16px auto
padding 0
max-width 500px
width calc(100% - 32px)
list-style none
background #fff
border solid 1px rgba(#000, 0.2)
border-radius $radius
> li
display block
border-bottom solid 1px #ddd
&:hover
background rgba(#000, 0.1)
&:first-child
border-top-left-radius $radius
border-top-right-radius $radius
&:last-child
border-bottom-left-radius $radius
border-bottom-right-radius $radius
border-bottom none
> a
$height = 48px
display block
position relative
padding 0 16px
line-height $height
color #4d635e
> [data-fa]:nth-of-type(1)
margin-right 4px
> [data-fa]:nth-of-type(2)
display block
position absolute
top 0
right 8px
z-index 1
padding 0 20px
font-size 1.2em
line-height $height
main:not([data-darkmode])
root(false)
</style>

87
src/client/app/mobile/views/pages/settings/settings.profile.vue
View file

@ -10,11 +10,6 @@
<md-input v-model="name" :disabled="saving"/>
</md-field>
<md-field>
<label>%i18n:@description%</label>
<md-textarea v-model="description" :disabled="saving"/>
</md-field>
<md-field>
<md-icon>%fa:map-marker-alt%</md-icon>
<label>%i18n:@location%</label>
@ -27,6 +22,25 @@
<md-input type="date" v-model="birthday" :disabled="saving"/>
</md-field>
<md-field>
<label>%i18n:@description%</label>
<md-textarea v-model="description" :disabled="saving"/>
</md-field>
<md-field>
<label>%i18n:@avatar%</label>
<md-file @md-change="onAvatarChange"/>
</md-field>
<md-field>
<label>%i18n:@banner%</label>
<md-file @md-change="onBannerChange"/>
</md-field>
<md-dialog-alert
:md-active.sync="uploading"
md-content="%18n:!@uploading%"/>
<div>
<md-switch v-model="os.i.isBot" @change="onChangeIsBot">%i18n:@is-bot%</md-switch>
</div>
@ -40,6 +54,7 @@
<script lang="ts">
import Vue from 'vue';
import { apiUrl } from '../../../../config';
export default Vue.extend({
data() {
@ -48,7 +63,10 @@ export default Vue.extend({
location: null,
description: null,
birthday: null,
saving: false
avatarId: null,
bannerId: null,
saving: false,
uploading: false
};
},
@ -57,6 +75,8 @@ export default Vue.extend({
this.location = (this as any).os.i.profile.location;
this.description = (this as any).os.i.description;
this.birthday = (this as any).os.i.profile.birthday;
this.avatarId = (this as any).os.i.avatarId;
this.bannerId = (this as any).os.i.bannerId;
},
methods: {
@ -66,6 +86,50 @@ export default Vue.extend({
});
},
onAvatarChange([file]) {
this.uploading = true;
const data = new FormData();
data.append('file', file);
data.append('i', (this as any).os.i.token);
fetch(apiUrl + '/drive/files/create', {
method: 'POST',
body: data
})
.then(response => response.json())
.then(f => {
this.avatarId = f.id;
this.uploading = false;
})
.catch(e => {
this.uploading = false;
alert('%18n:!@upload-failed%');
});
},
onBannerChange([file]) {
this.uploading = true;
const data = new FormData();
data.append('file', file);
data.append('i', (this as any).os.i.token);
fetch(apiUrl + '/drive/files/create', {
method: 'POST',
body: data
})
.then(response => response.json())
.then(f => {
this.bannerId = f.id;
this.uploading = false;
})
.catch(e => {
this.uploading = false;
alert('%18n:!@upload-failed%');
});
},
save() {
this.saving = true;
@ -73,9 +137,16 @@ export default Vue.extend({
name: this.name || null,
location: this.location || null,
description: this.description || null,
birthday: this.birthday || null
}).then(() => {
birthday: this.birthday || null,
avatarId: this.avatarId,
bannerId: this.bannerId
}).then(i => {
this.saving = false;
(this as any).os.i.avatarId = i.avatarId;
(this as any).os.i.avatarUrl = i.avatarUrl;
(this as any).os.i.bannerId = i.bannerId;
(this as any).os.i.bannerUrl = i.bannerUrl;
alert('%i18n:!@saved%');
});
}