update
This commit is contained in:
parent
fde3e77bb5
commit
31a770ebe4
@ -35,7 +35,7 @@
|
||||
<div class="MyPopover" slot="content">
|
||||
<span v-if="UrlObj.name" style="font-size:12px !important;">【{{ UrlObj.name }}】手机二维码</span><br/><br/>
|
||||
<div style="width:100% ;text-align: center"><img style="width:150px"
|
||||
:src="getQR(UrlId,UrlObj.icon)"></div>
|
||||
:src="getNavQR(this.$route.query.uid)"></div>
|
||||
</div>
|
||||
<i class="el-icon-picture" id="little-Circle-content"
|
||||
style="font-weight:550; padding:5px;font-size:15px!important;margin-top:5px">手机查看</i>
|
||||
@ -195,9 +195,7 @@ export default {
|
||||
mounted() {
|
||||
|
||||
// this.GetAllComment();
|
||||
if(this.UrlId && this.UrlObj.icon){
|
||||
this.getQR(this.UrlId, this.UrlObj.icon);
|
||||
}
|
||||
|
||||
|
||||
|
||||
},
|
||||
@ -237,11 +235,11 @@ export default {
|
||||
}).then(function (res) {
|
||||
_this.allcomment = res.data;
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
},
|
||||
// 日访问：
|
||||
@ -260,22 +258,21 @@ export default {
|
||||
_this.initEchart(_this.xTime,_this.YView);
|
||||
}
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
},
|
||||
// 获取二维码：
|
||||
getQR(url_id, icon_url) {
|
||||
getNavQR(url_id) {
|
||||
let _this = this;
|
||||
axios({
|
||||
method: 'post',
|
||||
url: '/api/qrcode/qrc_return',
|
||||
data: {
|
||||
params: {
|
||||
url_id: url_id,
|
||||
icon_url: icon_url
|
||||
}
|
||||
}).then(function (res) {
|
||||
if (res.data) {
|
||||
@ -284,11 +281,11 @@ export default {
|
||||
|
||||
return false;
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error === null ? '' : error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error === null ? '' : error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
return this.imageCode
|
||||
},
|
||||
@ -404,18 +401,18 @@ export default {
|
||||
that.UrlObj = res.data.data;
|
||||
that.UnDate = that.UrlObj.createtime;
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error === null ? '' : error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error === null ? '' : error,
|
||||
// offset: 0
|
||||
// });
|
||||
});
|
||||
this.getFormatDate();
|
||||
},
|
||||
// 向管理员反馈
|
||||
WarnToAdmin() {
|
||||
// this.GetAllComment();
|
||||
console.log(this.allcomment);
|
||||
// console.log(this.allcomment);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -480,11 +480,11 @@ export default {
|
||||
}
|
||||
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error === null ? '' : error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error === null ? '' : error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
} else {
|
||||
Vue.prototype.$notify.error({
|
||||
@ -513,11 +513,11 @@ export default {
|
||||
offset: 0
|
||||
});
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
} else {
|
||||
Vue.prototype.$notify.error({
|
||||
@ -564,11 +564,11 @@ export default {
|
||||
}
|
||||
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
} else {
|
||||
Vue.prototype.$notify.error({
|
||||
@ -620,11 +620,11 @@ export default {
|
||||
}, 1000);
|
||||
}
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
|
||||
} else {
|
||||
@ -666,11 +666,11 @@ export default {
|
||||
}, 1000);
|
||||
}
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
|
||||
} else {
|
||||
|
||||
@ -81,16 +81,21 @@ export default {
|
||||
}
|
||||
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
},
|
||||
|
||||
getPath() {
|
||||
if(this.$route.query.name){
|
||||
document.querySelector(this.$route.query.name).scrollIntoView(true)
|
||||
}else{
|
||||
return false;
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
// 获取导航详情列表
|
||||
@ -107,11 +112,11 @@ export default {
|
||||
_this.loading=true;
|
||||
}
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error === null ? '' : error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error === null ? '' : error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
|
||||
},
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="app-card" @click="goToNavDetail">
|
||||
<div style="display: flex;flex-direction: row;align-items: center">
|
||||
<div class="app-card" >
|
||||
<div style="display: flex;flex-direction: row;align-items: center" @click="goToNavDetail">
|
||||
<el-image v-if="nav.icon" :src="nav.icon" style="width: 30px;height: 30px"></el-image>
|
||||
<div class="content-card">
|
||||
|
||||
@ -22,17 +22,29 @@
|
||||
<i v-show="nav.isNeedAgent===1" style="color: red" class="qr el-icon-info"></i>
|
||||
</el-tooltip>
|
||||
<!-- <button class="content-button status-button"><i class="el-icon-d-arrow-right"></i>详情</button>-->
|
||||
<el-tooltip placement="bottom" width="150"
|
||||
trigger="hover"
|
||||
effect="dark" close-delay="2000">
|
||||
|
||||
<div class="MyPopover" slot="content">
|
||||
<span style="font-size:12px !important;">【{{ nav.name }}】手机二维码</span><br/><br/>
|
||||
<div style="width:100% ;text-align: center"><img v-if="nav.urlId && nav.icon" style="width:150px"
|
||||
:src="getQR(nav.urlId,nav.icon)"/>
|
||||
<!-- <span style="font-size:12px !important;">【{{ nav.name }}】手机二维码</span><br/><br/>-->
|
||||
<!-- <div style="width:100% ;text-align: center"><img v-if="nav.urlId" style="width:150px"-->
|
||||
<!-- :src="getQR(nav.urlId)"/>-->
|
||||
<!-- </div>-->
|
||||
</div>
|
||||
<i @click="openShowQR(nav.urlId)" class="qr el-icon-s-grid"></i>
|
||||
<el-dialog
|
||||
:title="'【'+nav.name+'】'+'手机二维码'"
|
||||
:visible.sync="dialogVisible"
|
||||
:show-close="true"
|
||||
append-to-body
|
||||
center
|
||||
width="25%"
|
||||
:before-close="handleClose">
|
||||
|
||||
|
||||
<div style="width:100% ;text-align: center">
|
||||
<img v-if="imageCode!==''" style="width:250px" :src="imageCode"/>
|
||||
</div>
|
||||
<i class="qr el-icon-s-grid"></i>
|
||||
</el-tooltip>
|
||||
|
||||
</el-dialog>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@ -49,6 +61,7 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
imageCode: '',
|
||||
dialogVisible:false,
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
@ -59,29 +72,35 @@ export default {
|
||||
},
|
||||
computed: {},
|
||||
methods: {
|
||||
getQR(url_id, icon_url) {
|
||||
handleClose(){
|
||||
this.dialogVisible=false;
|
||||
},
|
||||
openShowQR(id){
|
||||
this.dialogVisible=true;
|
||||
this.getQR(id);
|
||||
},
|
||||
getQR(url_id) {
|
||||
let _this = this;
|
||||
if(url_id && icon_url){
|
||||
if(url_id){
|
||||
axios({
|
||||
method: 'post',
|
||||
url: '/api/qrcode/qrc_return',
|
||||
data: {
|
||||
params: {
|
||||
url_id: url_id,
|
||||
icon_url: icon_url
|
||||
}
|
||||
}).then(function (res) {
|
||||
if (res.data) {
|
||||
if (res.data!==''){
|
||||
_this.imageCode = "data:image/jpg;base64," + res.data;
|
||||
}
|
||||
return false;
|
||||
|
||||
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error === null ? '' : error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error === null ? '' : error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
return this.imageCode
|
||||
}else{
|
||||
return false
|
||||
}
|
||||
|
||||
@ -2,12 +2,47 @@
|
||||
<div class="wrapper">
|
||||
<LeftSide :category="category"></LeftSide>
|
||||
<div class="main">
|
||||
<NewsCard id="百度热搜榜" :loading="loading" :news="baidu"></NewsCard>
|
||||
<NewsCard id="抖音热搜榜" :loading="loading" :news="douying"></NewsCard>
|
||||
<NewsCard id="微博热搜榜" :loading="loading" :news="weibo"></NewsCard>
|
||||
<NewsCard id="知乎热搜榜" :loading="loading" :news="zhihu"></NewsCard>
|
||||
<NewsCard id="哔哩哔哩热搜榜" :loading="loading" :news="bili"></NewsCard>
|
||||
<NewsCard id="今日头条热搜榜" :loading="loading" :news="toutiao"></NewsCard>
|
||||
|
||||
<div class="widget">
|
||||
<NewsCard id="百度热搜榜" :loading="loading1" :news="baidu"></NewsCard>
|
||||
<div style="text-align: end;margin-right: 10px">
|
||||
<i class="refresh el-icon-refresh" @click="refresh1"></i>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="widget">
|
||||
<NewsCard id="抖音热搜榜" :loading="loading2" :news="douying"></NewsCard>
|
||||
<div style="text-align: end;margin-right: 10px">
|
||||
<i class="refresh el-icon-refresh" @click="refresh2"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="widget">
|
||||
<NewsCard id="微博热搜榜" :loading="loading3" :news="weibo"></NewsCard>
|
||||
<div style="text-align: end;margin-right: 10px">
|
||||
<i class="refresh el-icon-refresh" @click="refresh3"></i>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="widget">
|
||||
<NewsCard id="知乎热搜榜" :loading="loading4" :news="zhihu"></NewsCard>
|
||||
<div style="text-align: end;margin-right: 10px">
|
||||
<i class="refresh el-icon-refresh" @click="refresh4"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="widget">
|
||||
<NewsCard id="哔哩哔哩热搜榜" :loading="loading5" :news="bili"></NewsCard>
|
||||
<!-- <NewsCard id="今日头条热搜榜" :loading="loading" :news="toutiao"></NewsCard>-->
|
||||
<div style="text-align: end;margin-right: 10px">
|
||||
<i class="refresh el-icon-refresh" @click="refresh5"></i>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="widget">
|
||||
<NewsCard id="今日头条热搜榜" :loading="loading6" :news="toutiao"></NewsCard>
|
||||
<div style="text-align: end;margin-right: 10px">
|
||||
<i class="refresh el-icon-refresh" @click="refresh6"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -26,31 +61,36 @@ export default {
|
||||
|
||||
category: [
|
||||
{
|
||||
name:'百度热搜榜',
|
||||
childUC:[],
|
||||
name: '百度热搜榜',
|
||||
childUC: [],
|
||||
},
|
||||
{
|
||||
name:'抖音热搜榜',
|
||||
childUC:[],
|
||||
name: '抖音热搜榜',
|
||||
childUC: [],
|
||||
},
|
||||
{
|
||||
name:'微博热搜榜',
|
||||
childUC:[],
|
||||
name: '微博热搜榜',
|
||||
childUC: [],
|
||||
},
|
||||
{
|
||||
name:'知乎热搜榜',
|
||||
childUC:[],
|
||||
name: '知乎热搜榜',
|
||||
childUC: [],
|
||||
},
|
||||
{
|
||||
name:'哔哩哔哩热搜榜',
|
||||
childUC:[],
|
||||
name: '哔哩哔哩热搜榜',
|
||||
childUC: [],
|
||||
},
|
||||
{
|
||||
name:'今日头条热搜榜',
|
||||
childUC:[],
|
||||
name: '今日头条热搜榜',
|
||||
childUC: [],
|
||||
},
|
||||
],
|
||||
loading: true,
|
||||
loading1: true,
|
||||
loading2: true,
|
||||
loading3: true,
|
||||
loading4: true,
|
||||
loading5: true,
|
||||
loading6: true,
|
||||
baidu: {
|
||||
title: "百度热搜榜",
|
||||
hot: [],
|
||||
@ -100,8 +140,61 @@ export default {
|
||||
},
|
||||
computed: {},
|
||||
methods: {
|
||||
refresh1() {
|
||||
this.loading1=true;
|
||||
this.baidu.hot=[];
|
||||
setTimeout(()=>{
|
||||
this.loading1=false
|
||||
},3000)
|
||||
this.getBaiDuHot();
|
||||
},
|
||||
refresh2() {
|
||||
this.loading2=true;
|
||||
this.douying.hot=[];
|
||||
setTimeout(()=>{
|
||||
this.loading2=false
|
||||
},3000)
|
||||
this.getDouyingHot();
|
||||
},
|
||||
refresh3() {
|
||||
this.loading3=true;
|
||||
this.weibo.hot=[];
|
||||
setTimeout(()=>{
|
||||
this.loading3=false
|
||||
},3000)
|
||||
this.getWeiBoHot();
|
||||
},
|
||||
refresh4() {
|
||||
this.loading4=true;
|
||||
this.zhihu.hot=[];
|
||||
setTimeout(()=>{
|
||||
this.loading4=false
|
||||
},3000)
|
||||
this.getZhiHuHot();
|
||||
},
|
||||
refresh5() {
|
||||
this.loading5=true;
|
||||
this.bili.hot=[];
|
||||
setTimeout(()=>{
|
||||
this.loading5=false
|
||||
},3000)
|
||||
this.getBiliHot();
|
||||
},
|
||||
refresh6() {
|
||||
this.loading6=true;
|
||||
this.toutiao.hot=[];
|
||||
setTimeout(()=>{
|
||||
this.loading6=false
|
||||
},3000)
|
||||
this.getTouTiaoHot();
|
||||
},
|
||||
getPath() {
|
||||
if (this.$route.query.name) {
|
||||
document.querySelector(this.$route.query.name).scrollIntoView(true)
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
|
||||
},
|
||||
getBaiDuHot() {
|
||||
let _this = this;
|
||||
@ -116,16 +209,16 @@ export default {
|
||||
offset: 0
|
||||
});
|
||||
} else {
|
||||
_this.loading = false;
|
||||
_this.loading1 = false;
|
||||
_this.baidu.hot = res.data.data;
|
||||
}
|
||||
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
},
|
||||
getDouyingHot() {
|
||||
@ -142,15 +235,15 @@ export default {
|
||||
});
|
||||
} else {
|
||||
_this.douying.hot = res.data.data;
|
||||
_this.loading = false;
|
||||
_this.loading2 = false;
|
||||
}
|
||||
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
},
|
||||
getWeiBoHot() {
|
||||
@ -167,15 +260,15 @@ export default {
|
||||
});
|
||||
} else {
|
||||
_this.weibo.hot = res.data.data;
|
||||
_this.loading = false;
|
||||
_this.loading3 = false;
|
||||
}
|
||||
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
},
|
||||
getZhiHuHot() {
|
||||
@ -192,15 +285,15 @@ export default {
|
||||
});
|
||||
} else {
|
||||
_this.zhihu.hot = res.data.data;
|
||||
_this.loading = false;
|
||||
_this.loading4 = false;
|
||||
}
|
||||
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
},
|
||||
getBiliHot() {
|
||||
@ -217,15 +310,15 @@ export default {
|
||||
});
|
||||
} else {
|
||||
_this.bili.hot = res.data.data;
|
||||
_this.loading = false;
|
||||
_this.loading5 = false;
|
||||
}
|
||||
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
},
|
||||
getTouTiaoHot() {
|
||||
@ -242,15 +335,15 @@ export default {
|
||||
});
|
||||
} else {
|
||||
_this.toutiao.hot = res.data.data;
|
||||
_this.loading = false;
|
||||
_this.loading6 = false;
|
||||
}
|
||||
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
},
|
||||
}
|
||||
@ -265,4 +358,30 @@ export default {
|
||||
justify-content: flex-start;
|
||||
overflow: scroll;
|
||||
}
|
||||
|
||||
|
||||
.widget {
|
||||
color: var(--theme-color);
|
||||
background-color: var(--theme-bg-color);
|
||||
border-radius: 1.0rem;
|
||||
flex-direction: column;
|
||||
height: 540px;
|
||||
position: relative;
|
||||
width: 300px;
|
||||
margin-top: 20px;
|
||||
margin-left: 25px;
|
||||
flex-wrap: nowrap;
|
||||
justify-content: space-between;
|
||||
|
||||
}
|
||||
|
||||
.refresh {
|
||||
//font-weight: bold; font-size: 18px
|
||||
}
|
||||
|
||||
.refresh:hover {
|
||||
font-size: 20px;
|
||||
color: #999ba5;
|
||||
cursor: pointer;
|
||||
}
|
||||
</style>
|
||||
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="wrapper">
|
||||
<div class="widget">
|
||||
|
||||
<div>
|
||||
<div class="thin-bar">
|
||||
<div class="nav">
|
||||
<img v-if="news.icon" :src="news.icon" style="width: 30px;height: 30px;margin-left: 15px">
|
||||
@ -20,11 +20,8 @@
|
||||
<span class="news-content"><el-link v-if="item.name" :underline="false" target="_blank" class="news-url" :href="item.url">{{item.name}}</el-link></span>
|
||||
</div>
|
||||
</div>
|
||||
<div style="text-align: end;margin-right: 10px">
|
||||
<i class="refresh el-icon-refresh" @click="refresh"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
@ -55,31 +52,14 @@ export default {
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.wrapper {
|
||||
margin-top: 20px;
|
||||
margin-left: 25px;
|
||||
width: 300px;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
|
||||
.widget__section {
|
||||
display: flex;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.widget {
|
||||
color: var(--theme-color);
|
||||
background-color: var(--theme-bg-color);
|
||||
border-radius: 1.0rem;
|
||||
flex-direction: column;
|
||||
height: 540px;
|
||||
margin: auto;
|
||||
position: relative;
|
||||
width: 300px;
|
||||
flex-wrap: nowrap;
|
||||
justify-content: space-between;
|
||||
|
||||
}
|
||||
|
||||
.thin-bar {
|
||||
margin-top: 15px;
|
||||
@ -115,15 +95,7 @@ export default {
|
||||
color: var(--theme-color);
|
||||
position: absolute;
|
||||
}
|
||||
.refresh{
|
||||
//font-weight: bold;
|
||||
font-size: 18px
|
||||
}
|
||||
.refresh:hover{
|
||||
font-size: 20px;
|
||||
color: #999ba5;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.hot-rank-1 {
|
||||
color:var(--theme-color);
|
||||
background: #f1404b;
|
||||
|
||||
@ -66,18 +66,16 @@ export default {
|
||||
userId:localStorage.getItem('userId')
|
||||
}
|
||||
}).then(function (res) {
|
||||
if (res.data.data) {
|
||||
|
||||
_this.category = res.data.data;
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
|
||||
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
}else {
|
||||
Vue.prototype.$notify.error({
|
||||
@ -90,7 +88,11 @@ export default {
|
||||
},
|
||||
|
||||
getPath() {
|
||||
if(this.$route.query.name){
|
||||
document.querySelector(this.$route.query.name).scrollIntoView(true)
|
||||
}else{
|
||||
return false;
|
||||
}
|
||||
},
|
||||
|
||||
getUserNav() {
|
||||
@ -104,19 +106,15 @@ export default {
|
||||
}
|
||||
}).then(function (res) {
|
||||
// console.log(res);
|
||||
if (res.data) {
|
||||
_this.userNavList = res.data;
|
||||
_this.loading=false;
|
||||
}else {
|
||||
_this.loading=true;
|
||||
}
|
||||
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error === null ? '' : error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error === null ? '' : error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
} else {
|
||||
Vue.prototype.$notify.error({
|
||||
|
||||
@ -294,11 +294,11 @@ export default {
|
||||
});
|
||||
}
|
||||
}).catch((error)=>{
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error,
|
||||
offset: 50
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 50
|
||||
// });
|
||||
})
|
||||
}else{
|
||||
return;
|
||||
|
||||
@ -54,17 +54,19 @@ export default {
|
||||
userId:localStorage.getItem("userId")
|
||||
}
|
||||
}).then(function (res) {
|
||||
if(res.data){
|
||||
if(res){
|
||||
_this.infoData.cateNum=res.data.cateNum;
|
||||
_this.infoData.urlListNum=res.data.urlListNum;
|
||||
|
||||
}else{
|
||||
return false;
|
||||
}
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
}else {
|
||||
Vue.prototype.$notify.error({
|
||||
|
||||
@ -1,51 +1,42 @@
|
||||
<template>
|
||||
<div class="card" data-state="#about">
|
||||
<div class="card-header">
|
||||
<div class="card-cover" style="background-image: url('@/assets/img/image_processing20200722-26968-18w1tkd.jpg')"></div>
|
||||
<img class="card-avatar" src='@/assets/img/image_processing20200722-26968-18w1tkd.jpg' alt="avatar">
|
||||
<h1 class="card-fullname">UserName</h1>
|
||||
<h2 class="card-jobtitle">common user</h2>
|
||||
<div class="card-cover"
|
||||
style="background-image: url('https://pic.imgdb.cn/item/658af285c458853aef9177aa.jpg')"></div>
|
||||
<!-- <img class="card-avatar" src="https://pic.imgdb.cn/item/658af285c458853aef9177aa.jpg" alt="avatar">-->
|
||||
<el-avatar v-if="user.avatar===null" class="card-avatar" alt="avatar"> {{user.userLogin}}</el-avatar>
|
||||
<el-avatar v-if="user.avatar!==null" class="card-avatar" :src="user.avatar" alt="avatar"></el-avatar>
|
||||
<h1 v-if="user.nickname===null" class="card-fullname">{{user.userLogin}}</h1>
|
||||
<h1 v-if="user.nickname!==null" class="card-fullname">{{user.nickname}}</h1>
|
||||
<h2 v-if="user.roleId===1" class="card-jobtitle">common user</h2>
|
||||
<h2 v-if="user.roleId===0" class="card-jobtitle">Admin</h2>
|
||||
</div>
|
||||
<div class="card-main">
|
||||
<div class="card-section is-active" id="about">
|
||||
<div class="card-content">
|
||||
<div class="card-subtitle">ABOUT</div>
|
||||
<p class="card-desc">用户描述
|
||||
<p class="card-desc">用户描述...
|
||||
</p>
|
||||
</div>
|
||||
<div class="card-social">
|
||||
<a href="#"><svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M15.997 3.985h2.191V.169C17.81.117 16.51 0 14.996 0c-3.159 0-5.323 1.987-5.323 5.639V9H6.187v4.266h3.486V24h4.274V13.267h3.345l.531-4.266h-3.877V6.062c.001-1.233.333-2.077 2.051-2.077z"></path></svg></a>
|
||||
<a href="#"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
|
||||
<path d="M512 97.248c-19.04 8.352-39.328 13.888-60.48 16.576 21.76-12.992 38.368-33.408 46.176-58.016-20.288 12.096-42.688 20.64-66.56 25.408C411.872 60.704 384.416 48 354.464 48c-58.112 0-104.896 47.168-104.896 104.992 0 8.32.704 16.32 2.432 23.936-87.264-4.256-164.48-46.08-216.352-109.792-9.056 15.712-14.368 33.696-14.368 53.056 0 36.352 18.72 68.576 46.624 87.232-16.864-.32-33.408-5.216-47.424-12.928v1.152c0 51.008 36.384 93.376 84.096 103.136-8.544 2.336-17.856 3.456-27.52 3.456-6.72 0-13.504-.384-19.872-1.792 13.6 41.568 52.192 72.128 98.08 73.12-35.712 27.936-81.056 44.768-130.144 44.768-8.608 0-16.864-.384-25.12-1.44C46.496 446.88 101.6 464 161.024 464c193.152 0 298.752-160 298.752-298.688 0-4.64-.16-9.12-.384-13.568 20.832-14.784 38.336-33.248 52.608-54.496z"></path></svg></a>
|
||||
<a href="#"><svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M301 256c0 24.852-20.148 45-45 45s-45-20.148-45-45 20.148-45 45-45 45 20.148 45 45zm0 0"></path>
|
||||
<path d="M332 120H180c-33.086 0-60 26.914-60 60v152c0 33.086 26.914 60 60 60h152c33.086 0 60-26.914 60-60V180c0-33.086-26.914-60-60-60zm-76 211c-41.355 0-75-33.645-75-75s33.645-75 75-75 75 33.645 75 75-33.645 75-75 75zm86-146c-8.285 0-15-6.715-15-15s6.715-15 15-15 15 6.715 15 15-6.715 15-15 15zm0 0"></path>
|
||||
<path d="M377 0H135C60.562 0 0 60.563 0 135v242c0 74.438 60.563 135 135 135h242c74.438 0 135-60.563 135-135V135C512 60.562 451.437 0 377 0zm45 332c0 49.625-40.375 90-90 90H180c-49.625 0-90-40.375-90-90V180c0-49.625 40.375-90 90-90h152c49.625 0 90 40.375 90 90zm0 0"></path></svg></a>
|
||||
<a href="#"><svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M23.994 24v-.001H24v-8.802c0-4.306-.927-7.623-5.961-7.623-2.42 0-4.044 1.328-4.707 2.587h-.07V7.976H8.489v16.023h4.97v-7.934c0-2.089.396-4.109 2.983-4.109 2.549 0 2.587 2.384 2.587 4.243V24zM.396 7.977h4.976V24H.396zM2.882 0C1.291 0 0 1.291 0 2.882s1.291 2.909 2.882 2.909 2.882-1.318 2.882-2.909A2.884 2.884 0 002.882 0z"></path></svg></a>
|
||||
<div class="card-content">
|
||||
<div class="card-subtitle">TIME OF REGISTRATION</div>
|
||||
<p class="card-desc">{{user.userRegistered}}
|
||||
</p>
|
||||
</div>
|
||||
<!-- <div class="card-social">-->
|
||||
<!-- -->
|
||||
<!-- </div>-->
|
||||
</div>
|
||||
<div class="card-section" id="experience">
|
||||
<div class="card-content">
|
||||
<div class="card-subtitle">登录日志</div>
|
||||
<div class="card-timeline">
|
||||
<div class="card-item" data-year="2014">
|
||||
<div class="card-item-title">Front-end Developer at <span>JotForm</span></div>
|
||||
<div class="card-item-desc">Disrupt stumptown retro everyday carry unicorn.</div>
|
||||
</div>
|
||||
<div class="card-item" data-year="2016">
|
||||
<div class="card-item-title">UI Developer at <span>GitHub</span></div>
|
||||
<div class="card-item-desc">Developed new conversion funnels and disrupt.</div>
|
||||
</div>
|
||||
<div class="card-item" data-year="2018">
|
||||
<div class="card-item-title">Illustrator at <span>Google</span></div>
|
||||
<div class="card-item-desc">Onboarding illustrations for App.</div>
|
||||
</div>
|
||||
<div class="card-item" data-year="2020">
|
||||
<div class="card-item-title">Full-Stack Developer at <span>CodePen</span></div>
|
||||
<div class="card-item-desc">Responsible for the encomposing brand expreience.</div>
|
||||
<div v-if="loginLogs" v-for="(item,index) in loginLogs" :key="index" class="card-item" :data-year="item.loginTime.substring(0, 4)">
|
||||
<div v-if="item.loginIp" class="card-item-title">{{item.loginIp}} <span v-if="user.userLogin">: {{user.userLogin}}</span></div>
|
||||
<div v-if="item.loginTime" class="card-item-title">{{item.loginTime}}</div>
|
||||
<div v-if="item.location" class="card-item-desc">{{item.location}}</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -53,40 +44,122 @@
|
||||
<div class="card-content">
|
||||
<div class="card-subtitle">CONTACT</div>
|
||||
<div class="card-contact-wrapper">
|
||||
<div class="card-contact">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||
<path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0118 0z"></path>
|
||||
<circle cx="12" cy="10" r="3"></circle></svg>
|
||||
Algonquin Rd, Three Oaks Vintage, MI, 49128
|
||||
<!-- <div class="card-contact">-->
|
||||
<!-- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor"-->
|
||||
<!-- stroke-width="2" stroke-linecap="round" stroke-linejoin="round">-->
|
||||
<!-- <path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0118 0z"></path>-->
|
||||
<!-- <circle cx="12" cy="10" r="3"></circle>-->
|
||||
<!-- </svg>-->
|
||||
<!-- Algonquin Rd, Three Oaks Vintage, MI, 49128-->
|
||||
<!-- </div>-->
|
||||
<div class="card-contact" v-if="user.phone">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
||||
stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||
<path
|
||||
d="M22 16.92v3a2 2 0 01-2.18 2 19.79 19.79 0 01-8.63-3.07 19.5 19.5 0 01-6-6 19.79 19.79 0 01-3.07-8.67A2 2 0 014.11 2h3a2 2 0 012 1.72 12.84 12.84 0 00.7 2.81 2 2 0 01-.45 2.11L8.09 9.91a16 16 0 006 6l1.27-1.27a2 2 0 012.11-.45 12.84 12.84 0 002.81.7A2 2 0 0122 16.92z"></path>
|
||||
</svg>
|
||||
{{user.phone}}
|
||||
</div>
|
||||
<div class="card-contact">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||
<path d="M22 16.92v3a2 2 0 01-2.18 2 19.79 19.79 0 01-8.63-3.07 19.5 19.5 0 01-6-6 19.79 19.79 0 01-3.07-8.67A2 2 0 014.11 2h3a2 2 0 012 1.72 12.84 12.84 0 00.7 2.81 2 2 0 01-.45 2.11L8.09 9.91a16 16 0 006 6l1.27-1.27a2 2 0 012.11-.45 12.84 12.84 0 002.81.7A2 2 0 0122 16.92z"></path></svg>(269) 756-9809</div>
|
||||
<div class="card-contact">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
||||
stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||
<path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path>
|
||||
<path d="M22 6l-10 7L2 6"></path></svg>
|
||||
william@rocheald.com
|
||||
<path d="M22 6l-10 7L2 6"></path>
|
||||
</svg>
|
||||
{{user.userEmail}}
|
||||
</div>
|
||||
<button class="contact-me">WORK TOGETHER</button>
|
||||
<!-- <button class="contact-me">注销账号</button>-->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-section" id="update">
|
||||
<div class="card-content">
|
||||
<div class="card-subtitle">修改信息</div>
|
||||
<el-form :model="updateForm" :rules="rules" ref="updateForm" class="form">
|
||||
<el-form-item prop="avatar">
|
||||
<el-input
|
||||
v-model="updateForm.avatar"
|
||||
prefix-icon="el-icon-link"
|
||||
placeholder="头像链接"
|
||||
auto-complete="off"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="nickname">
|
||||
<el-input
|
||||
v-model="updateForm.nickname"
|
||||
prefix-icon="el-icon-user"
|
||||
placeholder="昵称"
|
||||
auto-complete="off"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="phone">
|
||||
<el-input
|
||||
v-model="updateForm.phone"
|
||||
prefix-icon="el-icon-phone"
|
||||
placeholder="联系电话"
|
||||
auto-complete="off"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<div class="login-btn" style="display: flex;flex-direction: row;justify-content: space-between">
|
||||
<el-button @click="resetForm('updateForm')">重置</el-button>
|
||||
<el-button type="primary" @click="updateUserInfo('updateForm')">确认
|
||||
</el-button
|
||||
>
|
||||
</div>
|
||||
</el-form-item>
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="card-buttons">
|
||||
<button data-section="#about" class="is-active">我的</button>
|
||||
<button data-section="#experience">修改</button>
|
||||
<button data-section="#contact">联系方式</button>
|
||||
<button data-section="#experience">日志</button>
|
||||
<button data-section="#update">修改信息</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import axios from "axios";
|
||||
import Vue from "vue";
|
||||
|
||||
export default {
|
||||
name: "PersonalInfoCard",
|
||||
data() {
|
||||
return {}
|
||||
return {
|
||||
user:{
|
||||
avatar:null,
|
||||
id:null,
|
||||
nickname:null,
|
||||
phone:null,
|
||||
userEmail:null,
|
||||
userLogin:null,
|
||||
userRegistered:null,
|
||||
roleId:null
|
||||
},
|
||||
loginLogs:[],
|
||||
updateForm:{
|
||||
avatar:null,
|
||||
nickname:null,
|
||||
phone:null,
|
||||
},
|
||||
rules: {
|
||||
avatar: [
|
||||
// required：规则，o：失去焦点触发
|
||||
{required: true, message: "请输入头像链接", trigger: "blur"},
|
||||
],
|
||||
nickname: [{required: true, message: "请输入昵称", trigger: "blur"}],
|
||||
phone: [{required: true, message: "请输入联系电话", trigger: "blur"}],
|
||||
},
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getUserAllInfo();
|
||||
this.getUserLoginLogs();
|
||||
const buttons = document.querySelectorAll(".card-buttons button");
|
||||
const sections = document.querySelectorAll(".card-section");
|
||||
const card = document.querySelector(".card");
|
||||
@ -112,7 +185,124 @@ export default {
|
||||
|
||||
},
|
||||
computed: {},
|
||||
methods: {}
|
||||
methods: {
|
||||
//重置
|
||||
resetForm(formName) {
|
||||
this.$refs[formName].resetFields();
|
||||
},
|
||||
updateUserInfo(formName){
|
||||
this.$refs[formName].validate((valid) => {
|
||||
if (valid) {
|
||||
if (localStorage.getItem("Authorization") && localStorage.getItem("userId")) {
|
||||
let _this=this;
|
||||
axios({
|
||||
method: 'get',
|
||||
url: '/api/updateUserDetails',
|
||||
params: {
|
||||
avatar:this.updateForm.avatar,
|
||||
nickname:this.updateForm.nickname,
|
||||
id:localStorage.getItem('userId'),
|
||||
phone:this.updateForm.phone,
|
||||
}
|
||||
}).then(function (res) {
|
||||
if(res.data.code!==200){
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: "修改失败！",
|
||||
offset: 0
|
||||
});
|
||||
}else{
|
||||
Vue.prototype.$notify.success({
|
||||
title: 'OK',
|
||||
message: "修改成功！",
|
||||
offset: 0
|
||||
});
|
||||
_this.getUserAllInfo();
|
||||
}
|
||||
}).catch((error) => {
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
} else {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: "登录状态失效，请重新登录！",
|
||||
offset: 0
|
||||
});
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
},
|
||||
getUserAllInfo() {
|
||||
let _this = this;
|
||||
if (localStorage.getItem("Authorization") && localStorage.getItem("userId")) {
|
||||
axios({
|
||||
method: 'get',
|
||||
url: '/api/getUserDetailes',
|
||||
params: {
|
||||
id: localStorage.getItem("userId")
|
||||
}
|
||||
}).then(function (res) {
|
||||
if(res.data){
|
||||
_this.user.avatar=res.data.avatar;
|
||||
_this.user.id=res.data.id;
|
||||
_this.user.nickname=res.data.nickname;
|
||||
_this.user.phone=res.data.phone;
|
||||
_this.user.userEmail=res.data.userEmail;
|
||||
_this.user.userLogin=res.data.userLogin;
|
||||
_this.user.userRegistered=res.data.userRegistered;
|
||||
_this.user.roleId=res.data.roleId;
|
||||
}
|
||||
}).catch((error) => {
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
} else {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: "登录状态失效，请重新登录！",
|
||||
offset: 0
|
||||
});
|
||||
}
|
||||
|
||||
},
|
||||
getUserLoginLogs() {
|
||||
let _this = this;
|
||||
if (localStorage.getItem("Authorization") && localStorage.getItem("userId")) {
|
||||
axios({
|
||||
method: 'get',
|
||||
url: '/api/getUserLoginLogs',
|
||||
params: {
|
||||
userId: localStorage.getItem("userId")
|
||||
}
|
||||
}).then(function (res) {
|
||||
if(res.data){
|
||||
_this.loginLogs=res.data;
|
||||
}
|
||||
}).catch((error) => {
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
} else {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: "登录状态失效，请重新登录！",
|
||||
offset: 0
|
||||
});
|
||||
}
|
||||
|
||||
},
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
@ -143,6 +333,7 @@ export default {
|
||||
.card[data-state="#about"] {
|
||||
height: 450px;
|
||||
}
|
||||
|
||||
.card[data-state="#about"] .card-main {
|
||||
padding-top: 0;
|
||||
}
|
||||
@ -158,10 +349,12 @@ export default {
|
||||
.card.is-active .card-header {
|
||||
height: 80px;
|
||||
}
|
||||
|
||||
.card.is-active .card-cover {
|
||||
height: 100px;
|
||||
top: -50px;
|
||||
}
|
||||
|
||||
.card.is-active .card-avatar {
|
||||
transform: none;
|
||||
left: 20px;
|
||||
@ -169,15 +362,18 @@ export default {
|
||||
height: 50px;
|
||||
bottom: 10px;
|
||||
}
|
||||
|
||||
.card.is-active .card-fullname,
|
||||
.card.is-active .card-jobtitle {
|
||||
left: 86px;
|
||||
transform: none;
|
||||
}
|
||||
|
||||
.card.is-active .card-fullname {
|
||||
bottom: 18px;
|
||||
font-size: 19px;
|
||||
}
|
||||
|
||||
.card.is-active .card-jobtitle {
|
||||
bottom: 16px;
|
||||
letter-spacing: 1px;
|
||||
@ -192,6 +388,7 @@ export default {
|
||||
width: 100%;
|
||||
transition: 0.3s;
|
||||
}
|
||||
|
||||
.card-header * {
|
||||
transition: 0.3s;
|
||||
}
|
||||
@ -221,8 +418,12 @@ export default {
|
||||
-o-object-fit: cover;
|
||||
object-fit: cover;
|
||||
position: absolute;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
bottom: 0;
|
||||
left: 50%;
|
||||
cursor: pointer;
|
||||
transform: translateX(-50%) translateY(-64px);
|
||||
}
|
||||
|
||||
@ -271,7 +472,7 @@ export default {
|
||||
|
||||
.card-desc {
|
||||
line-height: 1.6;
|
||||
color: #636b6f;
|
||||
color: var(--theme-color);
|
||||
font-size: 14px;
|
||||
margin: 0;
|
||||
font-weight: 400;
|
||||
@ -284,14 +485,16 @@ export default {
|
||||
padding: 0 20px;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.card-social svg {
|
||||
fill: #a5b5ce;
|
||||
width: 16px;
|
||||
display: block;
|
||||
transition: 0.3s;
|
||||
}
|
||||
|
||||
.card-social a {
|
||||
color: #8797a1;
|
||||
color: var(--theme-color);
|
||||
height: 32px;
|
||||
width: 32px;
|
||||
border-radius: 50%;
|
||||
@ -303,9 +506,11 @@ export default {
|
||||
border-radius: 50%;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.card-social a:hover svg {
|
||||
fill: #637faa;
|
||||
}
|
||||
|
||||
.card-social a:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
@ -319,6 +524,7 @@ export default {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.card-buttons button {
|
||||
flex: 1 1 auto;
|
||||
-webkit-user-select: none;
|
||||
@ -337,6 +543,7 @@ export default {
|
||||
outline: 0;
|
||||
border-bottom: 3px solid transparent;
|
||||
}
|
||||
|
||||
.card-buttons button.is-active, .card-buttons button:hover {
|
||||
color: #2b2c48;
|
||||
border-bottom: 3px solid #8a84ff;
|
||||
@ -346,6 +553,7 @@ export default {
|
||||
.card-section {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.card-section.is-active {
|
||||
display: block;
|
||||
-webkit-animation: fadeIn 0.6s both;
|
||||
@ -371,10 +579,12 @@ export default {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.card-timeline {
|
||||
margin-top: 30px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.card-timeline:after {
|
||||
background: linear-gradient(to top, rgba(134, 214, 243, 0) 0%, #516acc 100%);
|
||||
content: "";
|
||||
@ -393,9 +603,11 @@ export default {
|
||||
padding-bottom: 30px;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.card-item:last-child {
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
|
||||
.card-item:after {
|
||||
content: attr(data-year);
|
||||
width: 10px;
|
||||
@ -434,14 +646,16 @@ export default {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 13px;
|
||||
color: #6f6f7b;
|
||||
color: var(--theme-color);
|
||||
font-family: "DM Sans", sans-serif;
|
||||
line-height: 1.6;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.card-contact + .card-contact {
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
.card-contact svg {
|
||||
flex-shrink: 0;
|
||||
width: 30px;
|
||||
|
||||
@ -99,11 +99,11 @@ export default {
|
||||
|
||||
}
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
|
||||
} else {
|
||||
|
||||
@ -83,11 +83,11 @@ export default {
|
||||
}
|
||||
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
|
||||
} else {
|
||||
|
||||
@ -52,11 +52,11 @@ export default {
|
||||
}
|
||||
|
||||
}).catch((error)=>{
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
}else{
|
||||
Vue.prototype.$notify.error({
|
||||
|
||||
@ -152,11 +152,11 @@ export default {
|
||||
}
|
||||
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
}else{
|
||||
Vue.prototype.$notify.error({
|
||||
@ -188,11 +188,11 @@ export default {
|
||||
_this.from.email_sendEmail=res.data.email_sendEmail;
|
||||
}
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
}else{
|
||||
Vue.prototype.$notify.error({
|
||||
|
||||
@ -161,11 +161,11 @@ export default {
|
||||
}
|
||||
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
}else {
|
||||
Vue.prototype.$notify.error({
|
||||
@ -209,11 +209,11 @@ export default {
|
||||
}
|
||||
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
}else{
|
||||
return false
|
||||
|
||||
@ -130,11 +130,11 @@ export default {
|
||||
}
|
||||
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
} else {
|
||||
Vue.prototype.$notify.error({
|
||||
@ -171,11 +171,11 @@ export default {
|
||||
}
|
||||
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
} else {
|
||||
Vue.prototype.$notify.error({
|
||||
@ -222,11 +222,11 @@ export default {
|
||||
}
|
||||
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
} else {
|
||||
Vue.prototype.$notify.error({
|
||||
|
||||
@ -268,11 +268,11 @@ export default {
|
||||
}
|
||||
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
}else {
|
||||
Vue.prototype.$notify.error({
|
||||
@ -327,11 +327,11 @@ export default {
|
||||
}
|
||||
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
}else{
|
||||
Vue.prototype.$notify.error({
|
||||
|
||||
@ -6,17 +6,11 @@
|
||||
:http-request="selectPicUpload"
|
||||
:auto-upload="true"
|
||||
:before-upload="beforeAvatarUpload"
|
||||
:on-remove="handleRemove"
|
||||
:on-preview="handlePictureCardPreview"
|
||||
:limit="1"
|
||||
name="multipartFile"
|
||||
|
||||
>
|
||||
<img v-if="imageUrl" width="200px" height="200px" :src="'data:image/jpg;base64,'+imageUrl" class="avatar" />
|
||||
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
|
||||
<el-dialog :visible.sync="dialogVisible">
|
||||
<img width="100%" :src="dialogImageUrl" alt="">
|
||||
</el-dialog>
|
||||
</el-upload>
|
||||
</template>
|
||||
<script>
|
||||
@ -32,8 +26,6 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
imageUrl: '',
|
||||
dialogImageUrl: '',
|
||||
dialogVisible: false
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
@ -45,10 +37,6 @@ export default {
|
||||
computed: {},
|
||||
methods: {
|
||||
|
||||
handlePictureCardPreview(file) {
|
||||
this.dialogImageUrl = file.url;
|
||||
this.dialogVisible = true;
|
||||
},
|
||||
//上传图标事件
|
||||
selectPicUpload(obj) {
|
||||
|
||||
@ -66,7 +54,7 @@ export default {
|
||||
},
|
||||
data:fd,
|
||||
}).then(function (res) {
|
||||
if(res.data.msg!=="添加成功！"){
|
||||
if(res.data.code!==200){
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: "上传失败！",
|
||||
@ -83,12 +71,12 @@ export default {
|
||||
_this.getImage(_this.configName);
|
||||
}
|
||||
}).catch((error) => {
|
||||
console.log(error)
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error,
|
||||
offset: 0
|
||||
});
|
||||
// console.log(error)
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
}else{
|
||||
return false;
|
||||
@ -115,17 +103,17 @@ export default {
|
||||
name:name
|
||||
},
|
||||
}).then(function (res) {
|
||||
if(res){
|
||||
if(res!==undefined){
|
||||
_this.imageUrl=btoa(new Uint8Array(res.data).reduce((data, byte) => data + String.fromCharCode(byte), '')), 'base64';
|
||||
}else{
|
||||
return false;
|
||||
}
|
||||
}).catch((error) => {
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error,
|
||||
offset: 0
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 0
|
||||
// });
|
||||
})
|
||||
}else{
|
||||
return false;
|
||||
@ -149,9 +137,9 @@ export default {
|
||||
const isJPG = file.type === "image/jpeg";
|
||||
const isJPG2 = file.type === "image/jpg";
|
||||
const isPNG = file.type === "image/png";
|
||||
const isGif = file.type === "image/gif";
|
||||
// const isGif = file.type === "image/gif";
|
||||
const isLt5M = file.size / 1024 / 1024 < 5;
|
||||
if (!isJPG && !isJPG2 && !isPNG && !isGif) {
|
||||
if (!isJPG && !isJPG2 && !isPNG) {
|
||||
this.$message.warning("只支持jpg,png,jpeg,gif格式图片");
|
||||
}
|
||||
if (!isLt5M) {
|
||||
@ -159,9 +147,6 @@ export default {
|
||||
}
|
||||
return (isJPG || isJPG2 || isPNG) && isLt5M;
|
||||
},
|
||||
handleRemove(file) {
|
||||
this.imageUrl = "";
|
||||
},
|
||||
|
||||
|
||||
}
|
||||
|
||||
@ -302,11 +302,11 @@ export default {
|
||||
});
|
||||
}
|
||||
}).catch((error)=>{
|
||||
Vue.prototype.$notify.error({
|
||||
title: '错误',
|
||||
message: error,
|
||||
offset: 50
|
||||
});
|
||||
// Vue.prototype.$notify.error({
|
||||
// title: '错误',
|
||||
// message: error,
|
||||
// offset: 50
|
||||
// });
|
||||
})
|
||||
}else{
|
||||
return;
|
||||
|
||||
@ -18,7 +18,9 @@
|
||||
<div class="app">
|
||||
<HomeHeader></HomeHeader>
|
||||
<!-- <router-view></router-view>-->
|
||||
<keep-alive>
|
||||
<router-view></router-view>
|
||||
</keep-alive>
|
||||
<div class="overlay-app"></div>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user