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

add import & export and format code

Browse Source
This commit is contained in:
RainSun 2020-09-02 13:18:23 +08:00
parent 52845ed311
commit f53442594f
17 changed files with 2773 additions and 2380 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
src/App.vue
View File

@ -6,19 +6,21 @@
</template>
<script>
import { mapActions } from 'vuex';
import { mapActions } from "vuex";
export default {
name: 'App',
name: "App",
mounted() {
window.addEventListener('beforeunload', e => this.beforeunloadHandler(e))
window.addEventListener('unload', e => this.unloadHandler(e))
window.addEventListener("beforeunload", (e) => this.beforeunloadHandler(e));
window.addEventListener("unload", (e) => this.unloadHandler(e));
},
destroyed() {
window.removeEventListener('beforeunload', e => this.beforeunloadHandler(e))
window.removeEventListener('unload', e => this.unloadHandler(e))
window.removeEventListener("beforeunload", (e) =>
this.beforeunloadHandler(e)
);
window.removeEventListener("unload", (e) => this.unloadHandler(e));
},
methods: {
...mapActions(['setRowPwd']),
...mapActions(["setRowPwd"]),
beforeunloadHandler() {
this._beforeUnload_time = new Date().getTime();
},
@ -27,19 +29,19 @@ export default {
//判断是窗口关闭还是刷新
if (this._gap_time <= 5) {
// debugger
console.log('退出程序清除主密码')
this.setRowPwd(['', this]);
console.log("退出程序清除主密码");
this.setRowPwd(["", this]);
// debugger
}
}
}
},
},
};
</script>
<style lang="scss">
@import './style/main';
@import './style/font';
@import '~vue-material/dist/theme/engine';
@import '~vue-material/dist/theme/all';
@import "./style/main";
@import "./style/font";
@import "~vue-material/dist/theme/engine";
@import "~vue-material/dist/theme/all";
body,
h1,
h2,
@ -139,19 +141,20 @@ button {
border: none;
outline: none;
}
html[data-theme='dark'] {
html[data-theme="dark"] {
@include set-theme-dark();
@import '~vue-material/dist/theme/all';
@import "~vue-material/dist/theme/all";
.md-caption {
color: rgba(255, 255, 255, 0.7);
}
}
html[data-theme='light'] {
html[data-theme="light"] {
@include set-theme-light();
@import '~vue-material/dist/theme/all';
@import "~vue-material/dist/theme/all";
}
#app {
font-family: 'Roboto', 'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', '微软雅黑', Arial, sans-serif;
font-family: "Roboto", "Helvetica Neue", Helvetica, "PingFang SC",
"Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
/* text-align: center; */

50
src/utils/language.js
View File

@ -43,9 +43,10 @@ export function lang() {
settings: {
CHS: {
title: '设置',
subheader: ['重置', '选项'],
subheader: ['重置', '选项', '导入 / 导出'],
reset_list: ['账户', '密码本', '应用', '主密码'],
option_list: ['语言', '黑暗模式', '密码超时时间'],
import_export_list: ['导入密码本', '导出密码本'],
expired_time: '无限',
dialog: {
title: '输入新的主密码',
@ -53,12 +54,24 @@ export function lang() {
confirm: '完成',
cancel: '取消'
},
copy: {
successful: '恭喜！已成功导出至剪切板',
failed: '抱歉，导出失败。夸克等浏览器导出成功也会报错，请试着粘贴看看'
},
import_dialog: {
title: '输入导入内容',
placeholder: '不要乱输入东西不然会坏掉',
confirm: '导入',
cancel: '取消'
},
snakebar_msg: {
reset_account: '恭喜! 账户重置完成',
reset_codebook: '恭喜! 密码本重置完成',
reset_settings: '恭喜! 个性化设置成功',
reset_pwd_failed: '密码不能为空',
reset_pwd_successful: '恭喜! 新的密码已经应用'
reset_pwd_successful: '恭喜! 新的密码已经应用',
reset_row_data_failed: '密码本内容不能为空',
reset_row_data_successful: '恭喜! 新的密码本已经应用',
},
reset_dialog: {
title: '警告',
@ -69,22 +82,35 @@ export function lang() {
},
EN: {
title: 'Settings',
subheader: ['Reset', 'Option'],
subheader: ['Reset', 'Option', 'Import / Export'],
reset_list: ['Account', 'Codebook', 'Application', 'Main Password'],
option_list: ['Language', 'Dark Mode', 'Expired Time'],
expired_time: 'Infinite',
import_export_list: ['Import Codebook', 'Export Codebook'],
dialog: {
title: 'Enter new password',
placeholder: 'Enter here...',
confirm: 'Done',
cancel: 'Cancel'
},
copy: {
successful: 'congratulations! Successfully exported to the clipboard',
failed: 'Failed to export, but failed in some cases. Try to paste'
},
import_dialog: {
title: 'Enter new codebook content',
placeholder: 'Enter here...',
confirm: 'Done',
cancel: 'Cancel'
},
snakebar_msg: {
reset_account: 'Congratulations! Reset account completed',
reset_codebook: 'Congratulations! Reset codebook completed',
reset_settings: 'Congratulations! Reset settings completed',
reset_pwd_failed: 'Password can not be none',
reset_pwd_successful: 'Congratulations! New password set up successfully'
reset_pwd_successful: 'Congratulations! New password set up successfully',
reset_row_data_failed: 'Codebook Content can not be none',
reset_row_data_successful: 'Congratulations! New Codebook Content set up successfully'
},
reset_dialog: {
title: 'Warning',
@ -284,6 +310,14 @@ export function lang() {
CHS: {
title: '更新日志',
timeline: [
{
label: '新增导入导出功能',
tag: '功能更新',
content: [
'为方便老用户转移数据或者自行备份数据，新增导入导出功能',
'2020-09-02'
]
},
{
label: '修复密码本为空的情况下解锁页面变为创建主密码',
tag: 'bug修复',
@ -425,6 +459,14 @@ export function lang() {
EN: {
title: 'Update Log',
timeline: [
{
label: 'New import and export function',
tag: 'Feature update',
content: [
'In order to facilitate old users to transfer data or backup data by themselves, new import and export function is added',
'2020-09-02'
]
},
{
label: 'Fix that the unlock page becomes create master password when the password book is empty',
tag: 'Bug fix',

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

@ -3,7 +3,9 @@
<md-app md-waterfall md-mode="fixed">
<md-app-toolbar class="md-primary toolbar">
<div class="md-toolbar-section-start">
<md-button class="md-icon-button" @click="back()"><md-icon>arrow_back</md-icon></md-button>
<md-button class="md-icon-button" @click="back()">
<md-icon>arrow_back</md-icon>
</md-button>
<h3 class="md-title" style="flex: 1">{{ lang.title }}</h3>
</div>
</md-app-toolbar>
@ -24,9 +26,20 @@
<md-input v-model="password" required type="password"></md-input>
<span class="md-error">{{ lang.login.password_errmsg }}</span>
</md-field>
<md-button class="md-raised md-primary expand" @click="judgeLogin()" :disabled="login_loading">
<md-button
class="md-raised md-primary expand"
@click="judgeLogin()"
:disabled="login_loading"
>
{{ lang.login.submit }}
<div class="loading-box"><md-progress-spinner v-if="login_loading" :md-diameter="22" :md-stroke="3" md-mode="indeterminate"></md-progress-spinner></div>
<div class="loading-box">
<md-progress-spinner
v-if="login_loading"
:md-diameter="22"
:md-stroke="3"
md-mode="indeterminate"
></md-progress-spinner>
</div>
</md-button>
</template>
@ -50,17 +63,43 @@
<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-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[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-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>
<md-button @click="startLogout()" class="md-raised md-primary expand" :disabled="sync_local_loading || sync_cloud_loading">{{ lang.account.logout }}</md-button>
<md-button
@click="startLogout()"
class="md-raised md-primary expand"
:disabled="sync_local_loading || sync_cloud_loading"
>{{ lang.account.logout }}</md-button>
</md-list>
</template>
<md-snackbar md-position="center" :md-active.sync="show_snackbar" md-persistent>
@ -74,57 +113,79 @@
<script>
// @ is an alias to /src
import { mapState, mapActions } from 'vuex';
import { encrypt, decrypt, encryptMainCode, decryptMainCode } from '@/utils/aes.js';
import { syncLocal, syncCloud } from '@/axios/api.js';
import { lang } from '@/utils/language.js';
import { setHtmlFontSize } from '@/utils/px2rem.js';
import { mapState, mapActions } from "vuex";
import {
encrypt,
decrypt,
encryptMainCode,
decryptMainCode,
} from "@/utils/aes.js";
import { syncLocal, syncCloud } from "@/axios/api.js";
import { lang } from "@/utils/language.js";
import { setHtmlFontSize } from "@/utils/px2rem.js";
export default {
name: 'Add',
name: "Add",
data() {
return {
page_type: 'login', // login account
cid: '',
page_type: "login", // login account
cid: "",
cid_verify: true,
cid_errmsg: '',
password: '',
cid_errmsg: "",
password: "",
password_verify: true,
sync_local_loading: false,
sync_cloud_loading: false,
login_loading: false,
show_snackbar: false,
snakebar_msg: '',
lang: '',
clientHeight: ''
snakebar_msg: "",
lang: "",
clientHeight: "",
};
},
computed: {
...mapState(['user_infos', 'row_data', 'row_pwd', 'settings']),
...mapState(["user_infos", "row_data", "row_pwd", "settings"]),
update_time: function () {
return this.formatDateTime(new Date(parseInt(this.user_infos.update_time)));
}
return this.formatDateTime(
new Date(parseInt(this.user_infos.update_time))
);
},
},
methods: {
...mapActions(['setUserInfo', 'setRowData', 'setRowPwd']),
...mapActions(["setUserInfo", "setRowData", "setRowPwd"]),
// 修改md-app的最小高度
changeFixed(clientHeight) {
//动态修改样式
// console.log(clientHeight);
// window.document.getElementsByClassName('md-content')[0].style.minHeight = clientHeight + 'px';
this.$refs.list_placeholder.parentNode.parentNode.style.maxHeight = clientHeight + 'px';
this.$refs.list_placeholder.parentNode.style.minHeight = clientHeight - 32 + 'px';
window.document.documentElement.setAttribute('data-theme', this.settings.is_dark_mode ? 'dark' : 'light');
this.$refs.list_placeholder.parentNode.parentNode.style.maxHeight =
clientHeight + "px";
this.$refs.list_placeholder.parentNode.style.minHeight =
clientHeight - 32 + "px";
window.document.documentElement.setAttribute(
"data-theme",
this.settings.is_dark_mode ? "dark" : "light"
);
},
// 初始化
init() {
// 刷新vuex
this.$store.replaceState(Object.assign(this.$store.state, JSON.parse(localStorage.getItem('storeState'))));
this.$store.replaceState(
Object.assign(
this.$store.state,
JSON.parse(localStorage.getItem("storeState"))
)
);
this.initLanguage();
// 判断页面类型
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);
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);
},
// 配置语言
@ -134,7 +195,7 @@ export default {
} else {
this.lang = lang().account.EN;
}
console.log('语言配置完成');
console.log("语言配置完成");
},
//返回上一页
@ -145,7 +206,7 @@ export default {
// 强制返回Home
turnToHome(msg) {
console.log(msg);
this.$router.replace('/');
this.$router.replace("/");
},
// 点击上传
@ -176,11 +237,11 @@ export default {
pwd: this.password,
};
syncLocal(data)
.then(res => {
.then((res) => {
// console.log(res.data)
this.manageLoginRes(res.data);
})
.catch(err => {
.catch((err) => {
console.log(err);
this.login_loading = false;
if (!err.response) {
@ -205,13 +266,13 @@ export default {
row_login_pwd: encryptMainCode(this.password),
user_name: data.username,
update_time: data.modified,
cloud_drivce: this.settings.is_chinese ? '暂无' : 'unknown'
cloud_drivce: this.settings.is_chinese ? "暂无" : "unknown",
};
this.setUserInfo([user_infos, this]);
console.log('正常用户登录，用户信息覆写完成');
console.log("正常用户登录，用户信息覆写完成");
this.snakebar_msg = this.lang.snakebar_msg[4];
this.show_snackbar = true;
this.page_type = 'account';
this.page_type = "account";
this.login_loading = false;
},
@ -220,16 +281,16 @@ export default {
var date = new Date(inputTime);
var y = date.getFullYear();
var m = date.getMonth() + 1;
m = m < 10 ? '0' + m : m;
m = m < 10 ? "0" + m : m;
var d = date.getDate();
d = d < 10 ? '0' + d : d;
d = d < 10 ? "0" + d : d;
var h = date.getHours();
h = h < 10 ? '0' + h : h;
h = h < 10 ? "0" + h : h;
var minute = date.getMinutes();
var second = date.getSeconds();
minute = minute < 10 ? '0' + minute : minute;
second = second < 10 ? '0' + second : second;
return y + '-' + m + '-' + d + ' ' + h + ':' + minute;
minute = minute < 10 ? "0" + minute : minute;
second = second < 10 ? "0" + second : second;
return y + "-" + m + "-" + d + " " + h + ":" + minute;
// return y + "-" + m + "-" + d + " " + h + ":" + minute + ":" + second;
// return y + "-" + m + "-" + d;
},
@ -239,38 +300,47 @@ export default {
this.sync_local_loading = true;
let data = {
cid: this.user_infos.cid,
pwd: decryptMainCode(this.user_infos.row_login_pwd)
pwd: decryptMainCode(this.user_infos.row_login_pwd),
};
syncLocal(data)
.then(res => {
let data = res.data
.then((res) => {
let data = res.data;
// 获取成功
let content = ''
let content = "";
try {
content = JSON.parse(data.content)
if(typeof content == 'string') throw new Error()
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')
codebook: "",
drivce: content.drivce
? content.drivce
: this.settings.is_chinese
? "暂无"
: "unknown",
};
}
}
if(content.drivce && content.drivce != '暂无' && content.drivce != 'unknown') content.drivce = decodeURIComponent(content.drivce)
else content.drivce = this.settings.is_chinese ? '暂无' : 'unknown'
if (
content.drivce &&
content.drivce != "暂无" &&
content.drivce != "unknown"
)
content.drivce = decodeURIComponent(content.drivce);
else content.drivce = this.settings.is_chinese ? "暂无" : "unknown";
this.setRowData([content.codebook, this]);
console.log('数据获取成功，密码本覆写成功');
console.log("数据获取成功，密码本覆写成功");
let user_infos = this.user_infos;
user_infos.update_time = data.modified - 1000 * 60 * 4;
user_infos.user_name = data.username;
user_infos.cloud_drivce = content.drivce
user_infos.cloud_drivce = content.drivce;
this.setUserInfo([user_infos, this]);
console.log('数据获取成功，用户信息覆写成功');
console.log("数据获取成功，用户信息覆写成功");
this.snakebar_msg = this.lang.snakebar_msg[6];
this.show_snackbar = true;
} catch (e) {
console.log(e)
console.log('数据获取成功，内容有误')
console.log(e);
console.log("数据获取成功，内容有误");
this.snakebar_msg = this.lang.snakebar_msg[5];
this.show_snackbar = true;
} finally {
@ -282,7 +352,7 @@ export default {
);
}
})
.catch(err => {
.catch((err) => {
console.log(err);
this.sync_local_loading = false;
if (!err.response) {
@ -303,21 +373,25 @@ export default {
this.sync_cloud_loading = true;
let content = {
codebook: this.row_data,
drivce: encodeURIComponent(this.user_infos.drivce)
}
drivce: encodeURIComponent(this.user_infos.drivce),
};
let data = {
cid: this.user_infos.cid,
pwd: decryptMainCode(this.user_infos.row_login_pwd),
content: JSON.stringify(content)
content: JSON.stringify(content),
};
console.log(data)
console.log(data);
syncCloud(data)
.then(res => {
.then((res) => {
let user_infos = this.user_infos;
user_infos.update_time = new Date().getTime();
user_infos.cloud_drivce = user_infos.drivce ? user_infos.drivce : (this.settings.is_chinese ? '暂无' : 'unknown')
user_infos.cloud_drivce = user_infos.drivce
? user_infos.drivce
: this.settings.is_chinese
? "暂无"
: "unknown";
this.setUserInfo([user_infos, this]);
console.log('数据上传成功，用户信息覆写成功');
console.log("数据上传成功，用户信息覆写成功");
this.snakebar_msg = this.lang.snakebar_msg[7];
this.show_snackbar = true;
setTimeout(
@ -327,7 +401,7 @@ export default {
1000
);
})
.catch(err => {
.catch((err) => {
console.log(err);
this.sync_cloud_loading = false;
if (!err.response) {
@ -348,20 +422,20 @@ export default {
// 初始化用户信息
let user_infos = {
...this.user_infos,
user_name: 'A Little Canary',
cid: 'Codebook',
row_login_pwd: '',
cloud_drivce: this.settings.is_chinese ? '暂无' : 'unknown',
update_time: new Date().getTime()
user_name: "A Little Canary",
cid: "Codebook",
row_login_pwd: "",
cloud_drivce: this.settings.is_chinese ? "暂无" : "unknown",
update_time: new Date().getTime(),
};
this.setUserInfo([user_infos, this]);
console.log('用户信息覆写完成');
console.log("用户信息覆写完成");
this.back();
}
},
},
created() {
this.lang = lang().account.CHS;
console.log('临时语言系统加载完成');
console.log("临时语言系统加载完成");
this.init();
},
mounted() {
@ -389,15 +463,15 @@ export default {
// 如果 `activation_code` 发生改变，就会清空错误状态
activation_code: function () {
this.activation_code_verify = true;
}
},
},
beforeDestroy() {},
components: {}
components: {},
};
</script>
<style scoped lang="scss" type="text/scss">
@import '../../style/main';
@import "../../style/main";
.account {
width: 100%;
min-height: 100%;

16
src/views/Add/Add.vue
View File

@ -115,7 +115,7 @@ import {
encrypt,
decrypt,
encryptMainCode,
decryptMainCode
decryptMainCode,
} from "@/utils/aes.js";
import { lang } from "@/utils/language.js";
import { setHtmlFontSize } from "@/utils/px2rem.js";
@ -148,11 +148,11 @@ export default {
// 密码长度
code_length: 12,
// 密码复制状态
copy_state: ""
copy_state: "",
};
},
computed: {
...mapState(["row_data", "row_pwd", "settings"])
...mapState(["row_data", "row_pwd", "settings"]),
},
methods: {
...mapActions(["setRowData", "setRowPwd"]),
@ -260,7 +260,7 @@ export default {
user_name: this.user_name,
password: this.password,
node: this.node,
web_address: this.web_address
web_address: this.web_address,
};
// 解密主密码
let main_code_decrpt = decryptMainCode(this.row_pwd.main_code);
@ -292,7 +292,7 @@ export default {
user_name: this.user_name,
password: this.password,
node: this.node,
web_address: this.web_address
web_address: this.web_address,
};
// 解密主密码
let main_code_decrpt = decryptMainCode(this.row_pwd.main_code);
@ -363,7 +363,7 @@ export default {
setTimeout(() => {
this.copy_state = "";
}, 2000);
}
},
},
created() {
this.lang = lang().add.CHS;
@ -383,10 +383,10 @@ export default {
// 如果 `clientHeight` 发生改变，这个函数就会运行
clientHeight: function () {
this.changeFixed(this.clientHeight);
}
},
},
beforeDestroy() {},
components: {}
components: {},
};
</script>

124
src/views/Detail/Detail.vue
View File

@ -3,12 +3,18 @@
<md-app md-waterfall md-mode="fixed">
<md-app-toolbar class="md-primary toolbar">
<div class="md-toolbar-section-start">
<md-button class="md-icon-button" @click="back()"><md-icon>arrow_back</md-icon></md-button>
<md-button class="md-icon-button" @click="back()">
<md-icon>arrow_back</md-icon>
</md-button>
<h3 class="md-title" style="flex: 1">{{ content.title }}</h3>
</div>
<div class="md-toolbar-section-end">
<md-button class="md-icon-button" @click="turnToEdit()"><md-icon>edit</md-icon></md-button>
<md-button class="md-icon-button" @click="openDelDialog()"><md-icon>delete</md-icon></md-button>
<md-button class="md-icon-button" @click="turnToEdit()">
<md-icon>edit</md-icon>
</md-button>
<md-button class="md-icon-button" @click="openDelDialog()">
<md-icon>delete</md-icon>
</md-button>
</div>
</md-app-toolbar>
@ -20,8 +26,17 @@
<label class="md-caption">{{ lang.label[0] }}</label>
<div class="msg-box">
<p>{{ content.user_name }}</p>
<md-button class="md-icon-button" v-clipboard:copy="content.user_name" v-clipboard:success="onCopyUrl" v-clipboard:error="onErrorUrl">
<icon class="icon" name="file_copy" :class="settings.is_dark_mode ? 'dark-theme-icon' : ''"></icon>
<md-button
class="md-icon-button"
v-clipboard:copy="content.user_name"
v-clipboard:success="onCopyUrl"
v-clipboard:error="onErrorUrl"
>
<icon
class="icon"
name="file_copy"
:class="settings.is_dark_mode ? 'dark-theme-icon' : ''"
></icon>
</md-button>
</div>
</md-list-item>
@ -29,9 +44,20 @@
<label class="md-caption">{{ lang.label[1] }}</label>
<div class="msg-box">
<p class="password">{{ show_password ? content.password : doitPassword }}</p>
<md-button class="md-icon-button" @click="show_password = !show_password"><md-icon>remove_red_eye</md-icon></md-button>
<md-button class="md-icon-button" v-clipboard:copy="content.password" v-clipboard:success="onCopyUrl" v-clipboard:error="onErrorUrl">
<icon class="icon" name="file_copy" :class="settings.is_dark_mode ? 'dark-theme-icon' : ''"></icon>
<md-button class="md-icon-button" @click="show_password = !show_password">
<md-icon>remove_red_eye</md-icon>
</md-button>
<md-button
class="md-icon-button"
v-clipboard:copy="content.password"
v-clipboard:success="onCopyUrl"
v-clipboard:error="onErrorUrl"
>
<icon
class="icon"
name="file_copy"
:class="settings.is_dark_mode ? 'dark-theme-icon' : ''"
></icon>
</md-button>
</div>
</md-list-item>
@ -39,7 +65,9 @@
<label class="md-caption">{{ lang.label[2] }}</label>
<div class="msg-box">
<p>{{ content.web_address ? content.web_address : lang.empty_placeholder }}</p>
<md-button class="md-icon-button" @click="openUrl()"><md-icon>open_in_new</md-icon></md-button>
<md-button class="md-icon-button" @click="openUrl()">
<md-icon>open_in_new</md-icon>
</md-button>
</div>
</md-list-item>
<md-list-item>
@ -69,50 +97,65 @@
<script>
// @ is an alias to /src
import { mapState, mapActions } from 'vuex';
import { encrypt, decrypt, encryptMainCode, decryptMainCode } from '@/utils/aes.js';
import { lang } from '@/utils/language.js';
import { setHtmlFontSize } from '@/utils/px2rem.js';
import { mapState, mapActions } from "vuex";
import {
encrypt,
decrypt,
encryptMainCode,
decryptMainCode,
} from "@/utils/aes.js";
import { lang } from "@/utils/language.js";
import { setHtmlFontSize } from "@/utils/px2rem.js";
export default {
name: 'Add',
name: "Add",
data() {
return {
show_snackbar: false,
snakebar_msg: '',
snakebar_msg: "",
content: {},
show_password: false,
show_dialog: false,
lang: '',
clientHeight: ''
lang: "",
clientHeight: "",
};
},
computed: {
...mapState(['row_data', 'row_pwd', 'settings']),
...mapState(["row_data", "row_pwd", "settings"]),
doitPassword() {
if (this.content.password) {
let doit = '';
let doit = "";
for (let i = 0; i < this.content.password.length; i++) {
doit += '*';
doit += "*";
}
return doit;
}
}
},
},
methods: {
...mapActions(['setRowData', 'setRowPwd']),
...mapActions(["setRowData", "setRowPwd"]),
// 修改md-app的最小高度
changeFixed(clientHeight) {
//动态修改样式
// window.document.getElementsByClassName('md-app-content')[0].style.minHeight = clientHeight + 'px';
this.$refs.list_placeholder.parentNode.parentNode.style.maxHeight = clientHeight + 'px';
this.$refs.list_placeholder.parentNode.style.minHeight = clientHeight - 32 + 'px';
window.document.documentElement.setAttribute('data-theme', this.settings.is_dark_mode ? 'dark' : 'light');
this.$refs.list_placeholder.parentNode.parentNode.style.maxHeight =
clientHeight + "px";
this.$refs.list_placeholder.parentNode.style.minHeight =
clientHeight - 32 + "px";
window.document.documentElement.setAttribute(
"data-theme",
this.settings.is_dark_mode ? "dark" : "light"
);
},
// 初始化
init() {
// 刷新vuex
this.$store.replaceState(Object.assign(this.$store.state, JSON.parse(localStorage.getItem('storeState'))));
this.$store.replaceState(
Object.assign(
this.$store.state,
JSON.parse(localStorage.getItem("storeState"))
)
);
// 判断是否有参数
if (this.$route.params.code_content) {
// 判断有无用户密码
@ -127,15 +170,15 @@ export default {
this.addCount();
} else {
// 密码超时
this.turnToHome('密码超时');
this.turnToHome("密码超时");
}
} else {
// 没有密码
this.turnToHome('无密码');
this.turnToHome("无密码");
}
} else {
// 无参跳转
this.turnToHome('无参跳转');
this.turnToHome("无参跳转");
}
},
@ -146,7 +189,7 @@ export default {
} else {
this.lang = lang().detail.EN;
}
console.log('语言配置完成');
console.log("语言配置完成");
},
//返回上一页
@ -157,12 +200,15 @@ export default {
// 强制返回Home
turnToHome(msg) {
console.log(msg);
this.$router.replace('/');
this.$router.replace("/");
},
// 跳转至编辑
turnToEdit() {
this.$router.push({ name: 'Add', params: { modify_content: this.content } });
this.$router.push({
name: "Add",
params: { modify_content: this.content },
});
},
// 复制成功
@ -204,7 +250,7 @@ export default {
}
let data_list_aes = encrypt(main_code_decrpt, data_list);
this.setRowData([data_list_aes, this]);
console.log('新加密信息覆写成功,增加点击完成');
console.log("新加密信息覆写成功,增加点击完成");
},
// 点击取消
@ -234,13 +280,13 @@ export default {
}
let data_list_aes = encrypt(main_code_decrpt, data_cache);
this.setRowData([data_list_aes, this]);
console.log('新加密信息覆写成功,密码删除完成');
console.log("新加密信息覆写成功,密码删除完成");
this.back();
}
},
},
created() {
this.lang = lang().detail.CHS;
console.log('临时语言系统加载完成');
console.log("临时语言系统加载完成");
this.init();
},
mounted() {
@ -256,15 +302,15 @@ export default {
// 如果 `clientHeight` 发生改变，这个函数就会运行
clientHeight: function () {
this.changeFixed(this.clientHeight);
}
},
},
beforeDestroy() {},
components: {}
components: {},
};
</script>
<style scoped lang="scss" type="text/scss">
@import '../../style/main';
@import "../../style/main";
.detail {
width: 100%;
min-height: 100%;

61
src/views/Feedback/Feedback.vue
View File

@ -86,7 +86,7 @@
<script>
// @ is an alias to /src
import { mapState, mapActions } from "vuex";
import { setHtmlFontSize } from '@/utils/px2rem.js'
import { setHtmlFontSize } from "@/utils/px2rem.js";
export default {
name: "Home",
@ -98,34 +98,37 @@ export default {
test_data: [
{
open_count: 0,
title:'QQ',
user_name:'1144131090',
password:'test',
node:'测试用',
},{
open_count:0,
title:'微信',
user_name:'15143211127',
password:'test',
node:'测试用',
},{
open_count:0,
title:'QQ',
user_name:'1144131090',
password:'test',
node:'测试用',
},{
open_count:0,
title:'QQ',
user_name:'1144131090',
password:'test',
node:'测试用',
title: "QQ",
user_name: "1144131090",
password: "test",
node: "测试用",
},
]
{
open_count: 0,
title: "微信",
user_name: "15143211127",
password: "test",
node: "测试用",
},
{
open_count: 0,
title: "QQ",
user_name: "1144131090",
password: "test",
node: "测试用",
},
{
open_count: 0,
title: "QQ",
user_name: "1144131090",
password: "test",
node: "测试用",
},
],
};
},
computed: {
...mapState([])
...mapState([]),
},
methods: {
...mapActions([]),
@ -133,7 +136,7 @@ export default {
//动态修改样式
// console.log(clientHeight);
this.$refs.home.children[0].style.minHeight = clientHeight + "px";
}
},
},
created() {},
mounted() {
@ -149,10 +152,10 @@ export default {
// 如果 `clientHeight` 发生改变，这个函数就会运行
clientHeight: function () {
this.changeFixed(this.clientHeight);
}
},
},
beforeDestroy() {},
components: {}
components: {},
};
</script>
@ -178,7 +181,7 @@ export default {
}
}
.code-card {
padding: .3rem 0;
padding: 0.3rem 0;
border-bottom: 1px #eee solid;
}
}

81
src/views/Generator/Generator.vue
View File

@ -3,7 +3,9 @@
<md-app md-waterfall md-mode="fixed">
<md-app-toolbar class="md-primary toolbar">
<div class="md-toolbar-section-start">
<md-button class="md-icon-button" @click="back()"><md-icon>arrow_back</md-icon></md-button>
<md-button class="md-icon-button" @click="back()">
<md-icon>arrow_back</md-icon>
</md-button>
<h3 class="md-title" style="flex: 1">{{ lang.title }}</h3>
</div>
</md-app-toolbar>
@ -15,7 +17,11 @@
<!-- 生成结果 -->
<md-subheader class="md-primary">{{ lang.subheader[0] }}</md-subheader>
<md-list-item>
<p v-clipboard:copy="code_res" v-clipboard:success="onCopyCode" v-clipboard:error="onErrorCode">{{ code_res ? code_res : lang.code_res_empty }}</p>
<p
v-clipboard:copy="code_res"
v-clipboard:success="onCopyCode"
v-clipboard:error="onErrorCode"
>{{ code_res ? code_res : lang.code_res_empty }}</p>
</md-list-item>
<!-- settings -->
<md-subheader class="md-primary">{{ lang.subheader[1] }}</md-subheader>
@ -52,7 +58,10 @@
<span class="md-list-item-text">{{ lang.settings[3] }}</span>
<md-switch v-model="have_symbol" class="md-primary"></md-switch>
</md-list-item>
<md-button class="md-raised md-primary expand" @click="generateStart()">{{ lang.submit }}</md-button>
<md-button
class="md-raised md-primary expand"
@click="generateStart()"
>{{ lang.submit }}</md-button>
</md-list>
<md-snackbar md-position="center" :md-active.sync="show_snackbar" md-persistent>
<span>{{ snakebar_msg }}</span>
@ -65,22 +74,22 @@
<script>
// @ is an alias to /src
import { mapState, mapActions } from 'vuex';
import { lang } from '@/utils/language.js';
import { generatePassword } from '@/utils/generator.js';
import { setHtmlFontSize } from '@/utils/px2rem.js';
import { mapState, mapActions } from "vuex";
import { lang } from "@/utils/language.js";
import { generatePassword } from "@/utils/generator.js";
import { setHtmlFontSize } from "@/utils/px2rem.js";
export default {
name: 'Add',
name: "Add",
data() {
return {
// snackbar
show_snackbar: false,
snakebar_msg: '',
snakebar_msg: "",
// 语言
lang: '',
lang: "",
// 页面高度
clientHeight: '',
clientHeight: "",
// 大写字母
have_upper: true,
// 小写字母
@ -92,14 +101,14 @@ export default {
// 密码长度
code_length: 12,
// 生成密码结果
code_res: ''
code_res: "",
};
},
computed: {
...mapState(['user_infos', 'row_data', 'row_pwd', 'settings'])
...mapState(["user_infos", "row_data", "row_pwd", "settings"]),
},
methods: {
...mapActions(['setUserInfo', 'setRowData', 'setRowPwd', 'setSettings']),
...mapActions(["setUserInfo", "setRowData", "setRowPwd", "setSettings"]),
// 修改md-app的最小高度
changeFixed(clientHeight) {
@ -107,14 +116,24 @@ export default {
// console.log(clientHeight);
// window.document.getElementsByClassName("md-content")[0].style.minHeight =
// clientHeight + "px";
this.$refs.list_placeholder.parentNode.parentNode.style.maxHeight = clientHeight + 'px';
this.$refs.list_placeholder.parentNode.style.minHeight = clientHeight - 32 + 'px';
window.document.documentElement.setAttribute('data-theme', this.settings.is_dark_mode ? 'dark' : 'light');
this.$refs.list_placeholder.parentNode.parentNode.style.maxHeight =
clientHeight + "px";
this.$refs.list_placeholder.parentNode.style.minHeight =
clientHeight - 32 + "px";
window.document.documentElement.setAttribute(
"data-theme",
this.settings.is_dark_mode ? "dark" : "light"
);
},
// 初始化
init() {
// 刷新vuex
this.$store.replaceState(Object.assign(this.$store.state, JSON.parse(localStorage.getItem('storeState'))));
this.$store.replaceState(
Object.assign(
this.$store.state,
JSON.parse(localStorage.getItem("storeState"))
)
);
// 判断有无用户密码
if (Object.keys(this.row_pwd).length != 0) {
// 有密码，已经输入过了
@ -125,11 +144,11 @@ export default {
this.initLanguage();
} else {
// 密码超时
this.turnToHome('密码超时');
this.turnToHome("密码超时");
}
} else {
// 没有密码
this.turnToHome('无密码');
this.turnToHome("无密码");
}
},
@ -140,7 +159,7 @@ export default {
} else {
this.lang = lang().generator.EN;
}
console.log('语言配置完成');
console.log("语言配置完成");
},
//返回上一页
@ -151,12 +170,18 @@ export default {
// 强制返回Home
turnToHome(msg) {
console.log(msg);
this.$router.replace('/');
this.$router.replace("/");
},
// 开始生成
generateStart() {
this.code_res = generatePassword(this.code_length, this.have_lower, this.have_upper, this.have_num, this.have_symbol);
this.code_res = generatePassword(
this.code_length,
this.have_lower,
this.have_upper,
this.have_num,
this.have_symbol
);
this.snakebar_msg = this.lang.generate_successful;
this.show_snackbar = true;
},
@ -171,11 +196,11 @@ export default {
onErrorCode() {
this.snakebar_msg = this.lang.copy_failed;
this.show_snackbar = true;
}
},
},
created() {
this.lang = lang().generator.CHS;
console.log('临时语言系统加载完成');
console.log("临时语言系统加载完成");
this.init();
},
mounted() {
@ -191,15 +216,15 @@ export default {
// 如果 `clientHeight` 发生改变，这个函数就会运行
clientHeight: function () {
this.changeFixed(this.clientHeight);
}
},
},
beforeDestroy() {},
components: {}
components: {},
};
</script>
<style scoped lang="scss" type="text/scss">
@import '../../style/main';
@import "../../style/main";
.account {
width: 100%;
min-height: 100%;

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

@ -3,14 +3,20 @@
<md-app md-waterfall md-mode="fixed">
<md-app-toolbar class="md-primary">
<div class="md-toolbar-section-start">
<md-button class="md-icon-button" @click="menuVisible = !menuVisible"><md-icon>menu</md-icon></md-button>
<md-button class="md-icon-button" @click="menuVisible = !menuVisible">
<md-icon>menu</md-icon>
</md-button>
<span class="md-title page-title" @click="scrollTop()">{{ lang.title }}</span>
</div>
<div class="md-toolbar-section-end">
<div class="sroll-top-area" @click="scrollTop()"></div>
<md-button class="md-icon-button" @click="turnToSearch()"><md-icon>search</md-icon></md-button>
<md-button class="md-icon-button" @click="turnToSearch()">
<md-icon>search</md-icon>
</md-button>
<md-menu md-align-trigger>
<md-button md-menu-trigger class="md-icon-button"><md-icon>more_vert</md-icon></md-button>
<md-button md-menu-trigger class="md-icon-button">
<md-icon>more_vert</md-icon>
</md-button>
<md-menu-content>
<md-menu-item @click="changeSortType('Alphabetically')">{{ lang.menu[0] }}</md-menu-item>
<md-menu-item @click="changeSortType('Recently Used')">{{ lang.menu[1] }}</md-menu-item>
@ -18,7 +24,12 @@
</md-menu>
</div>
<div class="md-toolbar-row" v-if="search_start">
<md-autocomplete class="search" v-model="search_content" :md-options="titles" md-layout="box">
<md-autocomplete
class="search"
v-model="search_content"
:md-options="titles"
md-layout="box"
>
<label>{{ lang.search }}</label>
</md-autocomplete>
</div>
@ -67,7 +78,11 @@
<span class="md-list-item-text">{{ lang.drawer[7] }}</span>
</md-list-item>
<md-list-item v-clipboard:copy="web_addr" v-clipboard:success="onCopyUrl" v-clipboard:error="onErrorUrl">
<md-list-item
v-clipboard:copy="web_addr"
v-clipboard:success="onCopyUrl"
v-clipboard:error="onErrorUrl"
>
<md-icon>reply</md-icon>
<span class="md-list-item-text">{{ lang.drawer[4] }}</span>
</md-list-item>
@ -87,11 +102,24 @@
<md-app-content>
<v-touch @swiperight="menuVisible = true" :swipe-options="{ direction: 'horizontal' }">
<div ref="list_placeholder" :style="`height:${search_start ? '86' : '40'}px`"></div>
<md-empty-state md-icon="devices_other" :md-label="lang.empty_state.label" :md-description="lang.empty_state.description" v-if="show_list.length == 0 && !search_start">
<md-button class="md-primary md-raised" @click="turnToAdd()">{{ lang.empty_state.button }}</md-button>
<md-empty-state
md-icon="devices_other"
:md-label="lang.empty_state.label"
:md-description="lang.empty_state.description"
v-if="show_list.length == 0 && !search_start"
>
<md-button
class="md-primary md-raised"
@click="turnToAdd()"
>{{ lang.empty_state.button }}</md-button>
</md-empty-state>
<div class="code-card" v-for="(code, index) in show_list" :key="index" @click="turnToDetail(code)">
<div
class="code-card"
v-for="(code, index) in show_list"
:key="index"
@click="turnToDetail(code)"
>
<p class="md-title">{{ code.title }}</p>
<p class="md-caption">{{ code.user_name }}</p>
<md-divider></md-divider>
@ -99,7 +127,9 @@
</div>
<md-speed-dial class="md-bottom-right" v-if="show_list.length != 0 || search_start">
<md-speed-dial-target class="md-primary" @click="turnToAdd()"><md-icon>add</md-icon></md-speed-dial-target>
<md-speed-dial-target class="md-primary" @click="turnToAdd()">
<md-icon>add</md-icon>
</md-speed-dial-target>
</md-speed-dial>
<md-snackbar md-position="center" :md-active.sync="show_snackbar" md-persistent>
@ -113,31 +143,36 @@
<script>
// @ is an alias to /src
import { mapState, mapActions } from 'vuex';
import { encrypt, decrypt, encryptMainCode, decryptMainCode } from '@/utils/aes.js';
import { lang } from '@/utils/language.js';
import { setHtmlFontSize } from '@/utils/px2rem.js';
import { mapState, mapActions } from "vuex";
import {
encrypt,
decrypt,
encryptMainCode,
decryptMainCode,
} from "@/utils/aes.js";
import { lang } from "@/utils/language.js";
import { setHtmlFontSize } from "@/utils/px2rem.js";
export default {
name: 'Home',
name: "Home",
data() {
return {
// 显示抽屉开关
menuVisible: false,
// 显示高度，控制md-app的最小高度，防止抽屉高度塌陷
clientHeight: '',
clientHeight: "",
// 显示的密码列表
show_list: [],
// 搜索暂存list
cache_list: [],
unlock: false,
show_snackbar: false,
snakebar_msg: '',
web_addr: 'https://canary.lacus.icu',
snakebar_msg: "",
web_addr: "https://canary.lacus.icu",
titles: [],
search_content: '',
search_content: "",
search_start: false,
lang: '',
lang: "",
// vcnsole模块
lastClickTime: 0,
count: 0,
@ -146,25 +181,47 @@ export default {
};
},
computed: {
...mapState(['user_infos', 'row_data', 'row_pwd', 'settings', 'home_state'])
...mapState([
"user_infos",
"row_data",
"row_pwd",
"settings",
"home_state",
]),
},
methods: {
...mapActions(['setUserInfo', 'setRowData', 'setRowPwd', 'setSettings', 'setHomeState']),
...mapActions([
"setUserInfo",
"setRowData",
"setRowPwd",
"setSettings",
"setHomeState",
]),
// 修改md-app的最小高度
changeFixed(clientHeight) {
//动态修改样式
// console.log(clientHeight);
this.$refs.home.children[0].style.minHeight = clientHeight + 'px';
this.$refs.list_placeholder.parentNode.parentNode.style.maxHeight = clientHeight + 'px';
this.$refs.list_placeholder.parentNode.style.minHeight = clientHeight - 32 + 'px';
window.document.documentElement.setAttribute('data-theme', this.settings.is_dark_mode ? 'dark' : 'light');
this.$refs.home.children[0].style.minHeight = clientHeight + "px";
this.$refs.list_placeholder.parentNode.parentNode.style.maxHeight =
clientHeight + "px";
this.$refs.list_placeholder.parentNode.style.minHeight =
clientHeight - 32 + "px";
window.document.documentElement.setAttribute(
"data-theme",
this.settings.is_dark_mode ? "dark" : "light"
);
},
// 初始化
init() {
// 刷新vuex
this.$store.replaceState(Object.assign(this.$store.state, JSON.parse(localStorage.getItem('storeState'))));
this.$store.replaceState(
Object.assign(
this.$store.state,
JSON.parse(localStorage.getItem("storeState"))
)
);
// 初始化
this.initUserInfo();
this.initSettings();
@ -180,33 +237,34 @@ export default {
// 解密主密码
let main_code_decrpt = decryptMainCode(this.row_pwd.main_code);
let data_decrypt;
let data_list;
// 解密密码本
try {
data_decrypt = decrypt(main_code_decrpt, this.row_data);
// 刷新显示内容
data_list = JSON.parse(data_decrypt);
} catch (e) {
// 不正确
// 跳转到解锁界面
console.log(e);
this.turnToUnlock('密码错误');
this.turnToUnlock("密码错误");
return;
}
// 刷新显示内容
let data_list = JSON.parse(data_decrypt);
this.show_list = data_list;
// 抽离title
this.separateTitle(data_list);
// 恢复原先状态
if (this.home_state) {
this.search_start = this.home_state.search_start
this.search_content = this.home_state.search_content
this.search_start = this.home_state.search_start;
this.search_content = this.home_state.search_content;
this.$nextTick(() => {
this.$refs.list_placeholder.parentNode.parentNode.scrollTo({
top: this.home_state.scrollHeight
top: this.home_state.scrollHeight,
});
console.log("原状态恢复完成");
this.setHomeState(["", this]);
console.log("主页状态缓存删除完成");
});
console.log('原状态恢复完成')
this.setHomeState(['', this])
console.log('主页状态缓存删除完成')
})
}
} else {
// 空密码本
@ -214,14 +272,14 @@ export default {
}
} else {
// 跳转到解锁界面
this.turnToUnlock('密码超时');
this.turnToUnlock("密码超时");
}
} else {
// 没有密码，跳转到解锁界面创建密码
this.turnToUnlock('无密码');
this.turnToUnlock("无密码");
}
console.log(this.show_list.length != 0 ? '密码本存在' : '空密码本');
console.log(this.unlock ? '已解锁' : '未解锁');
console.log(this.show_list.length != 0 ? "密码本存在" : "空密码本");
console.log(this.unlock ? "已解锁" : "未解锁");
},
// 初始化用户信息
@ -229,17 +287,17 @@ export default {
if (Object.keys(this.user_infos).length == 0) {
// 初始化用户信息
let user_infos = {
user_name: 'A Little Canary',
cid: 'Codebook',
row_login_pwd: '',
drivce: '',
cloud_drivce: this.settings.is_chinese ? '暂无' : 'unknown',
update_time: new Date().getTime()
user_name: "A Little Canary",
cid: "Codebook",
row_login_pwd: "",
drivce: "",
cloud_drivce: this.settings.is_chinese ? "暂无" : "unknown",
update_time: new Date().getTime(),
};
this.setUserInfo([user_infos, this]);
console.log('用户信息覆写完成');
console.log("用户信息覆写完成");
}
console.log('用户信息初始化完成');
console.log("用户信息初始化完成");
},
// 初始化配置信息
@ -249,10 +307,10 @@ export default {
let settings = {
is_chinese: true,
is_dark_mode: false,
expired_time: 300000 // 5分钟
expired_time: 300000, // 5分钟
};
this.setSettings([settings, this]);
console.log('配置信息覆写完成');
console.log("配置信息覆写完成");
}
if (this.settings.is_chinese) {
@ -260,43 +318,55 @@ export default {
} else {
this.lang = lang().home.EN;
}
console.log('语言配置完成');
console.log('配置信息初始化完成');
console.log("语言配置完成");
console.log("配置信息初始化完成");
},
// 修改排序
changeSortType(type) {
// 没有内容拦截器
if (this.show_list.length == 0) {
console.log('修改排序无内容拦截');
console.log("修改排序无内容拦截");
return;
}
// 排序
if (type == 'Alphabetically') {
if (type == "Alphabetically") {
// 按首字母排序
this.show_list = this.show_list.sort((a, b) => a['title'].localeCompare(b['title']));
this.show_list = this.show_list.sort((a, b) =>
a["title"].localeCompare(b["title"])
);
} else {
// 按使用频率排序
this.show_list = this.show_list.sort((a, b) => b['open_count'] - a['open_count']);
this.show_list = this.show_list.sort(
(a, b) => b["open_count"] - a["open_count"]
);
}
},
// 跳转到解锁界面
turnToUnlock(type) {
this.setHomeState(['', this])
console.log('主页状态缓存删除完成')
this.setHomeState(["", this]);
console.log("主页状态缓存删除完成");
console.log(type);
this.setRowPwd(['', this]);
if (type == '密码超时') this.$router.push({ name: 'Unlock', params: { msg: this.lang.unlock_msg.expired } });
if (type == '密码错误') this.$router.push({ name: 'Unlock', params: { msg: this.lang.unlock_msg.wrong } });
else this.$router.push('/unlock');
this.setRowPwd(["", this]);
if (type == "密码超时")
this.$router.push({
name: "Unlock",
params: { msg: this.lang.unlock_msg.expired },
});
if (type == "密码错误")
this.$router.push({
name: "Unlock",
params: { msg: this.lang.unlock_msg.wrong },
});
else this.$router.push("/unlock");
},
// 跳转到搜索界面
turnToSearch() {
// 没有内容拦截器
if (this.show_list.length == 0) {
console.log('点击搜索无内容拦截');
console.log("点击搜索无内容拦截");
return;
}
this.search_start = !this.search_start;
@ -306,26 +376,26 @@ export default {
turnToAdd() {
// 未解锁拦截器
if (!this.unlock) {
this.turnToUnlock('点击新增未解锁拦截');
this.turnToUnlock("点击新增未解锁拦截");
return;
}
let home_state = {
search_start: this.search_start,
search_content: this.search_content,
scrollHeight: this.scrollHeight
}
this.setHomeState([home_state, this])
this.$router.push('/add');
scrollHeight: this.scrollHeight,
};
this.setHomeState([home_state, this]);
this.$router.push("/add");
},
turnToDetail(content) {
let home_state = {
search_start: this.search_start,
search_content: this.search_content,
scrollHeight: this.scrollHeight
}
this.setHomeState([home_state, this])
this.$router.push({ name: 'Detail', params: { code_content: content } });
scrollHeight: this.scrollHeight,
};
this.setHomeState([home_state, this]);
this.$router.push({ name: "Detail", params: { code_content: content } });
},
// 跳转到某页面
@ -333,9 +403,9 @@ export default {
let home_state = {
search_start: this.search_start,
search_content: this.search_content,
scrollHeight: this.scrollHeight
}
this.setHomeState([home_state, this])
scrollHeight: this.scrollHeight,
};
this.setHomeState([home_state, this]);
this.$router.push(url);
},
@ -358,7 +428,7 @@ export default {
title_list.push(data_list[i].title);
}
this.titles = title_list;
console.log('数据头部分离完成');
console.log("数据头部分离完成");
},
// 模糊搜索
@ -370,43 +440,45 @@ export default {
}
let data_list = [];
for (let i in cache_list) {
if (this.generReg(this.search_content.trim()).test(cache_list[i].title)) {
if (
this.generReg(this.search_content.trim()).test(cache_list[i].title)
) {
data_list.push(cache_list[i]);
}
}
this.show_list = data_list;
console.log('模糊搜索完成')
console.log("模糊搜索完成");
},
// 模糊搜索辅助轮
generReg(val) {
let head = '(.*)(';
let tail = ')(.*)';
let body = val.split('').join(')(.*)(');
return new RegExp(head + body + tail, 'i');
let head = "(.*)(";
let tail = ")(.*)";
let body = val.split("").join(")(.*)(");
return new RegExp(head + body + tail, "i");
},
// 下载apk
downloadApk() {
window.open('https://assets.lacus.site/canary/netdisk_canary.apk');
window.open("https://assets.lacus.site/canary/netdisk_canary.apk");
},
// 一键回顶
scrollTop() {
this.$refs.list_placeholder.parentNode.parentNode.scrollTo({
top: 0,
behavior: 'smooth'
behavior: "smooth",
});
console.log('一键回顶成功');
console.log("一键回顶成功");
},
// 判断是否有class
hasClass(obj, cls) {
return obj.className.match(new RegExp('(\\s|^)' + cls + '(\\s|$)'));
return obj.className.match(new RegExp("(\\s|^)" + cls + "(\\s|$)"));
},
// 增加class
addClass(obj, cls) {
if (!this.hasClass(obj, cls)) obj.className += ' ' + cls;
if (!this.hasClass(obj, cls)) obj.className += " " + cls;
},
// 改变class
toggleClass(obj, cls) {
@ -419,8 +491,8 @@ export default {
// 移除class
removeClass(obj, cls) {
if (this.hasClass(obj, cls)) {
var reg = new RegExp('(\\s|^)' + cls + '(\\s|$)');
obj.className = obj.className.replace(reg, ' ');
var reg = new RegExp("(\\s|^)" + cls + "(\\s|$)");
obj.className = obj.className.replace(reg, " ");
}
},
// 点击处理vconsole
@ -433,24 +505,24 @@ export default {
}
this.lastClickTime = nowTime;
if (this.count >= 10) {
let vconDom = document.getElementById('__vconsole');
this.toggleClass(vconDom, 'vconsole-show');
let vconDom = document.getElementById("__vconsole");
this.toggleClass(vconDom, "vconsole-show");
this.count = 0;
}
},
// 记录滚动高度
scroll(e) {
this.scrollHeight = this.$refs.list_placeholder.parentNode.parentNode.scrollTop
this.scrollHeight = this.$refs.list_placeholder.parentNode.parentNode.scrollTop;
},
openQQ() {
window.open('https://jq.qq.com/?_wv=1027&k=KIKWmqys')
}
window.open("https://jq.qq.com/?_wv=1027&k=KIKWmqys");
},
},
created() {
this.lang = lang().home.CHS;
console.log('临时语言系统加载完成');
console.log("临时语言系统加载完成");
this.init();
},
mounted() {
@ -461,7 +533,10 @@ export default {
this.clientHeight = `${document.documentElement.clientHeight}`;
setHtmlFontSize();
}.bind(this);
this.$refs.list_placeholder.parentNode.parentNode.addEventListener('scroll', this.scroll)
this.$refs.list_placeholder.parentNode.parentNode.addEventListener(
"scroll",
this.scroll
);
},
watch: {
// 如果 `clientHeight` 发生改变，这个函数就会运行
@ -472,12 +547,12 @@ export default {
search_start: function () {
if (this.search_start) {
this.cache_list = JSON.parse(JSON.stringify(this.show_list));
console.log('搜索阵列展开，缓存设置完成');
console.log("搜索阵列展开，缓存设置完成");
} else {
this.search_content = ''
this.search_content = "";
this.show_list = JSON.parse(JSON.stringify(this.cache_list));
this.cache_list = [];
console.log('搜索阵列关闭，缓存清空完成');
console.log("搜索阵列关闭，缓存清空完成");
}
},
// 如果 `search_content` 发生改变，这个函数就会运行
@ -486,15 +561,15 @@ export default {
if (this.search_start) {
this.fuzzySearch(this.cache_list);
}
}
},
},
beforeDestroy() {},
components: {}
components: {},
};
</script>
<style scoped lang="scss" type="text/scss">
@import '../../style/main';
@import "../../style/main";
.home {
width: 100%;
// max-width: 500px;

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

@ -3,7 +3,9 @@
<md-app md-waterfall md-mode="fixed">
<md-app-toolbar class="md-primary toolbar">
<div class="md-toolbar-section-start">
<md-button class="md-icon-button" @click="back()"><md-icon>arrow_back</md-icon></md-button>
<md-button class="md-icon-button" @click="back()">
<md-icon>arrow_back</md-icon>
</md-button>
<h3 class="md-title" style="flex: 1">{{ lang.title }}</h3>
</div>
</md-app-toolbar>
@ -16,19 +18,34 @@
<md-list-item @click="openResetDialog('account')">
<md-icon>person</md-icon>
<span class="md-list-item-text">{{ lang.reset_list[0] }}</span>
<md-progress-spinner v-if="account_loading" :md-diameter="22" :md-stroke="3" md-mode="indeterminate"></md-progress-spinner>
<md-progress-spinner
v-if="account_loading"
:md-diameter="22"
:md-stroke="3"
md-mode="indeterminate"
></md-progress-spinner>
</md-list-item>
<md-list-item @click="openResetDialog('codebook')">
<md-icon>format_align_left</md-icon>
<span class="md-list-item-text">{{ lang.reset_list[1] }}</span>
<md-progress-spinner v-if="codebook_loading" :md-diameter="22" :md-stroke="3" md-mode="indeterminate"></md-progress-spinner>
<md-progress-spinner
v-if="codebook_loading"
:md-diameter="22"
:md-stroke="3"
md-mode="indeterminate"
></md-progress-spinner>
</md-list-item>
<md-list-item @click="openResetDialog('application')">
<md-icon>layers</md-icon>
<span class="md-list-item-text">{{ lang.reset_list[2] }}</span>
<md-progress-spinner v-if="application_loading" :md-diameter="22" :md-stroke="3" md-mode="indeterminate"></md-progress-spinner>
<md-progress-spinner
v-if="application_loading"
:md-diameter="22"
:md-stroke="3"
md-mode="indeterminate"
></md-progress-spinner>
</md-list-item>
<md-list-item @click="open_dialog">
@ -62,8 +79,37 @@
</md-select>
</md-field>
</md-list-item>
<md-divider></md-divider>
<md-subheader class="md-primary">{{ lang.subheader[2] }}</md-subheader>
<md-list-item style="list-style-type:none;" @click="reset_row_data_active = true">
<md-icon>call_merge</md-icon>
<span class="md-list-item-text">{{ lang.import_export_list[0] }}</span>
</md-list-item>
<md-list-item
style="list-style-type:none;"
v-clipboard:copy="copy_data"
v-clipboard:success="onCopyCodebook"
v-clipboard:error="onErrorCodebook"
>
<md-icon>call_split</md-icon>
<span class="md-list-item-text">{{ lang.import_export_list[1] }}</span>
</md-list-item>
</md-list>
<md-dialog-prompt
:md-active.sync="reset_row_data_active"
v-model="new_row_data"
:md-title="lang.import_dialog.title"
:md-input-placeholder="lang.import_dialog.placeholder"
:md-confirm-text="lang.import_dialog.confirm"
:md-cancel-text="lang.import_dialog.cancel"
@md-confirm="resetRowData"
/>
<md-dialog-prompt
:md-active.sync="reset_main_pwd_active"
v-model="new_main_pwd"
@ -96,14 +142,19 @@
<script>
// @ 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 { lang } from '@/utils/language.js';
import { setHtmlFontSize } from '@/utils/px2rem.js';
import { mapState, mapActions } from "vuex";
import {
encrypt,
decrypt,
encryptMainCode,
decryptMainCode,
} from "@/utils/aes.js";
import { login, activation, syncLocal, syncCloud } from "@/axios/api.js";
import { lang } from "@/utils/language.js";
import { setHtmlFontSize } from "@/utils/px2rem.js";
export default {
name: 'Add',
name: "Add",
data() {
return {
// 重置loading
@ -111,7 +162,9 @@ export default {
codebook_loading: false,
application_loading: false,
reset_main_pwd_active: false,
new_main_pwd: '',
new_row_data: "",
reset_row_data_active: false,
new_main_pwd: "",
reset_active: false,
// 设置状态
is_chinese: false,
@ -120,35 +173,49 @@ export default {
expired_time: 300000,
// snackbar
show_snackbar: false,
snakebar_msg: '',
snakebar_msg: "",
// 初始化完成状态
has_init: false,
lang: '',
clientHeight: '',
lang: "",
clientHeight: "",
// 重置确认
reset_confirm: false,
reset_type: ''
reset_type: "",
};
},
computed: {
...mapState(['user_infos', 'row_data', 'row_pwd', 'settings'])
...mapState(["user_infos", "row_data", "row_pwd", "settings"]),
copy_data: function () {
if (!this.row_data) return "无内容";
return this.row_data;
},
},
methods: {
...mapActions(['setUserInfo', 'setRowData', 'setRowPwd', 'setSettings']),
...mapActions(["setUserInfo", "setRowData", "setRowPwd", "setSettings"]),
// 修改md-app的最小高度
changeFixed(clientHeight) {
//动态修改样式
// console.log(clientHeight);
// window.document.getElementsByClassName('md-content')[0].style.minHeight = clientHeight + 'px';
this.$refs.list_placeholder.parentNode.parentNode.style.maxHeight = clientHeight + 'px';
this.$refs.list_placeholder.parentNode.style.minHeight = clientHeight - 32 + 'px';
window.document.documentElement.setAttribute('data-theme', this.settings.is_dark_mode ? 'dark' : 'light');
this.$refs.list_placeholder.parentNode.parentNode.style.maxHeight =
clientHeight + "px";
this.$refs.list_placeholder.parentNode.style.minHeight =
clientHeight - 32 + "px";
window.document.documentElement.setAttribute(
"data-theme",
this.settings.is_dark_mode ? "dark" : "light"
);
},
// 初始化
init() {
// 刷新vuex
this.$store.replaceState(Object.assign(this.$store.state, JSON.parse(localStorage.getItem('storeState'))));
this.$store.replaceState(
Object.assign(
this.$store.state,
JSON.parse(localStorage.getItem("storeState"))
)
);
// 判断有无用户密码
if (Object.keys(this.row_pwd).length != 0) {
// 有密码，已经输入过了
@ -164,17 +231,17 @@ export default {
setTimeout(
function () {
this.has_init = true;
console.log('本页信息覆写完成');
console.log("本页信息覆写完成");
}.bind(this),
10
);
} else {
// 密码超时
this.turnToHome('密码超时');
this.turnToHome("密码超时");
}
} else {
// 没有密码
this.turnToHome('无密码');
this.turnToHome("无密码");
}
},
@ -185,7 +252,7 @@ export default {
} else {
this.lang = lang().settings.EN;
}
console.log('语言配置完成');
console.log("语言配置完成");
},
//返回上一页
@ -200,7 +267,7 @@ export default {
// 强制返回Home
turnToHome(msg) {
console.log(msg);
this.$router.replace('/');
this.$router.replace("/");
},
// 重置账户
@ -219,15 +286,15 @@ export default {
}
// 初始化用户信息
let user_infos = {
user_name: 'A Little Canary',
cid: 'Codebook',
row_login_pwd: '',
drivce: need_reset_drvice ? '' : this.user_infos.drivce,
cloud_drivce: this.settings.is_chinese ? '暂无' : 'unknown',
update_time: new Date().getTime()
user_name: "A Little Canary",
cid: "Codebook",
row_login_pwd: "",
drivce: need_reset_drvice ? "" : this.user_infos.drivce,
cloud_drivce: this.settings.is_chinese ? "暂无" : "unknown",
update_time: new Date().getTime(),
};
this.setUserInfo([user_infos, this]);
console.log('用户信息覆写完成');
console.log("用户信息覆写完成");
this.reset_active = false;
},
@ -245,8 +312,8 @@ export default {
1000
);
}
this.setRowData(['', this]);
console.log('密码本覆写完成');
this.setRowData(["", this]);
console.log("密码本覆写完成");
this.reset_active = false;
},
@ -256,18 +323,18 @@ export default {
this.reset_active = true;
this.resetAccount(false, true);
this.resetCodebook(false);
this.setRowPwd(['', this]);
console.log('主密码覆写完成');
this.setRowPwd(["", this]);
console.log("主密码覆写完成");
let settings = {
is_chinese: true,
is_dark_mode: false,
expired_time: 300000
expired_time: 300000,
};
this.setSettings([settings, this]);
console.log('个性化设置覆写完成');
console.log("个性化设置覆写完成");
this.reset_active = false;
this.application_loading = false;
this.turnToHome('项目重置完成');
this.turnToHome("项目重置完成");
},
//覆写个性化设置
@ -275,17 +342,20 @@ export default {
let settings = {
is_chinese: this.is_chinese,
is_dark_mode: this.is_dark_mode,
expired_time: this.expired_time
expired_time: this.expired_time,
};
this.setSettings([settings, this]);
console.log('个性化设置覆写完成');
console.log("个性化设置覆写完成");
if (this.settings.is_chinese) {
this.lang = lang().settings.CHS;
} else {
this.lang = lang().settings.EN;
}
window.document.documentElement.setAttribute('data-theme', this.settings.is_dark_mode ? 'dark' : 'light');
console.log('语言配置完成');
window.document.documentElement.setAttribute(
"data-theme",
this.settings.is_dark_mode ? "dark" : "light"
);
console.log("语言配置完成");
this.snakebar_msg = this.lang.snakebar_msg.reset_settings;
this.show_snackbar = true;
},
@ -294,6 +364,18 @@ export default {
this.reset_main_pwd_active = true;
},
resetRowData(new_row_data) {
// 空内容拦截器
if (!new_row_data.trim()) {
this.snakebar_msg = this.lang.snakebar_msg.reset_row_data_failed;
this.show_snackbar = true;
return;
}
this.setRowData([new_row_data, this]);
this.snakebar_msg = this.lang.snakebar_msg.reset_row_data_successful;
this.show_snackbar = true;
},
resetPwd(new_main_pwd) {
// 空内容拦截器
if (!new_main_pwd.trim()) {
@ -312,18 +394,18 @@ export default {
// 不正确
// 跳转到解锁界面
console.log(e);
this.turnToHome('密码错误');
this.turnToHome("密码错误");
return;
}
let data_list = JSON.parse(data_decrypt);
let data_list_aes = encrypt(new_main_pwd, data_list);
this.setRowData([data_list_aes, this]);
console.log('密码本密码修改成功，覆写完成')
console.log("密码本密码修改成功，覆写完成");
}
let main_code_aes = encryptMainCode(new_main_pwd);
let row_pwd = {
main_code: main_code_aes,
create_time: new Date().getTime()
create_time: new Date().getTime(),
};
this.setRowPwd([row_pwd, this]);
this.snakebar_msg = this.lang.snakebar_msg.reset_pwd_successful;
@ -333,31 +415,43 @@ export default {
// 打开重置的警告提醒
openResetDialog(type) {
this.reset_confirm = true;
this.reset_type = type
this.reset_type = type;
},
// 提醒完成点击确定
resetStart() {
console.log('用户点击继续，重置开始')
console.log("用户点击继续，重置开始");
switch (this.reset_type) {
case 'account':
case "account":
this.resetAccount();
break
case 'codebook':
break;
case "codebook":
this.resetCodebook();
break
case 'application':
break;
case "application":
this.resetApplication();
break
break;
default:
return
}
this.reset_type = ''
return;
}
this.reset_type = "";
},
// 导出成功
onCopyCodebook(e) {
this.snakebar_msg = this.lang.copy.successful;
this.show_snackbar = true;
},
// 导出失败
onErrorCodebook(e) {
this.snakebar_msg = this.lang.copy.failed;
this.show_snackbar = true;
},
},
created() {
this.lang = lang().settings.CHS;
console.log('临时语言系统加载完成');
console.log("临时语言系统加载完成");
this.init();
},
mounted() {
@ -385,15 +479,15 @@ export default {
// 如果 `expired_time` 发生改变，就会执行设置函数
expired_time: function () {
if (this.has_init) this.resetSettings();
}
},
},
beforeDestroy() {},
components: {}
components: {},
};
</script>
<style scoped lang="scss" type="text/scss">
@import '../../style/main';
@import "../../style/main";
.account {
width: 100%;
min-height: 100%;

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

@ -28,7 +28,10 @@
<md-button class="md-raised md-primary center" @click="judgePwd()">{{ lang.enter }}</md-button>
<p class="center tips">此密码本为长理专版，未开启同步密码将加密后存放本地，开启同步密码将加密后存放在您的长理网盘中，请放心使用 <span class="qq-link" @click="openQQ()">点我加入用户群</span></p>
<p class="center tips">
此密码本为长理专版，未开启同步密码将加密后存放本地，开启同步密码将加密后存放在您的长理网盘中，请放心使用
<span class="qq-link" @click="openQQ()">点我加入用户群</span>
</p>
<md-dialog-confirm
:md-active.sync="show_dialog"
@ -48,48 +51,58 @@
<script>
// @ is an alias to /src
import { mapState, mapActions } from 'vuex';
import { encrypt, decrypt, encryptMainCode, decryptMainCode } from '@/utils/aes.js';
import { lang } from '@/utils/language.js';
import { mapState, mapActions } from "vuex";
import {
encrypt,
decrypt,
encryptMainCode,
decryptMainCode,
} from "@/utils/aes.js";
import { lang } from "@/utils/language.js";
export default {
name: 'Unlock',
name: "Unlock",
data() {
return {
pwd: '',
repeat: '',
drivce: '',
pwd: "",
repeat: "",
drivce: "",
is_err: false,
is_drivce_err: false,
err_msg: '',
drivce_err_msg:'',
err_msg: "",
drivce_err_msg: "",
show_dialog: false,
is_create: false,
show_snackbar: false,
snakebar_msg: '',
lang: ''
snakebar_msg: "",
lang: "",
};
},
computed: {
...mapState(['row_data', 'settings', 'user_infos']),
...mapState(["row_data", "settings", "user_infos"]),
messageClass() {
return {
'md-invalid': this.is_err
"md-invalid": this.is_err,
};
},
drivceMessageClass() {
return {
'md-invalid': this.is_drivce_err
}
}
"md-invalid": this.is_drivce_err,
};
},
},
methods: {
...mapActions(['setRowPwd', 'setUserInfo']),
...mapActions(["setRowPwd", "setUserInfo"]),
// 初始化
init() {
// 刷新vuex
this.$store.replaceState(Object.assign(this.$store.state, JSON.parse(localStorage.getItem('storeState'))));
this.$store.replaceState(
Object.assign(
this.$store.state,
JSON.parse(localStorage.getItem("storeState"))
)
);
this.initLanguage();
// 判断是创建密码还是输入密码
this.is_create = !this.row_data && !this.user_infos.drivce;
@ -102,7 +115,7 @@ export default {
} else {
this.lang = lang().unlock.EN;
}
console.log('语言配置完成');
console.log("语言配置完成");
},
// 点击提交判断密码
@ -111,22 +124,22 @@ export default {
if (this.pwd.trim().length == 0) {
this.is_err = true;
this.err_msg = this.lang.empty_pwd_error;
console.log('密码为空拦截');
console.log("密码为空拦截");
return;
}
// 判断是否有密码本
if (!this.is_create) {
// 有密码本
// 解密密码本
let test_decode
let test_decode;
try {
test_decode = decrypt(this.pwd, this.row_data);
} catch (e) {
// 错误
this.is_err = true;
this.err_msg = this.lang.wrong_pwd_error;
console.log('密码输入错误拦截');
return
console.log("密码输入错误拦截");
return;
}
// 正确,将密码加密放进locolstorage
this.submit();
@ -134,7 +147,7 @@ export default {
if (this.drivce.trim().length == 0) {
this.is_drivce_err = true;
this.drivce_err_msg = this.lang.drivce_error;
console.log('设备名为空拦截');
console.log("设备名为空拦截");
return;
}
// 空密码本，不论输入什么都是对的，但是需要比较两个输入的是不是一样的
@ -145,14 +158,14 @@ export default {
// 两次不一致
this.is_err = true;
this.err_msg = this.lang.match_pwd_error;
console.log('密码两次输入不一致拦截');
console.log("密码两次输入不一致拦截");
}
}
},
// 用户点击取消
onCancel() {
console.log('用户点击取消');
console.log("用户点击取消");
},
// 提交然后返回主页
@ -160,23 +173,23 @@ export default {
let main_code_aes = encryptMainCode(this.pwd);
let row_pwd = {
main_code: main_code_aes,
create_time: new Date().getTime()
create_time: new Date().getTime(),
};
let user_infos = this.user_infos
user_infos.drivce = this.drivce
this.setUserInfo([user_infos, this])
let user_infos = this.user_infos;
user_infos.drivce = this.drivce;
this.setUserInfo([user_infos, this]);
this.setRowPwd([row_pwd, this]);
console.log('主密码设置完成，返回Home');
this.$router.replace('/');
console.log("主密码设置完成，返回Home");
this.$router.replace("/");
},
openQQ() {
window.open('https://jq.qq.com/?_wv=1027&k=KIKWmqys')
}
window.open("https://jq.qq.com/?_wv=1027&k=KIKWmqys");
},
},
created() {
this.lang = lang().unlock.CHS;
console.log('临时语言系统加载完成');
console.log("临时语言系统加载完成");
this.init();
},
mounted() {
@ -191,26 +204,26 @@ export default {
// 如果 `pwd` 发生改变，就会清空错误状态
pwd: function () {
this.is_err = false;
this.err_msg = '';
this.err_msg = "";
},
// 如果 `repeat` 发生改变，就会清空错误状态
repeat: function () {
this.is_err = false;
this.err_msg = '';
this.err_msg = "";
},
// 如果 `drivce` 发生改变，就会清空错误状态
drivce: function () {
this.is_drivce_err = false;
this.drivce_err_msg = ''
}
this.drivce_err_msg = "";
},
},
beforeDestroy() {},
components: {}
components: {},
};
</script>
<style scoped lang="scss" type="text/scss">
@import '../../style/main';
@import "../../style/main";
.unlock {
width: 100%;
min-height: 100%;
@ -242,7 +255,7 @@ export default {
}
}
.tips {
font-size: .3rem;
font-size: 0.3rem;
max-width: 70%;
padding: 1rem 0;
color: #989898;

62
src/views/UpdateLog/UpdateLog.vue
View File

@ -3,7 +3,9 @@
<md-app md-waterfall md-mode="fixed">
<md-app-toolbar class="md-primary toolbar">
<div class="md-toolbar-section-start">
<md-button class="md-icon-button" @click="back()"><md-icon>arrow_back</md-icon></md-button>
<md-button class="md-icon-button" @click="back()">
<md-icon>arrow_back</md-icon>
</md-button>
<h3 class="md-title" style="flex: 1">{{ lang.title }}</h3>
</div>
</md-app-toolbar>
@ -12,7 +14,13 @@
<v-touch @swiperight="back()" :swipe-options="{ direction: 'horizontal' }">
<div ref="list_placeholder" style="height: 54px;"></div>
<md-steppers md-vertical>
<md-step v-for="(item, index) in lang.timeline" :key="index" :id="index.toString()" :md-label="item.label" :md-description="item.tag">
<md-step
v-for="(item, index) in lang.timeline"
:key="index"
:id="index.toString()"
:md-label="item.label"
:md-description="item.tag"
>
<p v-for="(content, content_index) in item.content" :key="content_index">{{ content }}</p>
</md-step>
</md-steppers>
@ -24,22 +32,22 @@
<script>
// @ is an alias to /src
import { mapState } from 'vuex';
import { lang } from '@/utils/language.js';
import { setHtmlFontSize } from '@/utils/px2rem.js';
import { mapState } from "vuex";
import { lang } from "@/utils/language.js";
import { setHtmlFontSize } from "@/utils/px2rem.js";
export default {
name: 'UpdateLog',
name: "UpdateLog",
data() {
return {
// 语言
lang: '',
lang: "",
// 页面高度
clientHeight: ''
clientHeight: "",
};
},
computed: {
...mapState(['row_pwd', 'settings'])
...mapState(["row_pwd", "settings"]),
},
methods: {
// 修改md-app的最小高度
@ -47,15 +55,25 @@ export default {
//动态修改样式
// console.log(clientHeight);
// window.document.getElementsByClassName('md-content')[0].style.minHeight = clientHeight + 'px';
this.$refs.list_placeholder.parentNode.parentNode.style.maxHeight = clientHeight + 'px';
this.$refs.list_placeholder.parentNode.style.minHeight = clientHeight - 32 + 'px';
window.document.documentElement.setAttribute('data-theme', this.settings.is_dark_mode ? 'dark' : 'light');
this.$refs.list_placeholder.parentNode.parentNode.style.maxHeight =
clientHeight + "px";
this.$refs.list_placeholder.parentNode.style.minHeight =
clientHeight - 32 + "px";
window.document.documentElement.setAttribute(
"data-theme",
this.settings.is_dark_mode ? "dark" : "light"
);
},
// 初始化
init() {
// 刷新vuex
this.$store.replaceState(Object.assign(this.$store.state, JSON.parse(localStorage.getItem('storeState'))));
this.$store.replaceState(
Object.assign(
this.$store.state,
JSON.parse(localStorage.getItem("storeState"))
)
);
// 判断有无用户密码
if (Object.keys(this.row_pwd).length != 0) {
// 有密码，已经输入过了
@ -66,11 +84,11 @@ export default {
this.initLanguage();
} else {
// 密码超时
this.turnToHome('密码超时');
this.turnToHome("密码超时");
}
} else {
// 没有密码
this.turnToHome('无密码');
this.turnToHome("无密码");
}
},
@ -81,7 +99,7 @@ export default {
} else {
this.lang = lang().update_log.EN;
}
console.log('语言配置完成');
console.log("语言配置完成");
},
//返回上一页
@ -92,12 +110,12 @@ export default {
// 强制返回Home
turnToHome(msg) {
console.log(msg);
this.$router.replace('/');
}
this.$router.replace("/");
},
},
created() {
this.lang = lang().update_log.CHS;
console.log('临时语言系统加载完成');
console.log("临时语言系统加载完成");
this.init();
},
mounted() {
@ -113,15 +131,15 @@ export default {
// 如果 `clientHeight` 发生改变，这个函数就会运行
clientHeight: function () {
this.changeFixed(this.clientHeight);
}
},
},
beforeDestroy() {},
components: {}
components: {},
};
</script>
<style scoped lang="scss" type="text/scss">
@import '../../style/main';
@import "../../style/main";
.account {
width: 100%;
min-height: 100%;