|
|
@ -1,7 +1,7 @@ |
|
|
|
<template> |
|
|
|
<div class="main"> |
|
|
|
<div class="pageheader"> |
|
|
|
<span class="pagetitle">基本设置</span> |
|
|
|
<span class="pagetitle">{{info.type_desc}}-页面品牌与颜色</span> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="flex-common"> |
|
|
@ -75,7 +75,6 @@ |
|
|
|
<!-- 电脑端内容 --> |
|
|
|
<LogoBackColor :themeColor="themeColor" :navColor="navColor" :tabColor="tabColor"/> |
|
|
|
</template> |
|
|
|
|
|
|
|
</DevicePreview> |
|
|
|
</div> |
|
|
|
</div> |
|
|
@ -83,7 +82,7 @@ |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="save-button"> |
|
|
|
<GuipButton type="primary" :btnstyle="saveBtnStyleObj">保存</GuipButton> |
|
|
|
<GuipButton type="primary" :btnstyle="saveBtnStyleObj" @click="saveConfirm">保存</GuipButton> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</template> |
|
|
@ -98,8 +97,13 @@ import LogoBackColor from "@/components/preview/logoBack_color.vue"; |
|
|
|
import GuipInput from '@/components/GuipInput.vue'; |
|
|
|
|
|
|
|
export default { |
|
|
|
name: '', |
|
|
|
props: [], |
|
|
|
name: 'menuColorSet', |
|
|
|
props: { |
|
|
|
serviceInfo: { |
|
|
|
type: Object, |
|
|
|
required: true |
|
|
|
} |
|
|
|
}, |
|
|
|
components: { |
|
|
|
GuipButton, |
|
|
|
PromptText, |
|
|
@ -113,17 +117,32 @@ export default { |
|
|
|
options: { styleIsolation: "shared" }, |
|
|
|
data() { |
|
|
|
return { |
|
|
|
themeColor:'#3B82F6', |
|
|
|
navColor:'#3B82F6', |
|
|
|
tabColor:'#70A6FF', |
|
|
|
saveBtnStyleObj:{} |
|
|
|
token: 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpYXQiOjE3NTAwNTM3MjQsIm5iZiI6MTc1MDA1MzcyNCwiZXhwIjoxNzUyNjQ1NzI0LCJ1c2VyIjoic3VidXNlciIsImxvZ2luX3R5cGUiOjAsImFpZCI6IjEifQ.xyIqBLelB-k6jCifgRevBJTyg_Qrm6m1e4OcHhOpepU', |
|
|
|
info:{}, |
|
|
|
//添加按钮样式 |
|
|
|
saveBtnStyleObj: { |
|
|
|
width: '144px', |
|
|
|
height: '46px', |
|
|
|
borderRadius: '4px', |
|
|
|
background: '#006AFF', |
|
|
|
}, |
|
|
|
themeColor: undefined, |
|
|
|
navColor: undefined, |
|
|
|
tabColor: undefined, |
|
|
|
} |
|
|
|
}, |
|
|
|
mounted() { |
|
|
|
this.info = this.serviceInfo |
|
|
|
if(this.info.color_info){ |
|
|
|
this.themeColor = '#'+ this.info.color_info.link_btn_color |
|
|
|
this.navColor = '#'+ this.info.color_info.selected_nav_bgcolor |
|
|
|
this.tabColor = '#'+ this.info.color_info.link_btn_color |
|
|
|
} |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
changeThemeColor(val){ |
|
|
|
if (!val.trim().startsWith("#")){ |
|
|
|
this.themeColor = '#'+ val.trim() |
|
|
|
console.log(this.themeColor,'=====xiugai'); |
|
|
|
} |
|
|
|
}, |
|
|
|
changetabColor(val){ |
|
|
@ -135,7 +154,38 @@ export default { |
|
|
|
if (!val.trim().startsWith("#")){ |
|
|
|
this.navColor = '#'+ val.trim() |
|
|
|
} |
|
|
|
}, |
|
|
|
saveConfirm() { |
|
|
|
let obj = {} |
|
|
|
obj.uid = this.info.uid |
|
|
|
obj.type = this.info.type |
|
|
|
obj.logo_bgcolor = this.tabColor.replace('#','') |
|
|
|
obj.link_btn_color = this.themeColor.replace('#','') |
|
|
|
obj.selected_nav_bgcolor = this.navColor.replace('#','') |
|
|
|
|
|
|
|
const that = this |
|
|
|
this.$http('POST', '/agentnew/ajax_update_service_style', obj,{ |
|
|
|
headers:{ |
|
|
|
'Auth': this.token |
|
|
|
} |
|
|
|
}).then(response => { |
|
|
|
if(response.status){ |
|
|
|
that.$message.success('保存成功'); |
|
|
|
|
|
|
|
let color_info = {} |
|
|
|
color_info.logo_bgcolor = obj.logo_bgcolor |
|
|
|
color_info.link_btn_color = obj.link_btn_color |
|
|
|
color_info.selected_nav_bgcolor = obj.selected_nav_bgcolor |
|
|
|
that.info.color_info = color_info |
|
|
|
|
|
|
|
that.$emit('saveEvent', that.info) |
|
|
|
return true; |
|
|
|
} |
|
|
|
that.$message.success(response.info); |
|
|
|
}).catch(error => { |
|
|
|
console.error(error, 'error') |
|
|
|
}) |
|
|
|
}, |
|
|
|
} |
|
|
|
} |
|
|
|
</script> |
|
|
|