增加标题文字大小控制
This commit is contained in:
@@ -37,6 +37,7 @@ export default {
|
|||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
title: {default: "数字乡村数据大屏"},
|
title: {default: "数字乡村数据大屏"},
|
||||||
|
titleSize:{default:38},
|
||||||
views: {
|
views: {
|
||||||
default: () => []
|
default: () => []
|
||||||
},
|
},
|
||||||
@@ -296,7 +297,7 @@ export default {
|
|||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
line-height: 38px;
|
line-height: 38px;
|
||||||
letter-spacing: 2px;
|
letter-spacing: 2px;
|
||||||
text-shadow: 0px 2px 4px rgba(117, 9, 9, 0.1);
|
text-shadow: 0 2px 4px rgba(117, 9, 9, 0.1);
|
||||||
background: linear-gradient(180deg, #FFF6C7 0%, #FF9A02 100%);
|
background: linear-gradient(180deg, #FFF6C7 0%, #FF9A02 100%);
|
||||||
-webkit-background-clip: text;
|
-webkit-background-clip: text;
|
||||||
-webkit-text-fill-color: transparent;
|
-webkit-text-fill-color: transparent;
|
||||||
@@ -322,7 +323,7 @@ export default {
|
|||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
color: #FF9A02;
|
color: #FF9A02;
|
||||||
line-height: 22px;
|
line-height: 22px;
|
||||||
text-shadow: 0px 2px 4px rgba(117, 9, 9, 0.1);
|
text-shadow: 0 2px 4px rgba(117, 9, 9, 0.1);
|
||||||
background: linear-gradient(180deg, #FFF6C7 0%, #FF9A02 100%);
|
background: linear-gradient(180deg, #FFF6C7 0%, #FF9A02 100%);
|
||||||
-webkit-background-clip: text;
|
-webkit-background-clip: text;
|
||||||
-webkit-text-fill-color: transparent;
|
-webkit-text-fill-color: transparent;
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
<template>
|
<template>
|
||||||
<section class="primary">
|
<section class="primary">
|
||||||
<div flex class="content">
|
<div flex class="content">
|
||||||
<b class="headerTitle" v-text="title"/>
|
<b class="headerTitle" v-text="title" :style="titleStyle"/>
|
||||||
<el-tabs class="fill" v-model="current" @tab-click="$emit('change', current)">
|
<el-tabs class="fill" v-model="current" @tab-click="$emit('change', current)">
|
||||||
<el-tab-pane v-for="tab in tabs" :key="tab.id" :label="tab.label" :name="tab.id"/>
|
<el-tab-pane v-for="tab in tabs" :key="tab.id" :label="tab.label" :name="tab.id"/>
|
||||||
</el-tabs>
|
</el-tabs>
|
||||||
@@ -40,7 +40,10 @@ export default {
|
|||||||
// {label: "测试哦哦", id: 8},
|
// {label: "测试哦哦", id: 8},
|
||||||
// {label: "测试哦哦", id: 9},
|
// {label: "测试哦哦", id: 9},
|
||||||
// {label: "测试哦哦", id: 10},
|
// {label: "测试哦哦", id: 10},
|
||||||
]
|
],
|
||||||
|
titleStyle: v => ({
|
||||||
|
fontSize: `${v.$attrs.titleSize || 38}px`,
|
||||||
|
})
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
<template>
|
<template>
|
||||||
<section class="preview">
|
<section class="preview">
|
||||||
<ai-dv-wrapper :views="[{label: '返回'}]" :theme="config.theme" @change="handleBack" v-if="screenId" :title="info.name" :background="bgImg">
|
<ai-dv-wrapper :views="[{label: '返回'}]" :theme="config.theme" @change="handleBack" v-if="screenId" :title="info.name" :background="bgImg" :titleSize="config.titleSize">
|
||||||
<ai-dv-viewer :urlPrefix="urlPrefix" :instance="instance" :dict="dict" :id="screenId"/>
|
<ai-dv-viewer :urlPrefix="urlPrefix" :instance="instance" :dict="dict" :id="screenId"/>
|
||||||
</ai-dv-wrapper>
|
</ai-dv-wrapper>
|
||||||
</section>
|
</section>
|
||||||
|
|||||||
@@ -66,6 +66,7 @@
|
|||||||
style="height: 100%"
|
style="height: 100%"
|
||||||
:type="dashboard.style"
|
:type="dashboard.style"
|
||||||
:title="$route.query.name"
|
:title="$route.query.name"
|
||||||
|
:titleSize="dashboard.titleSize"
|
||||||
:theme="dashboard.theme"
|
:theme="dashboard.theme"
|
||||||
:background="dashboard.theme == 1 ? 'https://cdn.cunwuyun.cn/dvcp/dv/img/dj_bg.png' : (dashboard.backgroundImage.length ? dashboard.backgroundImage[0].url : '')">
|
:background="dashboard.theme == 1 ? 'https://cdn.cunwuyun.cn/dvcp/dv/img/dj_bg.png' : (dashboard.backgroundImage.length ? dashboard.backgroundImage[0].url : '')">
|
||||||
<div style="width: 100%; height: 100%">
|
<div style="width: 100%; height: 100%">
|
||||||
@@ -120,39 +121,26 @@
|
|||||||
<div class="layout-page__setting layout-right__content" v-else>
|
<div class="layout-page__setting layout-right__content" v-else>
|
||||||
<h2>页面设置</h2>
|
<h2>页面设置</h2>
|
||||||
<div class="layout-config__group">
|
<div class="layout-config__group">
|
||||||
<div class="layout-config__item">
|
<config-item label="屏幕大小">
|
||||||
<label>屏幕大小</label>
|
<el-input-number size="mini" :min="0" v-model="bigscreenWidth" disabled controls-position="right"/>
|
||||||
<div class="layout-config__item--right">
|
<el-input-number size="mini" :min="0" v-model="bigscreenHeight" disabled controls-position="right"/>
|
||||||
<el-input-number size="mini" :min="0" v-model="bigscreenWidth" disabled
|
</config-item>
|
||||||
controls-position="right"></el-input-number>
|
<config-item label="屏幕标题">
|
||||||
<el-input-number size="mini" :min="0" v-model="bigscreenHeight" disabled
|
<el-input v-model="dashboard.title" size="mini"/>
|
||||||
controls-position="right"></el-input-number>
|
<el-input type="number" v-model="dashboard.titleSize" size="mini" placeholder="字体大小" :max="68"/>
|
||||||
</div>
|
</config-item>
|
||||||
</div>
|
<config-item label="主题设置">
|
||||||
<div class="layout-config__item layout-config__item--input">
|
<el-select size="mini" v-model="dashboard.theme" placeholder="请选择">
|
||||||
<label>屏幕标题</label>
|
<el-option label="默认" value="0"></el-option>
|
||||||
<div class="layout-config__item--right">
|
<el-option label="党建" value="1"></el-option>
|
||||||
<el-input v-model="dashboard.title" size="mini"></el-input>
|
</el-select>
|
||||||
</div>
|
</config-item>
|
||||||
</div>
|
<config-item label="样式设置">
|
||||||
<div class="layout-config__item">
|
<el-select size="mini" v-model="dashboard.style" placeholder="请选择">
|
||||||
<label>主题设置</label>
|
<el-option label="默认" value="black"/>
|
||||||
<div class="layout-config__item--right">
|
<el-option label="经典" value="classic"/>
|
||||||
<el-select size="mini" v-model="dashboard.theme" placeholder="请选择">
|
</el-select>
|
||||||
<el-option label="默认" value="0"></el-option>
|
</config-item>
|
||||||
<el-option label="党建" value="1"></el-option>
|
|
||||||
</el-select>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="layout-config__item">
|
|
||||||
<label>样式设置</label>
|
|
||||||
<div class="layout-config__item--right">
|
|
||||||
<el-select size="mini" v-model="dashboard.style" placeholder="请选择">
|
|
||||||
<el-option label="默认" value="black"/>
|
|
||||||
<el-option label="经典" value="classic"/>
|
|
||||||
</el-select>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="layout-config__item">
|
<div class="layout-config__item">
|
||||||
<label>背景图</label>
|
<label>背景图</label>
|
||||||
<div class="layout-config__item--right layout-config__item--bg">
|
<div class="layout-config__item--right layout-config__item--bg">
|
||||||
@@ -235,6 +223,7 @@ import DataConfig from './components/DataConfig.vue'
|
|||||||
import ComponentConfig from "./components/componentConfig.vue";
|
import ComponentConfig from "./components/componentConfig.vue";
|
||||||
import {mapActions} from "vuex"
|
import {mapActions} from "vuex"
|
||||||
import Vue from "vue";
|
import Vue from "vue";
|
||||||
|
import ConfigItem from "./components/configItem.vue";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "viewport",
|
name: "viewport",
|
||||||
@@ -271,6 +260,7 @@ export default {
|
|||||||
componentList: [],
|
componentList: [],
|
||||||
dashboard: {
|
dashboard: {
|
||||||
title: '大屏',
|
title: '大屏',
|
||||||
|
titleSize: 38,
|
||||||
width: 1920,
|
width: 1920,
|
||||||
height: 1080,
|
height: 1080,
|
||||||
theme: '0',
|
theme: '0',
|
||||||
@@ -292,6 +282,7 @@ export default {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
components: {
|
components: {
|
||||||
|
ConfigItem,
|
||||||
ComponentConfig,
|
ComponentConfig,
|
||||||
DataConfig,
|
DataConfig,
|
||||||
VueRulerTool,
|
VueRulerTool,
|
||||||
|
|||||||
Reference in New Issue
Block a user