add created && add message && fix bugs
This commit is contained in:
parent
b55ef76b93
commit
de70141c3a
@ -1,7 +1,7 @@
|
||||
import axios from 'axios'
|
||||
|
||||
export const api = axios.create({
|
||||
// baseURL: 'https://yg.lacus.site/v1/user/',
|
||||
// baseURL: 'https://tracer.lacus.site/v1/user/',
|
||||
baseURL: window.location.origin + '/v1/user/',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
|
||||
@ -25,7 +25,7 @@ const routes = [
|
||||
name: 'Account',
|
||||
component: () => import(/* webpackChunkName: "account" */ '../views/Account/Account.vue'),
|
||||
meta: {
|
||||
keepAlive: true
|
||||
keepAlive: false
|
||||
},
|
||||
},
|
||||
{
|
||||
@ -35,6 +35,22 @@ const routes = [
|
||||
meta: {
|
||||
keepAlive: false
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/message',
|
||||
name: 'Message',
|
||||
component: () => import(/* webpackChunkName: "message" */ '../views/Message/Message.vue'),
|
||||
meta: {
|
||||
keepAlive: false
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/created',
|
||||
name: 'Created',
|
||||
component: () => import(/* webpackChunkName: "created" */ '../views/Created/Created.vue'),
|
||||
meta: {
|
||||
keepAlive: false
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '*', // 页面不存在的情况下会跳到home
|
||||
|
||||
@ -38,6 +38,7 @@
|
||||
placeholder="请输入您的教务密码"
|
||||
@focus="focus_list_2 = 1;focusOrBlur()"
|
||||
@blur="focus_list_2 = 0;focusOrBlur()"
|
||||
type="password"
|
||||
></md-input>
|
||||
</md-field>
|
||||
<md-button class="md-raised md-primary expand login-submit" @click="login()" :disabled="loading_switch">登录</md-button>
|
||||
@ -60,13 +61,13 @@
|
||||
<md-icon>edit</md-icon>
|
||||
</md-button>
|
||||
</md-list-item>
|
||||
<md-list-item>
|
||||
<md-list-item @click="turnToMsg">
|
||||
<span class="md-list-item-text">消息：{{user_info.msg.length}}条</span>
|
||||
<md-button class="md-icon-button md-list-action">
|
||||
<span>查看</span>
|
||||
</md-button>
|
||||
</md-list-item>
|
||||
<md-list-item>
|
||||
<md-list-item @click="turnToCreated">
|
||||
<span class="md-list-item-text">已发布：{{user_info.created.length}}条</span>
|
||||
<md-button class="md-icon-button md-list-action">
|
||||
<span>查看</span>
|
||||
@ -378,6 +379,24 @@ export default {
|
||||
this.nick = ""
|
||||
});
|
||||
},
|
||||
|
||||
// 跳转到消息
|
||||
turnToMsg() {
|
||||
if(this.user_info.msg.length == 0) {
|
||||
this.message('您没有消息')
|
||||
return
|
||||
}
|
||||
this.$router.push('/message')
|
||||
},
|
||||
|
||||
// 跳转到已发布
|
||||
turnToCreated() {
|
||||
if(this.user_info.created.length == 0) {
|
||||
this.message('您还未发布过')
|
||||
return
|
||||
}
|
||||
this.$router.push('/created')
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.init();
|
||||
@ -434,6 +453,7 @@ export default {
|
||||
.md-toolbar {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
z-index: 100 !important;
|
||||
}
|
||||
.md-toolbar-row {
|
||||
order: 12;
|
||||
|
||||
@ -33,14 +33,14 @@
|
||||
<span class="md-helper-text">譬如：水杯、手机等易于搜索的~</span>
|
||||
</md-field>
|
||||
<md-field style="margin-top:40px;">
|
||||
<label>描述</label>
|
||||
<label>详情</label>
|
||||
<md-textarea
|
||||
v-model="content"
|
||||
maxlength="100"
|
||||
@focus="focus_list_2 = 1;focusOrBlur()"
|
||||
@blur="focus_list_2 = 0;focusOrBlur()"
|
||||
></md-textarea>
|
||||
<span class="md-helper-text">描述一下它的特征之类的</span>
|
||||
<span class="md-helper-text">描述一下特征，丢失的时间之类的</span>
|
||||
</md-field>
|
||||
<md-field style="margin-top:40px;">
|
||||
<label for="total_addr">地区*</label>
|
||||
|
||||
269
src/views/Created/Created.vue
Normal file
269
src/views/Created/Created.vue
Normal file
@ -0,0 +1,269 @@
|
||||
<template>
|
||||
<div class="created" ref="created">
|
||||
<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="back" :disabled="loading_switch">
|
||||
<md-icon>arrow_back</md-icon>
|
||||
</md-button>
|
||||
<span class="md-title page-title">已发布 - {{user_info.created.length}}条</span>
|
||||
</div>
|
||||
</md-app-toolbar>
|
||||
<md-app-content>
|
||||
<v-touch @swiperight="back" :swipe-options="{ direction: 'horizontal' }">
|
||||
<div ref="list_placeholder" :style="`height:56px`"></div>
|
||||
<md-progress-bar
|
||||
v-if="loading_switch"
|
||||
md-mode="indeterminate"
|
||||
style="position: absolute; top: 56px; left: 0; width: 100%;"
|
||||
></md-progress-bar>
|
||||
<md-content
|
||||
v-for="(item, index) in user_info.created"
|
||||
:key="index"
|
||||
@click="turnToDetail(item.id)"
|
||||
>
|
||||
<md-card class="md-card-example">
|
||||
<md-card-area md-inset>
|
||||
<md-card-media md-ratio="16:9">
|
||||
<img :src="`https://tracer.lacus.site/photo/${item.img_url}`" />
|
||||
</md-card-media>
|
||||
|
||||
<md-card-header>
|
||||
<h2 class="md-subheading">{{item.title}}</h2>
|
||||
<div class="md-subhead">
|
||||
<md-icon>access_time</md-icon>
|
||||
<span>{{formatDateTime(item.create_time)}}</span>
|
||||
</div>
|
||||
<div class="md-subhead">
|
||||
<md-icon>location_on</md-icon>
|
||||
<span>{{item.total_addr}}</span>
|
||||
</div>
|
||||
</md-card-header>
|
||||
</md-card-area>
|
||||
</md-card>
|
||||
</md-content>
|
||||
|
||||
<md-dialog-confirm
|
||||
:md-active.sync="clear_confirm_switch"
|
||||
md-title="警告"
|
||||
md-content="您将清空所有消息</br>该操作不可复原，是否继续"
|
||||
md-confirm-text="继续"
|
||||
md-cancel-text="取消"
|
||||
:md-click-outside-to-close="false"
|
||||
@md-confirm="clearMsg"
|
||||
/>
|
||||
|
||||
<md-snackbar
|
||||
md-position="center"
|
||||
:md-active.sync="show_snackbar"
|
||||
md-persistent
|
||||
:md-duration="1500"
|
||||
>
|
||||
<span>{{ snakebar_msg }}</span>
|
||||
</md-snackbar>
|
||||
<div style="height: 40px;"></div>
|
||||
</v-touch>
|
||||
</md-app-content>
|
||||
</md-app>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// @ is an alias to /src
|
||||
import { mapState, mapActions } from "vuex";
|
||||
import { setHtmlFontSize } from "@/utils/px2rem.js";
|
||||
import { api } from "@/axios/fetch.js";
|
||||
import { formatDateTime } from "@/utils/formatTime.js";
|
||||
|
||||
export default {
|
||||
name: "Created",
|
||||
data() {
|
||||
return {
|
||||
// 显示高度，控制md-app的最小高度，防止抽屉高度塌陷
|
||||
clientHeight: "",
|
||||
// snackbar控制
|
||||
show_snackbar: false,
|
||||
snakebar_msg: "",
|
||||
// 加载控制
|
||||
loading_switch: false,
|
||||
// 清除确认弹窗控制
|
||||
clear_confirm_switch: false
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapState(["user_info", "settings", "bar_state"])
|
||||
},
|
||||
methods: {
|
||||
...mapActions(["setUserInfo", "setSettings", "setBarState"]),
|
||||
formatDateTime,
|
||||
// 修改md-app的最小高度
|
||||
changeFixed(clientHeight) {
|
||||
//动态修改样式
|
||||
this.$refs.created.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.setBarState([false, this]);
|
||||
// 无内容拦截
|
||||
if (this.user_info.created.length == 0) {
|
||||
this.back();
|
||||
}
|
||||
},
|
||||
|
||||
// 返回到主页
|
||||
back() {
|
||||
this.$router.replace("/account");
|
||||
},
|
||||
|
||||
// 调用snackBar
|
||||
message(msg) {
|
||||
this.snakebar_msg = msg;
|
||||
this.show_snackbar = true;
|
||||
},
|
||||
|
||||
// 跳转详情
|
||||
turnToDetail(id) {
|
||||
console.log(id);
|
||||
this.$router.push({ path: "/detail", query: { id: id } });
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.init();
|
||||
},
|
||||
mounted() {
|
||||
// 获取浏览器可视区域高度
|
||||
this.clientHeight = `${document.documentElement.clientHeight}`;
|
||||
//document.body.clientWidth;
|
||||
window.onresize = function temp() {
|
||||
this.clientHeight = `${document.documentElement.clientHeight}`;
|
||||
setHtmlFontSize();
|
||||
}.bind(this);
|
||||
this.$refs.list_placeholder.parentNode.parentNode.addEventListener(
|
||||
"scroll",
|
||||
this.scroll
|
||||
);
|
||||
},
|
||||
watch: {
|
||||
// 如果 `clientHeight` 发生改变，这个函数就会运行
|
||||
clientHeight: function() {
|
||||
this.changeFixed(this.clientHeight);
|
||||
}
|
||||
},
|
||||
beforeDestroy() {},
|
||||
components: {}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss" type="text/scss">
|
||||
@import "../../style/main";
|
||||
.created {
|
||||
width: 100%;
|
||||
// max-width: 500px;
|
||||
min-height: 100%;
|
||||
background: #fff;
|
||||
// margin: 0 auto;
|
||||
.expand {
|
||||
box-sizing: border-box;
|
||||
min-height: 0.8rem !important;
|
||||
margin: 0.5rem 16px !important;
|
||||
}
|
||||
.login-submit {
|
||||
width: 100%;
|
||||
margin: 0.5rem 0 !important;
|
||||
}
|
||||
.md-toolbar {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
}
|
||||
.md-toolbar-row {
|
||||
order: 12;
|
||||
// margin-bottom: .3rem !important;
|
||||
}
|
||||
.md-toolbar-section-start,
|
||||
.md-toolbar-section-end,
|
||||
.md-toolbar-row {
|
||||
min-height: 56px;
|
||||
}
|
||||
.md-toolbar-row {
|
||||
margin-top: -10px;
|
||||
}
|
||||
.md-speed-dial.md-bottom-right {
|
||||
position: fixed !important;
|
||||
}
|
||||
}
|
||||
// Demo purposes only
|
||||
.md-drawer {
|
||||
width: 240px;
|
||||
max-width: calc(100vw - 125px);
|
||||
}
|
||||
.md-app-scroller > div {
|
||||
overflow-y: scroll !important;
|
||||
}
|
||||
.face {
|
||||
color: #fff !important;
|
||||
}
|
||||
.page-title {
|
||||
flex: 1;
|
||||
min-height: 56px;
|
||||
line-height: 56px;
|
||||
}
|
||||
.sroll-top-area {
|
||||
flex: 1;
|
||||
min-height: 56px;
|
||||
}
|
||||
.md-bottom-bar.md-type-fixed .md-bottom-bar-item {
|
||||
max-width: 1000px !important;
|
||||
}
|
||||
.md-card-example {
|
||||
.md-subhead {
|
||||
margin-top: 0.1rem;
|
||||
.md-icon {
|
||||
$size: 16px;
|
||||
width: $size;
|
||||
min-width: $size;
|
||||
height: $size;
|
||||
font-size: $size !important;
|
||||
margin-right: 0.3rem;
|
||||
}
|
||||
|
||||
span {
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
}
|
||||
.md-app-content .md-card {
|
||||
margin: 0 !important;
|
||||
}
|
||||
.loading {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
height: 5rem;
|
||||
width: 5rem;
|
||||
margin-top: -2.5rem;
|
||||
margin-left: -2.5rem;
|
||||
}
|
||||
.md-list-item-text p {
|
||||
word-wrap: break-word !important;
|
||||
overflow: visible !important;
|
||||
white-space: normal !important;
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
</style>
|
||||
@ -40,7 +40,7 @@
|
||||
<md-card class="md-card-example" v-else>
|
||||
<md-card-area md-inset>
|
||||
<md-card-media>
|
||||
<img :src="`https://yg.canary.moe/photo/${content.img_url}`" />
|
||||
<img :src="`https://tracer.lacus.site/photo/${content.img_url}`" />
|
||||
</md-card-media>
|
||||
|
||||
<md-card-header>
|
||||
@ -57,9 +57,13 @@
|
||||
<md-icon>gps_fixed</md-icon>
|
||||
<span>{{content.detail_addr}}</span>
|
||||
</div>
|
||||
<div class="md-subhead" v-if="content.contact">
|
||||
<div class="md-subhead" v-if="content.contact"
|
||||
v-clipboard:copy="content.contact"
|
||||
v-clipboard:success="onCopyUrl"
|
||||
v-clipboard:error="onErrorUrl"
|
||||
>
|
||||
<md-icon>attach_file</md-icon>
|
||||
<span>{{content.contact}}</span>
|
||||
<span>{{content.contact}}(点击复制</span>
|
||||
</div>
|
||||
</md-card-header>
|
||||
<md-card-content>{{content.content}}</md-card-content>
|
||||
@ -217,7 +221,7 @@ export default {
|
||||
|
||||
// 返回到主页
|
||||
back() {
|
||||
this.$router.replace("/home");
|
||||
this.$router.go(-1);
|
||||
},
|
||||
|
||||
// 获取详细信息
|
||||
@ -356,6 +360,12 @@ export default {
|
||||
this.message("网络错误,请稍候重试");
|
||||
}
|
||||
});
|
||||
},
|
||||
onCopyUrl(e) {
|
||||
this.message("复制成功");
|
||||
},
|
||||
onErrorUrl(e) {
|
||||
this.message("复制失败");
|
||||
}
|
||||
},
|
||||
created() {
|
||||
|
||||
@ -62,7 +62,7 @@
|
||||
<md-card class="md-card-example">
|
||||
<md-card-area md-inset>
|
||||
<md-card-media md-ratio="16:9">
|
||||
<img :src="`https://yg.canary.moe/photo/${item.img_url}`" />
|
||||
<img :src="`https://tracer.lacus.site/photo/${item.img_url}`" />
|
||||
</md-card-media>
|
||||
|
||||
<md-card-header>
|
||||
@ -99,7 +99,7 @@
|
||||
<md-card class="md-card-example">
|
||||
<md-card-area md-inset>
|
||||
<md-card-media md-ratio="16:9">
|
||||
<img :src="`https://yg.canary.moe/photo/${item.img_url}`" />
|
||||
<img :src="`https://tracer.lacus.site/photo/${item.img_url}`" />
|
||||
</md-card-media>
|
||||
|
||||
<md-card-header>
|
||||
|
||||
340
src/views/Message/Message.vue
Normal file
340
src/views/Message/Message.vue
Normal file
@ -0,0 +1,340 @@
|
||||
<template>
|
||||
<div class="message" ref="message">
|
||||
<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="back" :disabled="loading_switch">
|
||||
<md-icon>arrow_back</md-icon>
|
||||
</md-button>
|
||||
<span class="md-title page-title">消息 - {{user_info.msg.length}}条</span>
|
||||
</div>
|
||||
<div class="md-toolbar-section-end">
|
||||
<md-button class="md-icon-button" @click="clear_confirm_switch = true">
|
||||
<md-icon>delete</md-icon>
|
||||
</md-button>
|
||||
</div>
|
||||
</md-app-toolbar>
|
||||
<md-app-content>
|
||||
<v-touch @swiperight="back" :swipe-options="{ direction: 'horizontal' }">
|
||||
<div ref="list_placeholder" :style="`height:56px`"></div>
|
||||
<md-progress-bar
|
||||
v-if="loading_switch"
|
||||
md-mode="indeterminate"
|
||||
style="position: absolute; top: 56px; left: 0; width: 100%;"
|
||||
></md-progress-bar>
|
||||
<md-card v-for="(msg, index) in msgs" :key="index">
|
||||
<md-card-header>
|
||||
<md-avatar>
|
||||
<md-icon :class="msg.color">{{msg.icon}}</md-icon>
|
||||
</md-avatar>
|
||||
|
||||
<div class="md-title" @click="turnToDetail(msg.id)">{{msg.title}}</div>
|
||||
<div class="md-subhead" @click="turnToDetail(msg.id)">{{msg.sub}}</div>
|
||||
</md-card-header>
|
||||
</md-card>
|
||||
|
||||
<md-dialog-confirm
|
||||
:md-active.sync="clear_confirm_switch"
|
||||
md-title="警告"
|
||||
md-content="您将清空所有消息</br>该操作不可复原，是否继续"
|
||||
md-confirm-text="继续"
|
||||
md-cancel-text="取消"
|
||||
:md-click-outside-to-close="false"
|
||||
@md-confirm="clearMsg"
|
||||
/>
|
||||
|
||||
<md-snackbar
|
||||
md-position="center"
|
||||
:md-active.sync="show_snackbar"
|
||||
md-persistent
|
||||
:md-duration="1500"
|
||||
>
|
||||
<span>{{ snakebar_msg }}</span>
|
||||
</md-snackbar>
|
||||
<div style="height: 40px;"></div>
|
||||
</v-touch>
|
||||
</md-app-content>
|
||||
</md-app>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// @ is an alias to /src
|
||||
import { mapState, mapActions } from "vuex";
|
||||
import { setHtmlFontSize } from "@/utils/px2rem.js";
|
||||
import { api } from "@/axios/fetch.js";
|
||||
|
||||
export default {
|
||||
name: "Message",
|
||||
data() {
|
||||
return {
|
||||
// 消息数据
|
||||
msgs: [],
|
||||
// 显示高度，控制md-app的最小高度，防止抽屉高度塌陷
|
||||
clientHeight: "",
|
||||
// snackbar控制
|
||||
show_snackbar: false,
|
||||
snakebar_msg: "",
|
||||
// 加载控制
|
||||
loading_switch: false,
|
||||
// 清除确认弹窗控制
|
||||
clear_confirm_switch: false
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapState(["user_info", "settings", "bar_state"])
|
||||
},
|
||||
methods: {
|
||||
...mapActions(["setUserInfo", "setSettings", "setBarState"]),
|
||||
// 修改md-app的最小高度
|
||||
changeFixed(clientHeight) {
|
||||
//动态修改样式
|
||||
this.$refs.message.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.setBarState([false, this]);
|
||||
// 无内容拦截
|
||||
if (this.user_info.msg.length == 0) {
|
||||
this.back();
|
||||
}
|
||||
console.log(this.user_info.msg);
|
||||
this.processMsg();
|
||||
},
|
||||
|
||||
// 返回到主页
|
||||
back() {
|
||||
this.$router.replace("/account");
|
||||
},
|
||||
|
||||
// 调用snackBar
|
||||
message(msg) {
|
||||
this.snakebar_msg = msg;
|
||||
this.show_snackbar = true;
|
||||
},
|
||||
|
||||
// 处理消息数据
|
||||
processMsg() {
|
||||
for (let msg of this.user_info.msg) {
|
||||
let content;
|
||||
switch (msg.type) {
|
||||
case "comment":
|
||||
// 评论
|
||||
content = {
|
||||
color: "",
|
||||
icon: "chat",
|
||||
title: "您有新的评论",
|
||||
sub: "点击查看",
|
||||
id: msg.id
|
||||
};
|
||||
this.msgs.push(content);
|
||||
break;
|
||||
case "reply":
|
||||
// 回复
|
||||
content = {
|
||||
color: "",
|
||||
icon: "textsms",
|
||||
title: "您有新的回复",
|
||||
sub: "点击查看",
|
||||
id: msg.id
|
||||
};
|
||||
this.msgs.push(content);
|
||||
break;
|
||||
case "pass":
|
||||
// 审核通过
|
||||
content = {
|
||||
color: "md-primary",
|
||||
icon: "beenhere",
|
||||
title: "您提交的失物招领已通过审核",
|
||||
sub: "点击查看",
|
||||
id: msg.id
|
||||
};
|
||||
this.msgs.push(content);
|
||||
break;
|
||||
case "veto":
|
||||
// 审核未通过
|
||||
content = {
|
||||
color: "md-accent",
|
||||
icon: "security",
|
||||
title: "您提交的失物招领未通过审核",
|
||||
sub: msg.reason,
|
||||
id: msg.id
|
||||
};
|
||||
this.msgs.push(content);
|
||||
break;
|
||||
}
|
||||
}
|
||||
},
|
||||
// 跳转详情
|
||||
turnToDetail(id) {
|
||||
console.log(id);
|
||||
this.$router.push({ path: "/detail", query: { id: id } });
|
||||
},
|
||||
// 清空消息
|
||||
clearMsg() {
|
||||
this.loading_switch = true;
|
||||
let data = {
|
||||
openid: this.user_info.openid
|
||||
};
|
||||
api
|
||||
.delete("/clear", { data })
|
||||
.then(res => {
|
||||
let user_info = this.user_info;
|
||||
user_info.msg = [];
|
||||
this.setUserInfo([user_info, this]);
|
||||
console.log("信息清空成功，用户信息覆写完成");
|
||||
this.message("清空成功");
|
||||
this.loading_switch = false;
|
||||
this.back();
|
||||
})
|
||||
.catch(err => {
|
||||
console.log(err);
|
||||
this.loading_switch = false;
|
||||
if (err.response && err.response.status != 500) {
|
||||
this.message(`${err.response.status}: ${err.response.data}`);
|
||||
} else {
|
||||
this.message("网络错误,请稍候重试");
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.init();
|
||||
},
|
||||
mounted() {
|
||||
// 获取浏览器可视区域高度
|
||||
this.clientHeight = `${document.documentElement.clientHeight}`;
|
||||
//document.body.clientWidth;
|
||||
window.onresize = function temp() {
|
||||
this.clientHeight = `${document.documentElement.clientHeight}`;
|
||||
setHtmlFontSize();
|
||||
}.bind(this);
|
||||
this.$refs.list_placeholder.parentNode.parentNode.addEventListener(
|
||||
"scroll",
|
||||
this.scroll
|
||||
);
|
||||
},
|
||||
watch: {
|
||||
// 如果 `clientHeight` 发生改变，这个函数就会运行
|
||||
clientHeight: function() {
|
||||
this.changeFixed(this.clientHeight);
|
||||
}
|
||||
},
|
||||
beforeDestroy() {},
|
||||
components: {}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss" type="text/scss">
|
||||
@import "../../style/main";
|
||||
.message {
|
||||
width: 100%;
|
||||
// max-width: 500px;
|
||||
min-height: 100%;
|
||||
background: #fff;
|
||||
// margin: 0 auto;
|
||||
.expand {
|
||||
box-sizing: border-box;
|
||||
min-height: 0.8rem !important;
|
||||
margin: 0.5rem 16px !important;
|
||||
}
|
||||
.login-submit {
|
||||
width: 100%;
|
||||
margin: 0.5rem 0 !important;
|
||||
}
|
||||
.md-toolbar {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
}
|
||||
.md-toolbar-row {
|
||||
order: 12;
|
||||
// margin-bottom: .3rem !important;
|
||||
}
|
||||
.md-toolbar-section-start,
|
||||
.md-toolbar-section-end,
|
||||
.md-toolbar-row {
|
||||
min-height: 56px;
|
||||
}
|
||||
.md-toolbar-row {
|
||||
margin-top: -10px;
|
||||
}
|
||||
.md-speed-dial.md-bottom-right {
|
||||
position: fixed !important;
|
||||
}
|
||||
}
|
||||
// Demo purposes only
|
||||
.md-drawer {
|
||||
width: 240px;
|
||||
max-width: calc(100vw - 125px);
|
||||
}
|
||||
.md-app-scroller > div {
|
||||
overflow-y: scroll !important;
|
||||
}
|
||||
.face {
|
||||
color: #fff !important;
|
||||
}
|
||||
.page-title {
|
||||
flex: 1;
|
||||
min-height: 56px;
|
||||
line-height: 56px;
|
||||
}
|
||||
.sroll-top-area {
|
||||
flex: 1;
|
||||
min-height: 56px;
|
||||
}
|
||||
.md-bottom-bar.md-type-fixed .md-bottom-bar-item {
|
||||
max-width: 1000px !important;
|
||||
}
|
||||
.md-card-example {
|
||||
.md-subhead {
|
||||
margin-top: 0.1rem;
|
||||
.md-icon {
|
||||
$size: 16px;
|
||||
width: $size;
|
||||
min-width: $size;
|
||||
height: $size;
|
||||
font-size: $size !important;
|
||||
margin-right: 0.3rem;
|
||||
}
|
||||
|
||||
span {
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
}
|
||||
.md-app-content .md-card {
|
||||
margin: 0 !important;
|
||||
}
|
||||
.loading {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
height: 5rem;
|
||||
width: 5rem;
|
||||
margin-top: -2.5rem;
|
||||
margin-left: -2.5rem;
|
||||
}
|
||||
.md-list-item-text p {
|
||||
word-wrap: break-word !important;
|
||||
overflow: visible !important;
|
||||
white-space: normal !important;
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
</style>
|
||||
Loading…
x
Reference in New Issue
Block a user