<template>
|
<div class="log">
|
<header>
|
<div clas="headerTitle">
|
系统设置 >> 门户管理 > logo管理
|
</div>
|
</header>
|
<main>
|
<div class="mainTitle">LOGO</div>
|
<ul class="mainContent">
|
<li>
|
<div class="desc">产品图标：主要用于网页头部</div>
|
<div class="upload">
|
<MyUpload @getPicUrl="setPicUrl" mykey="chromeLinkUrl" :picUrl="icon.chromeLinkUrl"></MyUpload>
|
<div class="uploadTip"><span>只允许上传jpg,jpeg,png,svg格式的图片，建议尺寸为105px*105px</span></div>
|
</div>
|
</li>
|
<li>
|
<div class="desc">网站图标：主要用于浏览器标签页</div>
|
<div class="upload">
|
<MyUpload @getPicUrl="setPicUrl" mykey="websiteHeadUrl" :picUrl="icon.websiteHeadUrl">
|
</MyUpload>
|
<div class="uploadTip"><span>只允许上传jpg,jpeg,png,svg格式的图片，建议尺寸为105px*105px</span></div>
|
</div>
|
</li>
|
<li>
|
<div class="desc">登录页图标：主要用于登录页</div>
|
<div class="upload">
|
<MyUpload @getPicUrl="setPicUrl" mykey="loginPageIconUrl" :picUrl="icon.loginPageIconUrl">
|
</MyUpload>
|
<div class="uploadTip"><span>只允许上传jpg,jpeg,png,svg格式的图片，建议尺寸为105px*105px</span></div>
|
</div>
|
</li>
|
</ul>
|
</main>
|
<footer>
|
<div class="webTitle">
|
<div class="text">网站标题:</div>
|
<div class="inner">
|
<el-input type="text" placeholder="遂昌执法局" v-model="icon.title"></el-input>
|
</div>
|
</div>
|
<div class="footerBtn">
|
<el-button class="cancel">返回</el-button>
|
<el-button type="primary" @click="changeLogo">提交</el-button>
|
</div>
|
</footer>
|
</div>
|
</template>
|
<script>
|
import MyUpload from '@/components/Upload'
|
export default {
|
components: {
|
MyUpload,
|
},
|
data() {
|
return {
|
icon: {
|
loginPageIconUrl: '',
|
websiteHeadUrl: '',
|
chromeLinkUrl: '',
|
title: '',
|
},
|
}
|
|
},
|
methods: {
|
setPicUrl({obj, value}) {
|
const { icon } = this;
|
const baseUrl = 'http://140.143.152.226:8410/';
|
for (let key in icon) {
|
if (key === value) {
|
icon[key] = baseUrl + obj.url1;
|
}
|
}
|
this.icon = icon;
|
},
|
// 更改logo入口
|
async changeLogo() {
|
const {icon} = this;
|
console.log(icon);
|
const preIcon = await this.getIcon();
|
if (preIcon.length === 0) {
|
this.handleChangeLogo();
|
return;
|
}
|
for(let key in icon){
|
if(icon[key]!==''){
|
preIcon[key] = icon[key];
|
}
|
}
|
this.handleChangeLogo(preIcon);
|
},
|
// 获取更改前的logo
|
async getIcon() {
|
let result;
|
await this.$axios({
|
method: 'get',
|
url: 'sccg/system/portal/logo/search',
|
}).then(res => {
|
result = res.data;
|
})
|
return result;
|
},
|
// 执行更改logo操作
|
handleChangeLogo(obj = null) {
|
if (obj === null) {
|
const { icon } = this;
|
for (let key in icon) {
|
if (icon[key] === '') {
|
delete icon[key];
|
}
|
}
|
let length = Object.keys(icon).length;
|
if (length !== 0) {
|
// 发送请求
|
this.$axios({
|
method: 'post',
|
url: 'sccg/system/portal/logo/add',
|
data: icon
|
}).then(res => {
|
console.log(res);
|
if (res.code == 200) {
|
this.$message({
|
message: res.message,
|
type: 'success'
|
})
|
}
|
})
|
}
|
} else {
|
console.log(obj);
|
// 发送请求
|
this.$axios({
|
method: 'put',
|
url: 'sccg/system/portal/logo/update',
|
data: obj
|
}).then(res => {
|
console.log(res);
|
this.$message({
|
message: res.message,
|
type: 'success'
|
})
|
})
|
}
|
localStorage.removeItem('pic');
|
window.location.href='';
|
|
}
|
},
|
}
|
</script>
|
<style lang="scss" scoped>
|
.log {
|
color: #4b9bb7;
|
text-align: left;
|
padding: 20px;
|
|
li {
|
list-style: none;
|
}
|
|
header {
|
line-height: 60px;
|
border-bottom: 1px solid #4b9bb7;
|
}
|
|
main {
|
padding: 0 20px;
|
|
.mainTitle {
|
margin-top: 20px;
|
font-size: 20px;
|
font-weight: 650;
|
line-height: 60px;
|
}
|
|
.mainContent {
|
padding: 0;
|
|
li {
|
margin-top: 30px;
|
|
.desc {
|
line-height: 22px;
|
}
|
|
.upload {
|
display: flex;
|
line-height: 100px;
|
margin-top: 15px;
|
|
.uploadTip {
|
display: flex;
|
align-items: flex-end;
|
margin-left: 20px;
|
font-size: 14px;
|
|
span {
|
line-height: 22px;
|
}
|
}
|
}
|
}
|
}
|
}
|
|
footer {
|
padding: 0 20px;
|
|
.webTitle {
|
display: flex;
|
line-height: 40px;
|
margin: 30px 0;
|
|
.text {
|
flex: 1;
|
}
|
|
.inner {
|
flex: 13;
|
|
.el-input {
|
width: 496px;
|
}
|
|
&::v-deep .el-input__inner {
|
background-color: #09152f;
|
border: 1px solid #17324c;
|
;
|
}
|
}
|
}
|
|
.footerBtn {
|
display: flex;
|
justify-content: center;
|
|
&::v-deep .el-button {
|
padding: 12px 40px;
|
font-weight: 600;
|
}
|
|
.cancel {
|
border: 2px solid #0079fe;
|
color: #0079fe;
|
}
|
}
|
}
|
}
|
</style>
|
