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

update persional

Browse Source
This commit is contained in:
RainSun 2020-10-18 15:40:21 +08:00
parent c54bee149b
commit d811be02bd
7 changed files with 325 additions and 155 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@ -16,7 +16,7 @@
"crypto-js": "^4.0.0", "crypto-js": "^4.0.0",
"element-ui": "^2.13.0", "element-ui": "^2.13.0",
"es6-promise": "^4.2.8", "es6-promise": "^4.2.8",
"lrz": "^4.9.40", "lrz": "^4.9.41",
"register-service-worker": "^1.6.2", "register-service-worker": "^1.6.2",
"url-search-params-polyfill": "^8.0.0", "url-search-params-polyfill": "^8.0.0",
"vue": "^2.6.10", "vue": "^2.6.10",

3
public/index.html
View File

@ -17,7 +17,7 @@
<!-- 描述 --> <!-- 描述 -->
<meta itemprop="description" content="为长理同学提供课表代理查询服务" /> <meta itemprop="description" content="为长理同学提供课表代理查询服务" />
<meta name="referrer" content="no-referrer"> <meta name="referrer" content="no-referrer">
<script> <script>
var _hmt = _hmt || []; var _hmt = _hmt || [];
(function () { (function () {
@ -27,6 +27,7 @@
s.parentNode.insertBefore(hm, s); s.parentNode.insertBefore(hm, s);
})(); })();
</script> </script>
<script> <script>
try { try {
console.log('%cInspire Studio Copyright \xa9 2019-%s', console.log('%cInspire Studio Copyright \xa9 2019-%s',

180
src/components/Drawer.vue
View File

@ -1,57 +1,99 @@
<template> <template>
<div class="drawer"> <div class="drawer">
<div class="mask" :class="mask_class" @click="closeDrawer()" v-if="drawer_state"> <div
<div class="w"> class="mask"
<!-- 抽屉主体 --> :class="mask_class"
<div class="main" :class="main_class" @click.stop> @click="closeDrawer()"
<div class="title"> v-if="drawer_state"
<div class="logo-box"> >
<img src="../assets/logo.png" alt /> <div class="w">
</div> <!-- 抽屉主体 -->
<p class="app-name">Cherry</p> <div
<p class="version">Version 3.5</p> class="main"
</div> :class="main_class"
<div class="list"> @click.stop
<!-- <div class="list-item"> >
<div class="title">
<div class="logo-box">
<img
src="../assets/logo.png"
alt
/>
</div>
<p class="app-name">Cherry</p>
<p class="version">Version 3.7</p>
</div>
<div class="list">
<!-- <div class="list-item">
<icon class="info" name="info"></icon> <icon class="info" name="info"></icon>
<p>账户设置</p> <p>账户设置</p>
</div> --> </div> -->
<div class="list-item" @click="goToGame()"> <div
<icon class="game" name="game"></icon> class="list-item"
<p>课表小游戏</p> @click="goToGame()"
</div> >
<div class="list-item" @click="goToCanary()"> <icon
<icon class="game" name="canary"></icon> class="game"
<p>Canary密码本</p> name="game"
</div> ></icon>
</div> <p>课表小游戏</p>
<div class="bottom-box" v-if="user_info"> </div>
<div class="logout-dialog to-show" v-if="dialog_state"> <div
<p class="label">警告</p> class="list-item"
<p class="content">该操作将清除您所有的个人信息，是否继续</p> @click="goToCanary()"
<div class="confirm-box"> >
<p class="cancel" @click="dialog_state = false">取消</p> <icon
<p class="confirm" @click="logout">继续</p> class="game"
</div> name="canary"
</div> ></icon>
<div class="bottom-button" @click="dialog_state = true"> <p>Canary密码本</p>
<icon class="logout" name="logout"></icon> </div>
<p>退出登录</p> </div>
</div> <div
</div> class="bottom-box"
</div> v-if="user_info"
</div> >
</div> <div
</div> class="logout-dialog to-show"
v-if="dialog_state"
>
<p class="label">警告</p>
<p class="content">该操作将清除您所有的个人信息，是否继续</p>
<div class="confirm-box">
<p
class="cancel"
@click="dialog_state = false"
>取消</p>
<p
class="confirm"
@click="logout"
>继续</p>
</div>
</div>
<div
class="bottom-button"
@click="dialog_state = true"
>
<icon
class="logout"
name="logout"
></icon>
<p>退出登录</p>
</div>
</div>
</div>
</div>
</div>
</div>
</template> </template>
<script> <script>
import { mapState, mapActions } from "vuex"; import { mapState, mapActions } from "vuex";
import { getGradeInitData } from '@/lib/utils.js' import { getGradeInitData } from '@/lib/utils.js'
import { replaceState } from '@/lib/getStore.js' import { replaceState } from '@/lib/getStore.js'
export default { export default {
name: "Drawer", name: "Drawer",
data() { data () {
return { return {
mask_class: '', mask_class: '',
main_class: '', main_class: '',
@ -59,50 +101,50 @@ export default {
} }
}, },
computed: { computed: {
...mapState(["drawer_state","user_info"]) ...mapState(["drawer_state", "user_info"])
}, },
methods: { methods: {
...mapActions(["setDrawerState","setUserInfo",'setGrade','setSchedule']), ...mapActions(["setDrawerState", "setUserInfo", 'setGrade', 'setSchedule']),
// 关闭抽屉 // 关闭抽屉
closeDrawer() { closeDrawer () {
this.dialog_state = false this.dialog_state = false
this.mask_class = 'to-shallow' this.mask_class = 'to-shallow'
this.main_class = 'to-left' this.main_class = 'to-left'
setTimeout(()=>{ setTimeout(() => {
this.setDrawerState([false, this]) this.setDrawerState([false, this])
}, 300) }, 300)
}, },
goToCanary() { goToCanary () {
window.open('https://canary.lacus.icu') window.open('https://canary.lacus.icu')
}, },
// 跳转到游戏 // 跳转到游戏
goToGame() { goToGame () {
this.setDrawerState([false, this]) this.setDrawerState([false, this])
this.$router.push('/game') this.$router.push('/game')
}, },
// 退出登录 // 退出登录
logout() { logout () {
localStorage.clear(); localStorage.clear();
replaceState.call(this); replaceState.call(this);
this.$router.replace('/login') this.$router.replace('/login')
}, },
}, },
created() { created () {
}, },
watch: { watch: {
drawer_state: function() { drawer_state: function () {
if(this.drawer_state) { if (this.drawer_state) {
// 展开 // 展开
this.mask_class = 'to-deep' this.mask_class = 'to-deep'
this.main_class = 'to-right' this.main_class = 'to-right'
} }
}, },
} }
}; };
</script> </script>
<style scoped lang="scss" type="text/scss"> <style scoped lang="scss" type="text/scss">
@import "../style/main"; @import "../style/main";
.drawer { .drawer {
.mask { .mask {
position: fixed; position: fixed;
@ -187,28 +229,30 @@ export default {
bottom: 0; bottom: 0;
left: 0; left: 0;
.logout-dialog { .logout-dialog {
margin: .5rem; margin: 0.5rem;
-moz-box-shadow:3px 4px 11px $home-card-boxshadow-color; -webkit-box-shadow:3px 4px 11px $home-card-boxshadow-color; box-shadow:3px 4px 11px $home-card-boxshadow-color; -moz-box-shadow: 3px 4px 11px $home-card-boxshadow-color;
border-radius: .1rem; -webkit-box-shadow: 3px 4px 11px $home-card-boxshadow-color;
padding: .3rem; box-shadow: 3px 4px 11px $home-card-boxshadow-color;
border-radius: 0.1rem;
padding: 0.3rem;
box-sizing: border-box; box-sizing: border-box;
border: 1px solid $home-card-border-color; border: 1px solid $home-card-border-color;
.label { .label {
font-size: .4rem; font-size: 0.4rem;
} }
.content { .content {
font-size: .3rem; font-size: 0.3rem;
margin-top: .3rem; margin-top: 0.3rem;
} }
.confirm-box { .confirm-box {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: flex-end; justify-content: flex-end;
font-size: .3rem; font-size: 0.3rem;
margin-top: .3rem; margin-top: 0.3rem;
.cancel { .cancel {
color: #989898; color: #989898;
margin-right: .3rem; margin-right: 0.3rem;
} }
.confirm { .confirm {
color: $red; color: $red;
@ -300,7 +344,7 @@ export default {
@keyframes toShow { @keyframes toShow {
0% { 0% {
opacity: .3; opacity: 0.3;
} }
100% { 100% {
opacity: 1; opacity: 1;

8
src/lib/getStore.js
View File

@ -1,5 +1,5 @@
// 刷新本页vuex // 刷新本页vuex
export function replaceState() { export function replaceState () {
let state = {} let state = {}
for (let key of Object.keys(this.$store.state)) { for (let key of Object.keys(this.$store.state)) {
let content = JSON.parse(localStorage.getItem("cherry_" + key)) let content = JSON.parse(localStorage.getItem("cherry_" + key))
@ -10,13 +10,13 @@ export function replaceState() {
// 隐藏周末 // 隐藏周末
hide_weekend: false, hide_weekend: false,
// 课表背景链接 // 课表背景链接
user_bg_url: '', user_bg_url: 'https://neko.lacus.site/v1/images/2020101722030968.jpg',
// 是否开启了背景 // 是否开启了背景
user_bg_switch: false, user_bg_switch: false,
// 课程透明度 // 课程透明度
lesson_opacity: 1, lesson_opacity: 0.8,
// 背景主题 // 背景主题
user_bg_is_dark: false, user_bg_is_dark: true,
// 课程以及节数的显示方式 无 衬底 阴影 => 0 1 2 // 课程以及节数的显示方式 无 衬底 阴影 => 0 1 2
bar_show_style: 0, bar_show_style: 0,
// 黑暗模式 // 黑暗模式

75
src/views/Login/Login.vue
View File

@ -7,32 +7,61 @@
</div> </div>
<!-- <header><i class="el-icon-back" @click="turnToHome()"></i></header> --> <!-- <header><i class="el-icon-back" @click="turnToHome()"></i></header> -->
<div class="logo-box"> <div class="logo-box">
<img src="../../assets/logo.png" alt class="logo" /> <img
src="../../assets/logo.png"
alt
class="logo"
/>
</div> </div>
<div class="login-box"> <div class="login-box">
<div class="title">登录</div> <div class="title">登录</div>
<div class="label">教务账号*</div> <div class="label">教务账号*</div>
<input type="text" name="cid" v-model.trim="cid" /> <input
<div class="tips">由于教务问题20级同学还无法使用，请在此直接输入2020，点击登录即可体验</div> type="text"
name="cid"
v-model.trim="cid"
/>
<!-- <div class="tips">由于教务问题20级同学还无法使用，请在此直接输入2020，点击登录即可体验</div> -->
<div class="label">教务密码*</div> <div class="label">教务密码*</div>
<input type="password" name="pwd" v-model.trim="pwd" /> <input
type="password"
name="pwd"
v-model.trim="pwd"
/>
<div class="label">手机号码(非必填，仅在登录失败时更新教务)</div> <div class="label">手机号码(非必填，仅在登录失败时更新教务)</div>
<input type="password" name="phone" v-model.trim="phone" /> <input
type="password"
name="phone"
v-model.trim="phone"
/>
</div> </div>
<div class="submit-box"> <div class="submit-box">
<div class="submit" @click="submit()">登录</div> <div
class="submit"
@click="submit()"
>登录</div>
</div> </div>
<div class="copyRight"> <div class="copyRight">
<p>Version&nbsp;3.5</p> <p>Version&nbsp;3.7</p>
<p>Inspire Studio</p> <p>RainSun & LollipopKit</p>
<p>&copy;2020 All Rights Reserved.</p> <p>&copy;2020 All Rights Reserved.</p>
</div> </div>
<FooterSpace></FooterSpace> <FooterSpace></FooterSpace>
<el-dialog title="服务器开小差了" :visible.sync="net_error_dialog" width="90%"> <el-dialog
title="服务器开小差了"
:visible.sync="net_error_dialog"
width="90%"
>
<span>{{net_error_dialog_content}}</span> <span>{{net_error_dialog_content}}</span>
<span slot="footer" class="dialog-footer"> <span
slot="footer"
class="dialog-footer"
>
<el-button @click="net_error_dialog = false">狠心拒绝</el-button> <el-button @click="net_error_dialog = false">狠心拒绝</el-button>
<el-button type="primary" @click="openQQ()">欣然接受</el-button> <el-button
type="primary"
@click="openQQ()"
>欣然接受</el-button>
</span> </span>
</el-dialog> </el-dialog>
</div> </div>
@ -51,7 +80,7 @@ import { test_info } from "@/lib/testInfo.js";
export default { export default {
name: "login", name: "login",
data() { data () {
return { return {
cid: "", cid: "",
pwd: "", pwd: "",
@ -74,7 +103,7 @@ export default {
"setPersonalClass" "setPersonalClass"
]), ]),
// 初始化 // 初始化
init() { init () {
// 刷新本页vuex // 刷新本页vuex
replaceState.call(this); replaceState.call(this);
// 设置footerNav // 设置footerNav
@ -82,7 +111,7 @@ export default {
}, },
// 用户点击rushB // 用户点击rushB
submit() { submit () {
if (this.cid == '2020') { if (this.cid == '2020') {
let load = Loading.service({ let load = Loading.service({
background: "rgba(236,245,255,.7)", background: "rgba(236,245,255,.7)",
@ -135,7 +164,7 @@ export default {
}, },
// 处理服务器返回的数据 // 处理服务器返回的数据
manageRes(data, load) { manageRes (data, load) {
// 登录成功 // 登录成功
let user_info = { let user_info = {
login_time: new Date().getTime(), login_time: new Date().getTime(),
@ -165,7 +194,7 @@ export default {
}, },
// 刷新课表 // 刷新课表
refreshSchedule() { refreshSchedule () {
// 获取源课表 // 获取源课表
let row_lesson_info = JSON.parse(JSON.stringify(this.row_lesson_info)); let row_lesson_info = JSON.parse(JSON.stringify(this.row_lesson_info));
if (!row_lesson_info) { if (!row_lesson_info) {
@ -204,20 +233,20 @@ export default {
}, },
// 强制跳转回主页 // 强制跳转回主页
turnToHome() { turnToHome () {
this.$router.replace({ path: "/", query: { from_login: true } }); this.$router.replace({ path: "/", query: { from_login: true } });
}, },
// 打开qq群链接 // 打开qq群链接
openQQ() { openQQ () {
window.open("https://jq.qq.com/?_wv=1027&k=5Jeoz9R"); window.open("https://jq.qq.com/?_wv=1027&k=5Jeoz9R");
} }
}, },
created() { created () {
this.init(); this.init();
}, },
mounted() {}, mounted () { },
activated() {}, activated () { },
components: { components: {
FooterSpace FooterSpace
} }
@ -295,7 +324,7 @@ export default {
} }
.login-box { .login-box {
width: 85%; width: 85%;
height: 9.5rem; height: 8.5rem;
background: #fff; background: #fff;
margin: 0 auto; margin: 0 auto;
margin-top: -1rem; margin-top: -1rem;
@ -319,7 +348,7 @@ export default {
} }
.tips { .tips {
font-size: 0.3rem; font-size: 0.3rem;
margin: .2rem 0; margin: 0.2rem 0;
color: #f86b55; color: #f86b55;
} }
input { input {

89
src/views/MyAccount/MyAccount.vue
View File

@ -1,15 +1,25 @@
<template> <template>
<div class="myaccount"> <div class="myaccount">
<header> <header>
<img src="../../assets/logo_nobg.png" alt="logo" /> <img
src="../../assets/logo_nobg.png"
alt="logo"
/>
<p> <p>
Cherry Cherry
<span>v3.5</span> <span>v3.7</span>
</p> </p>
<div class="auth">By:Inspire Studio</div> <div class="auth">By:Inspire Studio</div>
<img src="../../assets/wave.gif" mode="scaleToFill" class="gif-wave"/> <img
src="../../assets/wave.gif"
mode="scaleToFill"
class="gif-wave"
/>
</header> </header>
<div class="user-box shadow-warp" v-if="Object.keys(this.user_info).length != 0"> <div
class="user-box shadow-warp"
v-if="Object.keys(this.user_info).length != 0"
>
<div class="cid-box"> <div class="cid-box">
<div class="cid">{{user_info.id}}</div> <div class="cid">{{user_info.id}}</div>
<div class="label"> <div class="label">
@ -25,14 +35,25 @@
</div> </div>
</div> </div>
<div class="functions-box"> <div class="functions-box">
<div class="item" @click="goTo('/personal')"> <div
class="item"
@click="goTo('/personal')"
>
<i class="el-icon-s-operation first-function-icon"></i> <i class="el-icon-s-operation first-function-icon"></i>
<p>个性化</p> <p>个性化</p>
<i class="el-icon-arrow-right arrow-right"></i> <i class="el-icon-arrow-right arrow-right"></i>
</div> </div>
</div> </div>
<div class="logout" @click="logout()" v-if="Object.keys(this.user_info).length != 0">退出登录</div> <div
<div class="logout" @click="goTo('/login')" v-else>立即登录</div> class="logout"
@click="logout()"
v-if="Object.keys(this.user_info).length != 0"
>退出登录</div>
<div
class="logout"
@click="goTo('/login')"
v-else
>立即登录</div>
<div class="qq"> <div class="qq">
反馈及获取最新功能=> 反馈及获取最新功能=>
<span @click="openQQ()">1030523678</span> <span @click="openQQ()">1030523678</span>
@ -60,7 +81,7 @@ import { loginInterceptor } from "@/lib/utils.js";
import { replaceState } from '@/lib/getStore.js' import { replaceState } from '@/lib/getStore.js'
export default { export default {
name: "myaccount", name: "myaccount",
data() { data () {
return { return {
web_addr: "https://cherry.lacus.site" web_addr: "https://cherry.lacus.site"
}; };
@ -70,13 +91,13 @@ export default {
}, },
methods: { methods: {
...mapActions(["setCurrentPage"]), ...mapActions(["setCurrentPage"]),
init() { init () {
// 刷新本页vuex // 刷新本页vuex
replaceState.call(this) replaceState.call(this)
this.setCurrentPage(["myaccount", this]); this.setCurrentPage(["myaccount", this]);
}, },
// 登出 // 登出
logout() { logout () {
localStorage.clear(); localStorage.clear();
replaceState.call(this); replaceState.call(this);
this.$message({ this.$message({
@ -86,24 +107,24 @@ export default {
this.$router.replace("/login"); this.$router.replace("/login");
}, },
// 打开qq群链接 // 打开qq群链接
openQQ() { openQQ () {
window.open("https://jq.qq.com/?_wv=1027&k=5Jeoz9R"); window.open("https://jq.qq.com/?_wv=1027&k=5Jeoz9R");
}, },
goTo(url) { goTo (url) {
this.$router.push(url); this.$router.push(url);
}, },
onCopyUrl(e) { onCopyUrl (e) {
this.$message.success("复制成功！"); this.$message.success("复制成功！");
}, },
onErrorUrl(e) { onErrorUrl (e) {
this.$message.success("复制失败！"); this.$message.success("复制失败！");
} }
}, },
created() {}, created () { },
mounted() { mounted () {
this.init(); this.init();
}, },
activated() { activated () {
this.init(); this.init();
}, },
components: { components: {
@ -150,15 +171,15 @@ export default {
font-size: 0.5rem; font-size: 0.5rem;
margin-top: 0.3rem; margin-top: 0.3rem;
font-weight: 300; font-weight: 300;
margin-bottom: 1rem; margin-bottom: 1rem;
}
.gif-wave {
position: absolute;
bottom: 0;
mix-blend-mode: screen;
height: 2rem;
width: 100%;
} }
.gif-wave {
position: absolute;
bottom: 0;
mix-blend-mode: screen;
height: 2rem;
width: 100%;
}
} }
.user-box { .user-box {
@ -206,9 +227,9 @@ export default {
} }
.functions-box { .functions-box {
width: 80%; width: 80%;
margin: .5rem auto; margin: 0.5rem auto;
background: #fff; background: #fff;
border-radius: .2rem; border-radius: 0.2rem;
color: #999; color: #999;
.item { .item {
display: flex; display: flex;
@ -216,19 +237,19 @@ export default {
align-items: center; align-items: center;
height: 1rem; height: 1rem;
.first-function-icon { .first-function-icon {
font-size:.5rem; font-size: 0.5rem;
margin-left: .3rem; margin-left: 0.3rem;
} }
p { p {
font-size: .35rem; font-size: 0.35rem;
margin-left: .3rem; margin-left: 0.3rem;
} }
.arrow-right { .arrow-right {
position: absolute; position: absolute;
right: .3rem; right: 0.3rem;
font-size: .5rem; font-size: 0.5rem;
} }
} }
} }
.logout { .logout {
background-image: $gradualGreen; background-image: $gradualGreen;

123
src/views/Personal/Personal.vue
View File

@ -3,7 +3,10 @@
<header> <header>
<div class="w"> <div class="w">
<div class="icon-box"> <div class="icon-box">
<i class="el-icon-back title-icon" @click="back()"></i> <i
class="el-icon-back title-icon"
@click="back()"
></i>
</div> </div>
<div class="title-box">个性化</div> <div class="title-box">个性化</div>
</div> </div>
@ -12,35 +15,50 @@
<div class="main"> <div class="main">
<div class="topic">课表设置</div> <div class="topic">课表设置</div>
<div class="option"> <div class="option">
<icon name="firstPrize" class="option-icon"></icon> <!-- <icon name="firstPrize" class="option-icon"></icon> -->
<div class="label">隐藏周末</div> <div class="label">隐藏周末</div>
<div class="handle-space"> <div class="handle-space">
<el-switch v-model="hide_weekend" active-color="#39b54a" @change="modifyConfig()"></el-switch> <el-switch
v-model="hide_weekend"
active-color="#39b54a"
@change="modifyConfig()"
></el-switch>
</div> </div>
</div> </div>
<div class="option"> <div class="option">
<icon name="firstPrize" class="option-icon"></icon> <!-- <icon name="firstPrize" class="option-icon"></icon> -->
<div class="label">开启背景图</div> <div class="label">开启背景图</div>
<div class="handle-space"> <div class="handle-space">
<el-switch v-model="user_bg_switch" active-color="#39b54a" @change="modifyConfig()"></el-switch> <el-switch
v-model="user_bg_switch"
active-color="#39b54a"
@change="modifyConfig()"
></el-switch>
</div> </div>
</div> </div>
<div class="option"> <div class="option">
<icon name="firstPrize" class="option-icon"></icon> <!-- <icon name="firstPrize" class="option-icon"></icon> -->
<div class="label">深色背景适配</div> <div class="label">深色背景适配</div>
<div class="handle-space"> <div class="handle-space">
<el-switch v-model="user_bg_is_dark" active-color="#39b54a" @change="modifyConfig()"></el-switch> <el-switch
v-model="user_bg_is_dark"
active-color="#39b54a"
@change="modifyConfig()"
></el-switch>
</div> </div>
</div> </div>
<div class="option"> <div class="option">
<icon name="firstPrize" class="option-icon"></icon> <!-- <icon name="firstPrize" class="option-icon"></icon> -->
<div class="label">课表透明度</div> <div class="label">课表透明度</div>
<div class="handle-space"> <div class="handle-space">
<Slider :value="settings.lesson_opacity" @change="modifyOpacity"></Slider> <Slider
:value="settings.lesson_opacity"
@change="modifyOpacity"
></Slider>
</div> </div>
</div> </div>
<div class="option"> <div class="option">
<icon name="firstPrize" class="option-icon"></icon> <!-- <icon name="firstPrize" class="option-icon"></icon> -->
<Select <Select
label="时间显示类型" label="时间显示类型"
:options="bar_show_style_list" :options="bar_show_style_list"
@ -50,17 +68,43 @@
</div> </div>
<div class="option"> <div class="option">
<icon name="firstPrize" class="option-icon"></icon> <!-- <icon name="firstPrize" class="option-icon"></icon> -->
<Input label="图片网络地址" :value="settings.user_bg_url" @change="modifyUserBgUrl" /> <Input
label="图片网络地址"
:value="settings.user_bg_url"
@change="modifyUserBgUrl"
/>
</div> </div>
<!-- <div
class="option"
@click="clickFile"
>
<div class="img-box">
<icon
name='camera_green'
class="img-box-icon"
/>
</div>
<input
type="file"
style="display: none;"
accept="image/*"
@change="processFile"
id="file"
>
</div> -->
<div class="topic">应用设置</div> <div class="topic">应用设置</div>
<div class="option"> <div class="option">
<icon name="firstPrize" class="option-icon"></icon> <!-- <icon name="firstPrize" class="option-icon"></icon> -->
<div class="label">关闭TAB文字</div> <div class="label">关闭TAB文字</div>
<div class="handle-space"> <div class="handle-space">
<el-switch v-model="hide_tab_text" active-color="#39b54a" @change="modifyConfig()"></el-switch> <el-switch
v-model="hide_tab_text"
active-color="#39b54a"
@change="modifyConfig()"
></el-switch>
</div> </div>
</div> </div>
</div> </div>
@ -79,10 +123,11 @@ import { mapState, mapActions } from "vuex";
import { replaceState } from "@/lib/getStore.js"; import { replaceState } from "@/lib/getStore.js";
import { Loading } from "element-ui"; import { Loading } from "element-ui";
import { interceptTime } from "@/lib/utils.js"; import { interceptTime } from "@/lib/utils.js";
import lrz from "lrz";
export default { export default {
name: "personal", name: "personal",
data() { data () {
return { return {
// 隐藏周末 // 隐藏周末
hide_weekend: false, hide_weekend: false,
@ -110,6 +155,7 @@ export default {
], ],
// 黑暗模式 // 黑暗模式
dark_mode: false, dark_mode: false,
lrz_file: null,
}; };
}, },
computed: { computed: {
@ -118,7 +164,7 @@ export default {
methods: { methods: {
...mapActions(["setUserInfo", "setCurrentPage", "setSettings"]), ...mapActions(["setUserInfo", "setCurrentPage", "setSettings"]),
// 初始化课表 // 初始化课表
init() { init () {
// 刷新本页vuex // 刷新本页vuex
replaceState.call(this); replaceState.call(this);
// 设置footerNav // 设置footerNav
@ -146,7 +192,7 @@ export default {
this.$router.replace("/login"); this.$router.replace("/login");
}, },
initData() { initData () {
this.hide_weekend = this.settings.hide_weekend; this.hide_weekend = this.settings.hide_weekend;
this.user_bg_switch = this.settings.user_bg_switch; this.user_bg_switch = this.settings.user_bg_switch;
this.user_bg_is_dark = this.settings.user_bg_is_dark; this.user_bg_is_dark = this.settings.user_bg_is_dark;
@ -154,11 +200,11 @@ export default {
this.hide_tab_text = this.settings.hide_tab_text; this.hide_tab_text = this.settings.hide_tab_text;
}, },
back() { back () {
this.$router.go(-1); this.$router.go(-1);
}, },
modifyConfig() { modifyConfig () {
let new_settings = { let new_settings = {
...this.settings, ...this.settings,
hide_weekend: this.hide_weekend, hide_weekend: this.hide_weekend,
@ -171,7 +217,7 @@ export default {
this.$snakebar('个性化设置成功') this.$snakebar('个性化设置成功')
}, },
modifyOpacity(e) { modifyOpacity (e) {
let new_settings = { let new_settings = {
...this.settings, ...this.settings,
lesson_opacity: Number(e), lesson_opacity: Number(e),
@ -181,7 +227,7 @@ export default {
this.$snakebar('个性化设置成功') this.$snakebar('个性化设置成功')
}, },
modifyBarShowStyle(e) { modifyBarShowStyle (e) {
let new_settings = { let new_settings = {
...this.settings, ...this.settings,
bar_show_style: Number(e), bar_show_style: Number(e),
@ -191,7 +237,7 @@ export default {
this.$snakebar('个性化设置成功') this.$snakebar('个性化设置成功')
}, },
modifyUserBgUrl(e) { modifyUserBgUrl (e) {
let new_settings = { let new_settings = {
...this.settings, ...this.settings,
user_bg_url: e, user_bg_url: e,
@ -200,8 +246,24 @@ export default {
console.log("设置信息写入完成"); console.log("设置信息写入完成");
this.$snakebar('个性化设置成功') this.$snakebar('个性化设置成功')
}, },
clickFile () {
document.getElementById("file").click();
},
// 处理图片文件
processFile: async function (e) {
let file = e.target.files[0];
if (!file) return;
let name = file.name;
console.log("文件压缩开始");
file = await lrz(file);
file = file.file;
file = new File([file], name);
this.lrz_file = file
console.log("文件压缩完成", file);
},
}, },
created() { created () {
this.init(); this.init();
}, },
components: { components: {
@ -264,7 +326,7 @@ export default {
max-width: 425px; max-width: 425px;
margin: 0 0.7rem; margin: 0 0.7rem;
.topic { .topic {
margin-top: .5rem; margin-top: 0.5rem;
font-size: 0.35rem; font-size: 0.35rem;
color: $green; color: $green;
margin-bottom: 0.5rem; margin-bottom: 0.5rem;
@ -289,6 +351,19 @@ export default {
align-items: center; align-items: center;
justify-content: flex-end; justify-content: flex-end;
} }
.img-box {
margin-top: 0.5rem;
height: 1.5rem;
width: 1.5rem;
border: 2px #67c23a solid;
display: flex;
align-items: center;
justify-content: center;
.img-box-icon {
height: 0.7rem;
width: 0.7rem;
}
}
} }
} }
} }