elink-star
/
tduck-front
12
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

theme setting.vue

old
wangqing 5 years ago
parent
9c1e4ba1b5
commit
1810286617
6 changed files with 525 additions and 22 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 22
      src/components/parser/Parser.vue
  2. 3
      src/views/form/PreView.vue
  3. 46
      src/views/form/ProjectForm.vue
  4. 5
      src/views/form/index.vue
  5. 415
      src/views/form/setting.vue
  6. 52
      src/views/form/theme.vue

22
src/components/parser/Parser.vue
View File

@ -18,13 +18,19 @@ const layouts = {
colFormItem(h, scheme) { colFormItem(h, scheme) {
const config = scheme.__config__ const config = scheme.__config__
const listeners = buildListeners.call(this, scheme) const listeners = buildListeners.call(this, scheme)
const { formConfCopy ,serialNumber} = this
let labelWidth = config.labelWidth ? `${config.labelWidth}px` : null let labelWidth = config.labelWidth ? `${config.labelWidth}px` : null
if (config.showLabel === false) labelWidth = '0' if (config.showLabel === false) labelWidth = '0'
let label=config.label
if(formConfCopy.showNumber){
this.serialNumber=this.serialNumber+1
label=serialNumber +': ' + label
}
return ( return (
<el-col span={config.span}> <el-col span={config.span}>
<el-form-item label-width={labelWidth} prop={scheme.__vModel__} <el-form-item label-width={labelWidth} prop={scheme.__vModel__}
label={config.showLabel ? config.label : ''}> label={config.showLabel ? label : ''}>
<render conf={scheme} {...{ on: listeners }} /> <render conf={scheme} {...{ on: listeners }} />
</el-form-item> </el-form-item>
</el-col> </el-col>
@ -71,6 +77,11 @@ function renderFrom(h) {
function formBtns(h) { function formBtns(h) {
const { formConfCopy } = this const { formConfCopy } = this
let style={
'background-color':formConfCopy.submitBtnColor,
'border-color':formConfCopy.submitBtnColor
}
let btnSpan=24
if(formConfCopy.resetBtn){ if(formConfCopy.resetBtn){
return <el-col> return <el-col>
<el-form-item size="large" style="margin-top:30px"> <el-form-item size="large" style="margin-top:30px">
@ -86,10 +97,10 @@ function formBtns(h) {
</el-col> </el-col>
} }
return <el-col> return <el-col>
<el-form-item size="large" style="margin-top:30px"> <el-form-item size="large" class="submit-btn-form-item" style="margin-top:30px;">
<el-row type="flex" justify="center" > <el-row type="flex" justify="center" >
<el-col span="8" > <el-col span={btnSpan}>
<el-button type="primary" onClick={this.submitForm}>提交</el-button> <el-button style={style} type="primary" onClick={this.submitForm}>{this.formConfCopy.submitBtnText}</el-button>
</el-col> </el-col>
</el-row> </el-row>
</el-form-item> </el-form-item>
@ -157,6 +168,7 @@ export default {
}, },
data() { data() {
const data = { const data = {
serialNumber: 1,//序号
formConfCopy: deepClone(this.formConf), formConfCopy: deepClone(this.formConf),
[this.formConf.formModel]: {}, [this.formConf.formModel]: {},
[this.formConf.formRules]: {} [this.formConf.formRules]: {}

3
src/views/form/PreView.vue
View File

@ -43,7 +43,8 @@ export default {
mobilePreviewUrl: '', mobilePreviewUrl: '',
projectConfig: { projectConfig: {
projectKey: '', projectKey: '',
showBtns: false preview: true,
showBtns: true
} }
} }
}, },

46
src/views/form/ProjectForm.vue
View File

@ -1,5 +1,7 @@
<template> <template>
<div class="project-form"> <div class="project-form"
:style="{backgroundColor:projectTheme.backgroundColor,
background:projectTheme.backgroundImg?'url('+projectTheme.backgroundImg+') no-repeat center':''}">
<div class=""> <div class="">
<div :style="{textAlign:projectTheme.logoPosition}"> <div :style="{textAlign:projectTheme.logoPosition}">
<img <img
@ -50,7 +52,9 @@ export default {
props: { props: {
projectConfig: { projectConfig: {
projectKey: '', projectKey: '',
showBtn: false showBtns: true,
//预览模式
preview: false
} }
}, },
data() { data() {
@ -75,7 +79,10 @@ export default {
disabled: false, disabled: false,
span: 24, span: 24,
formBtns: true, formBtns: true,
resetBtn: true, resetBtn: false,
submitBtnText: '提交',
submitBtnColor: '#205bb5',
showNumber: false,
unFocusedComponentBorder: true unFocusedComponentBorder: true
} }
} }
@ -83,18 +90,17 @@ export default {
computed: {}, computed: {},
watch: {}, watch: {},
beforeCreate() { beforeCreate() {
console.log(document.querySelector('body'))
document.querySelector('body').className = 'project-body' document.querySelector('body').className = 'project-body'
}, },
created() { created() {
if (this.projectConfig && this.projectConfig.projectKey) { if (this.projectConfig && this.projectConfig.projectKey) {
this.projectKey = this.projectConfig.projectKey this.projectKey = this.projectConfig.projectKey
this.formConf.formBtns = this.projectConfig.showBtns // this.formConf.formBtns = this.projectConfig.showBtns
//不存去路由中尝试获取 ifreme //不存去路由中尝试获取 ifreme
} else if (this.$route.query.key) { } else if (this.$route.query.key) {
this.projectKey = this.$route.query.key this.projectKey = this.$route.query.key
this.formConf.formBtns = false this.formConf.formBtns = true
} }
this.formConf.size = window.innerWidth < 480 ? 'medium' : 'small' this.formConf.size = window.innerWidth < 480 ? 'medium' : 'small'
}, },
@ -106,15 +112,29 @@ export default {
}) })
this.formConf.fields = fields this.formConf.fields = fields
this.formConf.title = res.data.project.name this.formConf.title = res.data.project.name
this.formConf.description = res.data.project.describe
this.formConf.description = res.data.project.describe
if (res.data.userProjectTheme) { if (res.data.userProjectTheme) {
this.projectTheme = res.data.userProjectTheme this.projectTheme = res.data.userProjectTheme
} }
this.formConf.description = res.data.project.describe let {submitBtnText, showNumber,btnsColor} = res.data.userProjectTheme
if (submitBtnText) {
this.formConf.submitBtnText = submitBtnText
}
if (showNumber) {
this.formConf.showNumber = showNumber
}
if(btnsColor){
this.formConf.submitBtnColor = btnsColor
}
} }
}) })
}, },
methods: { methods: {
submitForm(data) { submitForm(data) {
if (this.projectConfig.preview) {
return
}
this.$api.post('/user/project/result/create', { this.$api.post('/user/project/result/create', {
'projectKey': this.projectKey, 'projectKey': this.projectKey,
'collectData': data 'collectData': data
@ -153,6 +173,12 @@ export default {
.logo-img { .logo-img {
max-height: 120px; max-height: 120px;
} }
.submit-btn-form-item{
text-align: left;
}
.submit-btn-form-item button{
width: 20%;
}
@media screen and (max-width: 750px) { @media screen and (max-width: 750px) {
.project-form { .project-form {
@ -168,5 +194,11 @@ export default {
.logo-img { .logo-img {
max-height: 2.94rem; max-height: 2.94rem;
} }
.submit-btn-form-item{
text-align: center;
}
.submit-btn-form-item button{
width: 80%;
}
} }
</style> </style>

5
src/views/form/index.vue
View File

@ -24,17 +24,20 @@
</el-row> </el-row>
<editor :projectKey="projectKey" v-if="activeIndex==1&&projectKey"/> <editor :projectKey="projectKey" v-if="activeIndex==1&&projectKey"/>
<theme :projectKey="projectKey" v-if="activeIndex==2"/> <theme :projectKey="projectKey" v-if="activeIndex==2"/>
<setting :projectKey="projectKey" v-if="activeIndex==3"/>
</div> </div>
</template> </template>
<script> <script>
import editor from './editor' import editor from './editor'
import theme from './theme' import theme from './theme'
import setting from './setting'
export default { export default {
components: { components: {
editor, editor,
theme theme,
setting
}, },
data() { data() {
return { return {

415
src/views/form/setting.vue
View File

@ -0,0 +1,415 @@
<template>
<el-row class="project-setting-container" type="flex" justify="center" align="top">
<el-col :span="5" :offset="3" class="project-setting-view">
<p class="project-setting-title">
提交设置
</p>
<p class="project-setting-label">提交后</p>
<el-row type="flex" align="middle">
<el-col :span="12">
<p class="project-setting-label">显示提示图片</p>
</el-col>
<el-col :span="12">
<el-switch v-model="projectSetting.showPromptImg"/>
</el-col>
</el-row>
<div v-if="projectSetting.showPromptImg">
<div class="block">
<el-image
class="submit-prompt-img"
:src="projectSetting.promptImgUrl"
fit="cover ">
<div slot="error" class="image-slot">
<i class="el-icon-picture-outline"></i>
</div>
</el-image>
</div>
<el-upload
ref="logoUpload"
accept=".jpg,.jpeg,.png,.gif,.bmp,.JPG,.JPEG,.PBG,.GIF,.BMP"
:headers="getUploadHeader"
:on-success="uploadSubmitPromptHandle"
action="/user/file/upload"
:show-file-list="false">
<el-link slot="trigger" size="small" type="primary">请上传提示图片 *</el-link>
</el-upload>
</div>
<el-row type="flex" align="middle">
<el-col :span="12">
<p class="project-setting-label">显示提示文字</p>
</el-col>
<el-col :span="12">
<el-switch v-model="projectSetting.showPromptText"/>
</el-col>
</el-row>
<el-row v-if="projectSetting.showPromptText">
<el-col :span="20" class="setting-input">
<el-input v-model="projectSetting.promptText"/>
</el-col>
</el-row>
<el-row type="flex" align="middle">
<el-col :span="12">
<p class="project-setting-label">跳转网页地址</p>
</el-col>
<el-col :span="12">
<el-switch v-model="projectSetting.showSubmitJumpUrl"/>
</el-col>
</el-row>
<el-row v-if="projectSetting.showSubmitJumpUrl">
<el-col :span="20" class="setting-input">
<el-input v-model="projectSetting.submitJumpUrl"/>
</el-col>
</el-row>
</el-col>
<el-col :span="6" class="project-setting-view" style="text-align: center">
<p class="project-setting-title">
回收设置
</p>
<el-row type="flex" align="middle">
<el-col :span="12">
<p class="project-setting-label">只在微信中填写</p>
</el-col>
<el-col :span="12">
<el-switch v-model="projectSetting.onlyWxWrite"/>
</el-col>
</el-row>
<el-row type="flex" align="middle">
<el-col :span="12">
<p class="project-setting-label">定时收集表单</p>
</el-col>
<el-col :span="12">
<el-switch v-model="projectSetting.timingCollectForm"/>
</el-col>
</el-row>
<div v-if="projectSetting.timingCollectForm">
<el-row type="flex" align="middle">
<el-col :span="8">
<p class="project-setting-sub-label">收集时间：</p>
</el-col>
<el-col :span="15">
<el-input class="setting-input" style="width: 30%" v-model="projectSetting.submitJumpUrl"/>
<span>至</span>
<el-input class="setting-input" style="width: 30%" v-model="projectSetting.submitJumpUrl"/>
</el-col>
</el-row>
<el-row type="flex" align="middle">
<el-col :span="8">
<p class="project-setting-sub-label">未启用提示语：</p>
</el-col>
<el-col :span="15">
<el-input class="setting-input" style="width: 80%" v-model="projectSetting.submitJumpUrl"/>
</el-col>
</el-row>
<el-row type="flex" align="middle">
<el-col :span="8">
<p class="project-setting-sub-label">停用后提示语：</p>
</el-col>
<el-col :span="15">
<el-input class="setting-input" style="width: 80%" v-model="projectSetting.submitJumpUrl"/>
</el-col>
</el-row>
</div>
<el-row type="flex" align="middle">
<el-col :span="12">
<p class="project-setting-label">定时定量表单</p>
</el-col>
<el-col :span="12">
<el-switch v-model="projectSetting.timingQuantitativeForm"/>
</el-col>
</el-row>
<div v-if="projectSetting.timingQuantitativeForm">
<el-row type="flex" align="middle">
<el-col :span="8">
<p class="project-setting-sub-label">收集完成后提示：</p>
</el-col>
<el-col :span="15">
<el-input class="setting-input" style="width: 80%" v-model="projectSetting.submitJumpUrl"/>
</el-col>
</el-row>
</div>
<el-row type="flex" align="middle">
<el-col :span="12">
<p class="project-setting-label">每人限制填写1次</p>
</el-col>
<el-col :span="12">
<el-switch v-model="projectSetting.everyoneWriteOnce"/>
</el-col>
</el-row>
<el-row type="flex" align="middle">
<el-col :span="12">
<p class="project-setting-label">每人限制填写1次</p>
</el-col>
<el-col :span="12">
<el-switch v-model="projectSetting.everyoneDayWriteOnce"/>
</el-col>
</el-row>
<el-row type="flex" align="middle"
v-if="projectSetting.everyoneDayWriteOnce||projectSetting.everyoneWriteOnce">
<el-col :span="8">
<p class="project-setting-sub-label">重复填写后提示：</p>
</el-col>
<el-col :span="15">
<el-input class="setting-input" style="width: 80%" v-model="projectSetting.submitJumpUrl"/>
</el-col>
</el-row>
<el-row type="flex" align="middle">
<el-col :span="12">
<p class="project-setting-label">新反馈提醒我</p>
</el-col>
<el-col :span="12">
<el-switch v-model="projectSetting.newFeedbackRemind"/>
</el-col>
</el-row>
<div v-if="projectSetting.newFeedbackRemind">
<el-row type="flex" align="middle">
<el-col :span="5">
<p class="project-setting-sub-label">发邮件提醒我</p>
</el-col>
<el-col :span="3">
<el-checkbox v-model="projectSetting.newFeedbackRemindEmail"></el-checkbox>
</el-col>
</el-row>
<el-row type="flex" align="middle" v-if="projectSetting.newFeedbackRemindEmail">
<el-col :span="5" :offset="3">
<p class="project-setting-sub-label">请填写邮箱：</p>
</el-col>
<el-col :span="12">
<el-input class="setting-input" style="width: 80%" v-model="projectSetting.submitJumpUrl"/>
</el-col>
</el-row>
<el-row type="flex" align="middle">
<el-col :span="5">
<p class="project-setting-sub-label">发微信提醒我</p>
</el-col>
<el-col :span="3">
<el-checkbox v-model="projectSetting.newFeedbackRemindWx"></el-checkbox>
</el-col>
<el-col :span="10">
<p class="project-setting-sub-label">
需要关注公众号
<el-link>TDUCK</el-link>
</p>
</el-col>
</el-row>
<el-row type="flex" align="middle" v-if="projectSetting.newFeedbackRemindWx">
<el-col :span="5" :offset="3">
<p class="project-setting-sub-label">提醒人：</p>
</el-col>
<el-col :span="12">
<img style="width: 24px;height: 24px;" src=""/>
</el-col>
</el-row>
</div>
<el-row type="flex" align="middle">
<el-col :span="12">
<p class="project-setting-label">记录微信用户个人信息</p>
</el-col>
<el-col :span="12">
<el-switch v-model="projectSetting.recordWxUser"/>
</el-col>
</el-row>
<el-row>
<p class="project-setting-sub-label">
* 开启后将会授权登录，提供微信昵称、性别、城市信息
</p>
</el-row>
</el-col>
<el-col :span="6" class="project-setting-view">
<p class="project-setting-title">
分享设置
</p>
<el-row type="flex" align="middle">
<el-col :span="12">
<p class="project-setting-label">自定义分享图标</p>
</el-col>
<el-col :span="12">
<el-switch v-model="projectSetting.customizeShareIcon"/>
</el-col>
</el-row>
<el-row type="flex" align="middle" v-if="projectSetting.customizeShareIcon">
<el-col :span="10">
<p class="project-setting-label">
请上传分享图片 *
建议尺寸500px*500px
</p>
</el-col>
<el-col :span="12">
<el-upload
ref="logoUpload"
accept=".jpg,.jpeg,.png,.gif,.bmp,.JPG,.JPEG,.PBG,.GIF,.BMP"
:headers="getUploadHeader"
:on-success="uploadSubmitPromptHandle"
action="/user/file/upload"
:show-file-list="false">
<div class="block">
<el-image
class="share-img"
:src="projectSetting.promptImgUrl"
fit="cover ">
<div slot="error" class="image-slot">
<i class="el-icon-picture-outline"></i>
</div>
</el-image>
</div>
</el-upload>
</el-col>
</el-row>
<el-row type="flex" align="middle">
<el-col :span="12">
<p class="project-setting-label">自定义分享标题</p>
</el-col>
<el-col :span="12">
<el-switch v-model="projectSetting.customizeShareTitle" />
</el-col>
</el-row>
<el-row type="flex" align="middle"
v-if="projectSetting.customizeShareTitle">
<el-col :span="8">
<p class="project-setting-sub-label">请输入标题：</p>
</el-col>
<el-col :span="15">
<el-input class="setting-input" style="width: 80%" v-model="projectSetting.submitJumpUrl"/>
</el-col>
</el-row>
<el-row type="flex" align="middle">
<el-col :span="12">
<p class="project-setting-label">自定义分享描述</p>
</el-col>
<el-col :span="12">
<el-switch v-model="projectSetting.customizeShareDesc"/>
</el-col>
</el-row>
<el-row type="flex" align="middle"
v-if="projectSetting.customizeShareDesc">
<el-col :span="8">
<p class="project-setting-sub-label">请输入描述：</p>
</el-col>
<el-col :span="15">
<el-input class="setting-input" style="width: 80%" v-model="projectSetting.submitJumpUrl"/>
</el-col>
</el-row>
</el-col>
</el-row>
</template>
<script>
export default {
name: 'projectSetting',
props: {
projectKey: ''
},
data() {
return {
projectSetting: {
showPromptImg: false,
promptImgUrl: '',
showPromptText: '',
promptText: '提交成功 | ',
showSubmitJumpUrl: false,
submitJumpUrl: '',
onlyWxWrite: false,
timingCollectForm: false,
timingQuantitativeForm: false,
everyoneWriteOnce: false,
everyoneDayWriteOnce: false,
newFeedbackRemind: false,
newFeedbackRemindEmail: false,
newFeedbackRemindWx: false,
recordWxUser: false,
customizeShareIcon: false,
customizeShareTitle: false,
customizeShareDesc: false
}
}
},
computed: {
getUploadHeader() {
return {
'token': this.$store.getters['user/isLogin']
}
}
},
methods: {
uploadSubmitPromptHandle(response, file, fileList) {
this.projectSetting.promptImgUrl = response.data
}
}
}
</script>
<style scoped>
.project-setting-container {
width: 100%;
height: 100%;
min-height: 85vh;
padding: 0px;
margin:10px 0 0 0;
background-color: #F7F7F7;
font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
}
.project-setting-view {
height:100%;
line-height: 20px;
border-radius: 7px;
color: rgba(16, 16, 16, 100);
font-size: 14px;
text-align: center;
font-family: Arial;
border: 1px solid rgba(255, 255, 255, 100);
background-color: white;
margin-right: 10px;
padding: 10px;
}
.project-setting-title {
color: rgba(16, 16, 16, 100);
font-size: 18px;
text-align: left;
font-weight: 550;
margin-left: 20px;
}
.project-setting-label {
color: rgba(16, 16, 16, 100);
font-size: 14px;
text-align: left;
line-height: 20px;
}
.project-setting-sub-label {
color: rgba(144, 147, 149, 100);
font-size: 14px;
text-align: left;
margin-left: 2px;
line-height: 20px;
}
.submit-prompt-img {
width: 340px;
height: 117px;
background-color: #f7f7f7;
display: flex;
align-items: center;
justify-items: center;
justify-content: center;
}
/deep/ .setting-input input {
border: none;
border-bottom: 1px solid rgba(187, 187, 187, 100);
border-radius: 0;
line-height: 20px;
height: 20px;
}
.share-img{
width: 123px;
height: 117px;
background-color: #f7f7f7;
display: flex;
align-items: center;
justify-items: center;
justify-content: center;
}
</style>

52
src/views/form/theme.vue
View File

@ -21,7 +21,7 @@
</el-col> </el-col>
<el-col :span="3"> <el-col :span="3">
<span <span
:class="{'style-btn-active':activeColor=''}" :class="{'style-btn-active':activeColor==''}"
class="style-btn" @click="activeColorHandle('')">全部</span> class="style-btn" @click="activeColorHandle('')">全部</span>
</el-col> </el-col>
<el-col <el-col
@ -118,7 +118,13 @@
<span class="option-line-sub-title">背景类型</span> <span class="option-line-sub-title">背景类型</span>
</el-col> </el-col>
<el-col :spvan="18"> <el-col :spvan="18">
<el-radio-group v-model="showSettings.backgroundType" size="mini"> <el-radio-group
@change="()=>{
this.userProjectTheme.backgroundImg=''
this.userProjectTheme.backgroundColor=''
}"
v-model="showSettings.backgroundType" size="mini">
<el-radio-button label="color">颜色</el-radio-button> <el-radio-button label="color">颜色</el-radio-button>
<el-radio-button label="img">图片</el-radio-button> <el-radio-button label="img">图片</el-radio-button>
</el-radio-group> </el-radio-group>
@ -131,7 +137,10 @@
<span class="option-line-sub-title">选择颜色</span> <span class="option-line-sub-title">选择颜色</span>
</el-col> </el-col>
<el-col :spvan="18"> <el-col :spvan="18">
<el-color-picker v-model="background" size="mini"></el-color-picker> <el-color-picker
@change="saveUserTheme"
v-model=" userProjectTheme.backgroundColor"
size="mini"></el-color-picker>
</el-col> </el-col>
</el-row> </el-row>
</el-row> </el-row>
@ -146,6 +155,7 @@
ref="upload" ref="upload"
accept=".jpg,.jpeg,.png,.gif,.bmp,.JPG,.JPEG,.PBG,.GIF,.BMP" accept=".jpg,.jpeg,.png,.gif,.bmp,.JPG,.JPEG,.PBG,.GIF,.BMP"
:headers="getUploadHeader" :headers="getUploadHeader"
:on-success="uploadBackgroundHandle"
action="/user/file/upload" action="/user/file/upload"
:show-file-list="false"> :show-file-list="false">
<el-link slot="trigger" size="small" type="primary">上传背景</el-link> <el-link slot="trigger" size="small" type="primary">上传背景</el-link>
@ -169,7 +179,10 @@
<span class="option-line-sub-title">按钮提示文字</span> <span class="option-line-sub-title">按钮提示文字</span>
</el-col> </el-col>
<el-col :spvan="10"> <el-col :spvan="10">
<el-input style="width: 80%" v-model="userProjectTheme.submitBtnText" placeholder="请输入内容" size="mini"></el-input> <el-input style="width: 80%"
@change="saveUserTheme"
v-model="userProjectTheme.submitBtnText"
placeholder="请输入内容" size="mini"></el-input>
</el-col> </el-col>
</el-row> </el-row>
</el-row> </el-row>
@ -237,7 +250,8 @@ export default {
showTitle: true, showTitle: true,
showDescribe: true, showDescribe: true,
showNumber: false, showNumber: false,
background: '', backgroundColor: '',
backgroundImg: '',
logoImg: '', logoImg: '',
logoPosition: 'left', logoPosition: 'left',
submitBtnText: '提交' submitBtnText: '提交'
@ -276,6 +290,7 @@ export default {
this.projectKey = this.$route.query.key this.projectKey = this.$route.query.key
this.queryProjectTheme() this.queryProjectTheme()
this.projectFormKey = +new Date() this.projectFormKey = +new Date()
this.queryUserProjectTheme()
}, },
computed: { computed: {
getUploadHeader() { getUploadHeader() {
@ -285,6 +300,11 @@ export default {
} }
}, },
methods: { methods: {
uploadBackgroundHandle(response, file, fileList) {
this.userProjectTheme.backgroundImg = response.data
this.userProjectTheme.backgroundColor = ''
this.saveUserTheme()
},
uploadLogoHandle(response, file, fileList) { uploadLogoHandle(response, file, fileList) {
this.userProjectTheme.logoImg = response.data this.userProjectTheme.logoImg = response.data
this.saveUserTheme() this.saveUserTheme()
@ -295,11 +315,30 @@ export default {
}, },
saveUserTheme() { saveUserTheme() {
this.userProjectTheme.projectKey = this.projectKey this.userProjectTheme.projectKey = this.projectKey
this.userProjectTheme.themeId = this.activeTheme ? this.this.activeTheme.id : '' this.userProjectTheme.themeId = this.activeTheme ? this.activeTheme.id : ''
this.$api.post('/user/project/theme/save', this.userProjectTheme).then(res => { this.$api.post('/user/project/theme/save', this.userProjectTheme).then(res => {
this.projectFormKey = +new Date() this.projectFormKey = +new Date()
}) })
}, },
queryUserProjectTheme() {
this.$api.post(`/user/project/theme/query/${this.projectKey}`).then(res => {
if(!res.data){
return
}
this.userProjectTheme = res.data
let {themeId, logoImg, backgroundImg, backgroundColor, submitBtnText} = res.data
this.activeTheme = {
'id': themeId
}
this.showSettings.logoSetting = logoImg ? true : false
this.showSettings.btnSetting = submitBtnText ? true : false
if (backgroundImg || backgroundColor) {
this.showSettings.backgroundSetting = true
this.showSettings.backgroundType = backgroundImg ? 'img' : 'color'
}
})
},
activeThemeHandle(item) { activeThemeHandle(item) {
if (item) { if (item) {
this.$confirm('切换主题，系统将不会保存您在上一主题所做的修改，请知悉。', '切换主题提醒', { this.$confirm('切换主题，系统将不会保存您在上一主题所做的修改，请知悉。', '切换主题提醒', {
@ -315,6 +354,7 @@ export default {
} }
}, },
activeColorHandle(item) { activeColorHandle(item) {
console.log(item)
this.activeColor = item this.activeColor = item
this.queryProjectTheme() this.queryProjectTheme()
}, },

Write Preview
Loading…
Cancel
Save