zhaoyingbo/canary_fe
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update to netdisk

Browse Source
This commit is contained in:
RainSun 2020-09-01 20:37:00 +08:00
parent 1cf44893e9
commit 247776e149
8 changed files with 168 additions and 267 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@ -15,11 +15,13 @@
"material-design-icons": "^3.0.1",
"register-service-worker": "^1.6.2",
"roboto-fontface": "^0.6.0",
"vconsole": "^3.3.4",
"vue": "^2.6.11",
"vue-clipboard2": "^0.3.1",
"vue-material": "^1.0.0-beta-11",
"vue-router": "^3.1.5",
"vue-svg-icon": "^1.2.9",
"vue-touch": "^1.1.0",
"vuex": "^3.1.2"
},
"devDependencies": {

26
src/axios/api.js
View File

@ -3,25 +3,7 @@ import { api } from "./fetch";
var CryptoJS = require("crypto-js");
// 登录 传参 data => mail_addr, password, update_time
export function login(data) {
var sign = CryptoJS.MD5(JSON.stringify(data).replace(/\"/g,"'")).toString().toUpperCase();
data.sign = sign
let params = new URLSearchParams();
params.append('data', JSON.stringify(data));
return api.post('/login', params)
}
// 激活 传参 data => uuid mail_addr
export function activation(data) {
var sign = CryptoJS.MD5(JSON.stringify(data).replace(/\"/g,"'")).toString().toUpperCase();
data.sign = sign
let params = new URLSearchParams();
params.append('data', JSON.stringify(data));
return api.post('/activation', params)
}
// 更新本地 传参 data => mail_addr password
// 更新本地 传参 data => cid pwd
export function syncLocal(data) {
var sign = CryptoJS.MD5(JSON.stringify(data).replace(/\"/g,"'")).toString().toUpperCase();
data.sign = sign
@ -30,9 +12,11 @@ export function syncLocal(data) {
return api.post('/download', params)
}
// 更新云端 传参 data => mail_addr password codebook update_time
// 更新云端 传参 data => cid pwd content
export function syncCloud(data) {
var sign = CryptoJS.MD5(JSON.stringify(data).replace(/\"/g,"'")).toString().toUpperCase();
let data_cache = Object.assign({}, data)
delete data_cache.content
var sign = CryptoJS.MD5(JSON.stringify(data_cache).replace(/\"/g,"'")).toString().toUpperCase();
data.sign = sign
let params = new URLSearchParams();
params.append('data', JSON.stringify(data));

3
src/axios/fetch.js
View File

@ -2,8 +2,9 @@ import axios from 'axios'
export const api = axios.create({
// baseURL: 'https://ccb.canary.moe/api/',
baseURL: window.location.origin + '/api/',
// baseURL: window.location.origin + '/api/',
// baseURL: 'https://canary.lacus.site/api/',
baseURL: 'http://canary.lacus.icu/api/',
// baseURL: 'http://beta.lacus.site/api/',
// baseURL: 'http://152.136.99.231:8001' + '/api/',
headers: {

47
src/utils/language.js
View File

@ -170,28 +170,21 @@ export function lang() {
CHS: {
title: '账户',
login: {
input_placeholder: ['邮箱地址', '密码'],
input_placeholder: ['教务账号', '密码'],
password_errmsg: '密码不能为空',
submit: '登录 / 注册'
},
activation: {
title: '恭喜! 激活码已经下发到你的邮箱',
subheader: '激活码',
input_errmsg: '激活码不可为空',
submit: '立即激活'
submit: '登录'
},
account: {
label: ['云端信息最后修改时间', '同步本地密码本至云端', '同步云端密码本至本地'],
label: ['云端信息最后修改时间','云端信息最后修改设备名', '同步本地密码本至云端', '同步云端密码本至本地'],
logout: '退出登录'
},
mail_addr_errmsg: ['邮箱地址不能为空', '邮箱地址不合法'],
cid_errmsg: ['教务账号不能为空'],
snakebar_msg: ['抱歉, 网络错误',
'恭喜! 登录成功!',
'恭喜! 请在您的邮箱里找到激活码!',
'抱歉, 密码错误, 请重新输入',
'抱歉，统一认证系统挂了',
'抱歉，账号或者密码错误',
'抱歉, 网络错误. 错误码:',
'恭喜! 激活成功!',
'抱歉, 激活码错误, 请重新输入',
'恭喜! 登录成功!',
'抱歉，数据获取成功，内容有误',
'恭喜! 本地数据更新成功!',
'恭喜! 云端数据更新成功!'
]
@ -199,28 +192,21 @@ export function lang() {
EN: {
title: 'Account',
login: {
input_placeholder: ['Mail addr', 'Password'],
input_placeholder: ['Educational Administration Account', 'Password'],
password_errmsg: 'Password can not be none.',
submit: 'Login / Sign'
},
activation: {
title: 'Congratulations! Activation code has been sent to your email',
subheader: 'Activation Code',
input_errmsg: 'Activation Code can not be none.',
submit: 'activation'
submit: 'Login'
},
account: {
label: ['Cloud last modified time', 'Sync local codebook to cloud', 'Sync cloud codebook to local'],
label: ['Cloud last modified time','Cloud last modified drivce', 'Sync local codebook to cloud', 'Sync cloud codebook to local'],
logout: 'Logout'
},
mail_addr_errmsg: ['Mail addr can not be none.', 'Mail addr is invalid.'],
cid_errmsg: ['Mail addr can not be none.'],
snakebar_msg: ['Sorry, network error',
'Congratulations! Login is successful!',
'Congratulations! Please find the activation code in your email!',
'Sorry, the password is wrong, please re-enter',
'Sorry, Educational System error',
'Sorry, account or password is wrong',
'Sorry, network error. errcode:',
'Congratulations! Activation is successful!',
'Sorry, the activation is wrong, please re-enter',
'Congratulations! Login is successful!',
'Sorry, content get successful but content is wrong',
'Congratulations! Local data update completed!',
'Congratulations! Cloud data update completed!'
]
@ -232,6 +218,7 @@ export function lang() {
subheader: ['创建主密码', '解锁Canary Codebook'],
pwd_label: ['主密码','解锁密码'],
repeat_pwd: '再次输入主密码',
drivce_label: '请输入本设备名(多端同步用)',
enter: '提交',
dialog: {
title: '确认提交',

330
src/views/Account/Account.vue
View File

@ -13,10 +13,10 @@
<div ref="list_placeholder" style="height: 54px;"></div>
<icon class="logo" name="canary"></icon>
<template v-if="page_type == 'login'">
<md-field :class="mail_addr_verify ? '' : 'md-invalid'">
<md-field :class="cid_verify ? '' : 'md-invalid'">
<label>{{ lang.login.input_placeholder[0] }}</label>
<md-input v-model="mail_addr" required></md-input>
<span class="md-error">{{ mail_addr_errmsg }}</span>
<md-input v-model="cid" required></md-input>
<span class="md-error">{{ cid_errmsg }}</span>
</md-field>
<md-field :class="password_verify ? '' : 'md-invalid'">
@ -30,23 +30,10 @@
</md-button>
</template>
<template v-if="page_type == 'activation'">
<p class="md-caption">{{ lang.activation.title }}</p>
<md-field :class="activation_code_verify ? '' : 'md-invalid'">
<label>{{ lang.activation.subheader }}</label>
<md-input v-model="activation_code" required></md-input>
<span class="md-error">{{ lang.activation.input_errmsg }}</span>
</md-field>
<md-button class="md-raised md-primary expand" :disabled="activation_loading" @click="judgeActivation()">
{{ lang.activation.submit }}
<div class="loading-box"><md-progress-spinner v-if="activation_loading" :md-diameter="22" :md-stroke="3" md-mode="indeterminate"></md-progress-spinner></div>
</md-button>
</template>
<template v-if="page_type == 'account'">
<md-list>
<md-list-item>
<span class="md-list-item-text">{{ user_infos.mail_addr }}</span>
<span class="md-list-item-text">{{ user_infos.cid }} | {{ user_infos.user_name }}</span>
</md-list-item>
<md-divider></md-divider>
@ -58,12 +45,17 @@
<md-list-item>
<span class="md-list-item-text">{{ lang.account.label[1] }}</span>
<span class="time-content">{{ user_infos.cloud_drivce }}</span>
</md-list-item>
<md-list-item>
<span class="md-list-item-text">{{ lang.account.label[2] }}</span>
<md-button @click="syncCloudStart()" v-if="!sync_cloud_loading" class="md-icon-button md-list-action"><md-icon>cloud_upload</md-icon></md-button>
<md-progress-spinner v-else :md-diameter="22" :md-stroke="3" md-mode="indeterminate"></md-progress-spinner>
</md-list-item>
<md-list-item>
<span class="md-list-item-text">{{ lang.account.label[2] }}</span>
<span class="md-list-item-text">{{ lang.account.label[3] }}</span>
<md-button @click="syncLocalStart()" v-if="!sync_local_loading" class="md-icon-button md-list-action"><md-icon>cloud_download</md-icon></md-button>
<md-progress-spinner v-else :md-diameter="22" :md-stroke="3" md-mode="indeterminate"></md-progress-spinner>
</md-list-item>
@ -84,7 +76,7 @@
// @ is an alias to /src
import { mapState, mapActions } from 'vuex';
import { encrypt, decrypt, encryptMainCode, decryptMainCode } from '@/utils/aes.js';
import { login, activation, syncLocal, syncCloud } from '@/axios/api.js';
import { syncLocal, syncCloud } from '@/axios/api.js';
import { lang } from '@/utils/language.js';
import { setHtmlFontSize } from '@/utils/px2rem.js';
@ -92,18 +84,15 @@ export default {
name: 'Add',
data() {
return {
page_type: 'login', // login activation account
mail_addr: '',
mail_addr_verify: true,
mail_addr_errmsg: '',
page_type: 'login', // login account
cid: '',
cid_verify: true,
cid_errmsg: '',
password: '',
password_verify: true,
activation_code: '',
activation_code_verify: true,
sync_local_loading: false,
sync_cloud_loading: false,
login_loading: false,
activation_loading: false,
show_snackbar: false,
snakebar_msg: '',
lang: '',
@ -133,19 +122,8 @@ export default {
this.$store.replaceState(Object.assign(this.$store.state, JSON.parse(localStorage.getItem('storeState'))));
this.initLanguage();
// 判断页面类型
if (this.user_infos.has_login) {
// 已经登录
if (this.user_infos.activation) {
// 已经激活用户
this.page_type = 'account';
} else {
// 登录但是没激活
this.page_type = 'activation';
}
} else {
// 还没登录
this.page_type = 'login';
}
if(this.user_infos && this.user_infos.cid && this.user_infos.row_login_pwd) this.page_type = 'account'
else this.page_type = 'login'
console.log('当前用户状态为' + this.page_type);
},
@ -176,16 +154,10 @@ export default {
let can_continue = true;
// 处理mail_addr
if (!(this.mail_addr = this.mail_addr.trim())) {
if (!(this.cid = this.cid.trim())) {
can_continue = false;
this.mail_addr_verify = false;
this.mail_addr_errmsg = this.lang.mail_addr_errmsg[0];
}
let reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
if (!reg.test(this.mail_addr)) {
can_continue = false;
this.mail_addr_verify = false;
this.mail_addr_errmsg = this.lang.mail_addr_errmsg[1];
this.cid_verify = false;
this.cid_errmsg = this.lang.cid_errmsg[0];
}
// 处理password
if (!(this.password = this.password.trim())) {
@ -200,131 +172,49 @@ export default {
startLogin() {
this.login_loading = true;
let data = {
mail_addr: this.mail_addr,
password: encryptMainCode(this.password),
update_time: new Date().getTime()
cid: this.cid,
pwd: this.password,
};
login(data)
syncLocal(data)
.then(res => {
// console.log(res.data)
console.log(res.data)
this.manageLoginRes(res.data);
})
.catch(err => {
console.log(err);
this.login_loading = false;
this.snakebar_msg = this.lang.snakebar_msg[0];
if(!err.response){
this.snakebar_msg = this.lang.snakebar_msg[0];
} else if(err.response.status == 512) {
this.snakebar_msg = this.lang.snakebar_msg[1];
} else if(err.response.status == 510) {
this.snakebar_msg = this.lang.snakebar_msg[2];
} else {
this.snakebar_msg = this.lang.snakebar_msg[3] + err.response.status;
}
this.show_snackbar = true;
});
},
// 处理登录后端返回的信息
manageLoginRes(data) {
if (data.errcode == 200) {
// 登录成功，正常用户
let user_infos = {
mail_addr: this.mail_addr,
has_login: true,
activation: true,
row_login_pwd: encryptMainCode(this.password),
update_time: data.update_time
};
this.setUserInfo([user_infos, this]);
console.log('正常用户登录，用户信息覆写完成');
this.snakebar_msg = this.lang.snakebar_msg[1];
this.show_snackbar = true;
this.page_type = 'account';
} else if (data.errcode == 107 || data.errcode == 108 || data.errcode == 105) {
// 注册成功等待验证
let user_infos = {
mail_addr: this.mail_addr,
has_login: true,
activation: false,
row_login_pwd: encryptMainCode(this.password),
update_time: this.user_infos.update_time
};
this.setUserInfo([user_infos, this]);
console.log('用户注册成功，验证码已下发，用户信息覆写完成');
this.snakebar_msg = this.lang.snakebar_msg[2];
this.show_snackbar = true;
this.page_type = 'activation';
} else if (data.errcode == 106) {
this.password = '';
console.log('用户密码错误');
this.snakebar_msg = this.lang.snakebar_msg[3];
this.show_snackbar = true;
} else {
console.log('请求出错');
console.log(data);
this.snakebar_msg = this.lang.snakebar_msg[4] + data.errcode;
this.show_snackbar = true;
}
// 登录成功
let user_infos = {
cid: this.cid,
row_login_pwd: encryptMainCode(this.password),
user_name: data.username,
update_time: data.modified,
drivce: this.user_infos.drivce,
cloud_drivce: this.settings.is_chinese ? '暂无' : 'unknown'
};
this.setUserInfo([user_infos, this]);
console.log('正常用户登录，用户信息覆写完成');
this.snakebar_msg = this.lang.snakebar_msg[4];
this.show_snackbar = true;
this.page_type = 'account';
this.login_loading = false;
},
// 点击激活
judgeActivation() {
// 设置flag
let can_continue = true;
// 处理password
if (!(this.activation_code = this.activation_code.trim())) {
can_continue = false;
this.activation_code_verify = false;
}
// 根据flag判断是否提交
if (can_continue) this.startActivation();
},
// 开始激活
startActivation() {
this.activation_loading = true;
let data = {
mail_addr: this.user_infos.mail_addr,
uuid: this.activation_code
};
activation(data)
.then(res => {
// console.log(res.data)
this.manageActivation(res.data);
})
.catch(err => {
console.log(err);
this.activation_loading = false;
this.snakebar_msg = this.lang.snakebar_msg[0];
this.show_snackbar = true;
});
},
// 处理激活后端返回的信息
manageActivation(data) {
if (data.errcode == 200) {
// 激活成功
let user_infos = {
mail_addr: this.user_infos.mail_addr,
has_login: true,
activation: true,
row_login_pwd: this.user_infos.row_login_pwd,
update_time: data.update_time
};
this.setUserInfo([user_infos, this]);
console.log('验证成功，用户信息覆写完成');
this.snakebar_msg = this.lang.snakebar_msg[5];
this.show_snackbar = true;
this.page_type = 'account';
} else if (data.errcode == 401 || data.errcode == 404 || data.errcode == 407) {
// 验证码输入的问题
this.activation_code = '';
console.log('验证码错误');
console.log(data);
this.snakebar_msg = this.lang.snakebar_msg[6];
this.show_snackbar = true;
} else {
console.log('请求出错');
console.log(data);
this.snakebar_msg = this.lang.snakebar_msg[4] + data.errcode;
this.show_snackbar = true;
}
this.activation_loading = false;
},
// 处理时间
formatDateTime(inputTime) {
var date = new Date(inputTime);
@ -348,40 +238,61 @@ export default {
syncLocalStart() {
this.sync_local_loading = true;
let data = {
mail_addr: this.user_infos.mail_addr,
password: this.user_infos.row_login_pwd
cid: this.user_infos.cid,
pwd: decryptMainCode(this.user_infos.row_login_pwd)
};
syncLocal(data)
.then(res => {
console.log(res.data)
if (res.data.errcode == 200) {
// 获取成功
this.setRowData([res.data.codebook, this]);
let data = res.data
// 获取成功
let content = ''
try{
content = JSON.parse(data.content)
if(typeof content == 'string') throw new Error()
if(!content || !content.codebook){
// 无数据自动初始化
content = {
codebook: '',
drivce: content.drivce ? content.drivce : (this.settings.is_chinese ? '暂无' : 'unknown')
}
}
if(!content.drivce) content.drivce = content.drivce ? content.drivce : (this.settings.is_chinese ? '暂无' : 'unknown')
this.setRowData([content.codebook, this]);
console.log('数据获取成功，密码本覆写成功');
let user_infos = this.user_infos;
user_infos.update_time = res.data.update_time;
user_infos.update_time = data.modified - 60 * 4;
user_infos.user_name = data.username;
user_infos.cloud_drivce = content.drivce
this.setUserInfo([user_infos, this]);
console.log('数据获取成功，用户信息覆写成功');
this.snakebar_msg = this.lang.snakebar_msg[7];
this.snakebar_msg = this.lang.snakebar_msg[6];
this.show_snackbar = true;
} else {
// 获取失败
console.log('数据获取失败');
console.log(res.data);
this.snakebar_msg = this.lang.snakebar_msg[4] + res.data.errcode;
} catch(e) {
console.log(e)
console.log('数据获取成功，内容有误')
this.snakebar_msg = this.lang.snakebar_msg[5];
this.show_snackbar = true;
}
setTimeout(
function() {
this.sync_local_loading = false;
}.bind(this),
1000
);
} finally {
setTimeout(
function() {
this.sync_local_loading = false;
}.bind(this),
1000
);
}
})
.catch(err => {
console.log(err);
this.sync_local_loading = false;
this.snakebar_msg = this.lang.snakebar_msg[0];
if(!err.response){
this.snakebar_msg = this.lang.snakebar_msg[0];
} else if(err.response.status == 512) {
this.snakebar_msg = this.lang.snakebar_msg[1];
} else if(err.response.status == 510) {
this.snakebar_msg = this.lang.snakebar_msg[2];
} else {
this.snakebar_msg = this.lang.snakebar_msg[3] + err.response.status;
}
this.show_snackbar = true;
});
},
@ -389,30 +300,27 @@ export default {
// 更新云端密码本
syncCloudStart() {
this.sync_cloud_loading = true;
let data = {
mail_addr: this.user_infos.mail_addr,
password: this.user_infos.row_login_pwd,
let content = {
codebook: this.row_data,
update_time: new Date().getTime()
drivce: this.user_infos.drivce
}
let data = {
cid: this.user_infos.cid,
pwd: decryptMainCode(this.user_infos.row_login_pwd),
content: JSON.stringify(content)
};
syncCloud(data)
.then(res => {
// console.log(res.data)
if (res.data.errcode == 200) {
// 获取成功
let user_infos = this.user_infos;
user_infos.update_time = res.data.update_time;
this.setUserInfo([user_infos, this]);
console.log('数据获取成功，用户信息覆写成功');
this.snakebar_msg = this.lang.snakebar_msg[8];
this.show_snackbar = true;
} else {
// 获取失败
console.log('数据获取失败');
console.log(res.data);
this.snakebar_msg = this.lang.snakebar_msg[4] + res.data.errcode;
this.show_snackbar = true;
}
let user_infos = this.user_infos;
user_infos.update_time = new Date().getTime();
console.log(user_infos)
user_infos.cloud_drivce = user_infos.drivce ? user_infos.drivce : (this.settings.is_chinese ? '暂无' : 'unknown')
console.log(user_infos)
this.setUserInfo([user_infos, this]);
console.log('数据上传成功，用户信息覆写成功');
this.snakebar_msg = this.lang.snakebar_msg[7];
this.show_snackbar = true;
setTimeout(
function() {
this.sync_cloud_loading = false;
@ -423,7 +331,15 @@ export default {
.catch(err => {
console.log(err);
this.sync_cloud_loading = false;
this.snakebar_msg = this.lang.snakebar_msg[0];
if(!err.response){
this.snakebar_msg = this.lang.snakebar_msg[0];
} else if(err.response.status == 512) {
this.snakebar_msg = this.lang.snakebar_msg[1];
} else if(err.response.status == 510) {
this.snakebar_msg = this.lang.snakebar_msg[2];
} else {
this.snakebar_msg = this.lang.snakebar_msg[3] + err.response.status;
}
this.show_snackbar = true;
});
},
@ -432,10 +348,12 @@ export default {
startLogout() {
// 初始化用户信息
let user_infos = {
mail_addr: 'A Little Canary',
has_login: false,
activation: false,
update_time: '1582282494434'
user_name: 'A Little Canary',
cid: 'Codebook',
row_login_pwd: '',
drivce: this.settings.is_chinese ? '暂无' : 'unknown',
cloud_drivce: this.settings.is_chinese ? '暂无' : 'unknown',
update_time: new Date().getTime()
};
this.setUserInfo([user_infos, this]);
console.log('用户信息覆写完成');
@ -461,9 +379,9 @@ export default {
clientHeight: function() {
this.changeFixed(this.clientHeight);
},
// 如果 `mail_addr` 发生改变，就会清空错误状态
mail_addr: function() {
this.mail_addr_verify = true;
// 如果 `cid` 发生改变，就会清空错误状态
cid: function() {
this.cid_verify = true;
},
// 如果 `password` 发生改变，就会清空错误状态
password: function() {

12
src/views/Home/Home.vue
View File

@ -28,7 +28,7 @@
<div class="drawer-banner" @click="toggleVc()">
<md-icon class="default-avatar md-size-2x face">face</md-icon>
<p class="md-title">Canary Codebook</p>
<p class="md-caption">{{ user_infos.mail_addr }}</p>
<p class="md-caption">{{ user_infos.user_name }}</p>
</div>
<md-list>
@ -224,10 +224,12 @@ export default {
if (Object.keys(this.user_infos).length == 0) {
// 初始化用户信息
let user_infos = {
mail_addr: 'A Little Canary',
has_login: false,
activation: false,
update_time: '1582282494434'
user_name: 'A Little Canary',
cid: 'Codebook',
row_login_pwd: '',
drivce: this.settings.is_chinese ? '暂无' : 'unknown',
cloud_drivce: this.settings.is_chinese ? '暂无' : 'unknown',
update_time: new Date().getTime()
};
this.setUserInfo([user_infos, this]);
console.log('用户信息覆写完成');

9
src/views/Settings/Settings.vue
View File

@ -219,10 +219,11 @@ export default {
}
// 初始化用户信息
let user_infos = {
mail_addr: 'A Little Canary',
has_login: false,
activation: false,
update_time: '1582282494434'
user_name: 'A Little Canary',
cid: '',
row_login_pwd: '',
drivce: '',
update_time: new Date().getTime()
};
this.setUserInfo([user_infos, this]);
console.log('用户信息覆写完成');

6
src/views/Unlock/Unlock.vue
View File

@ -20,6 +20,12 @@
<span class="md-error">{{ err_msg }}</span>
</md-field>
<md-field class="input-box" :class="messageClass" v-if="is_create">
<label>{{ lang.repeat_pwd }}</label>
<md-input v-model="repeat" type="password"></md-input>
<span class="md-error">{{ err_msg }}</span>
</md-field>
<md-button class="md-raised md-primary center" @click="judgePwd()">{{ lang.enter }}</md-button>
<md-dialog-confirm