增加标题文字大小控制
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