Merge pull request #98 from dataease/pr@dev@feat_标题增加字体加粗等样式

feat(视图): 标题增加字体样式

frontend/src/lang/en.js

@@ -730,7 +730,9 @@ export default {
     axis_type_dotted: 'Dotted',
     axis_label_show: 'Label Show',
     axis_label_color: 'Label Color',
-    axis_label_fontsize: 'Label Fontsize'
+    axis_label_fontsize: 'Label Fontsize',
+    text_style: 'Font Style',
+    bolder: 'Bolder'
   },
   dataset: {
     sheet_warn: 'There are multiple sheet pages, and the first one is extracted by default',

frontend/src/lang/tw.js

@@ -772,7 +772,9 @@ export default {
     axis_type_dotted: '點',
     axis_label_show: '標簽顯示',
     axis_label_color: '標簽顏色',
-    axis_label_fontsize: '標簽大小'
+    axis_label_fontsize: '標簽大小',
+    text_style: '字體樣式',
+    bolder: '加粗'
   },
   dataset: {
     sheet_warn: '有多個sheet頁面，默認抽取第一個',

frontend/src/lang/zh.js

@@ -730,7 +730,9 @@ export default {
     axis_type_dotted: '点',
     axis_label_show: '标签显示',
     axis_label_color: '标签颜色',
-    axis_label_fontsize: '标签大小'
+    axis_label_fontsize: '标签大小',
+    text_style: '字体样式',
+    bolder: '加粗'
   },
   dataset: {
     sheet_warn: '有多个 Sheet 页，默认抽取第一个',

frontend/src/views/chart/chart/chart.js

@@ -63,7 +63,8 @@ export const DEFAULT_TITLE_STYLE = {
   color: '#303133',
   hPosition: 'center',
   vPosition: 'top',
-  isItalic: false
+  isItalic: false,
+  isBolder: false
 }
 export const DEFAULT_LEGEND_STYLE = {
   show: true,

frontend/src/views/chart/chart/common/common.js

@@ -11,6 +11,7 @@ export function componentStyle(chart_option, chart) {
       style.fontSize = customStyle.text.fontSize
       style.color = customStyle.text.color
       customStyle.text.isItalic ? style.fontStyle = 'italic' : style.fontStyle = 'normal'
+      customStyle.text.isBolder ? style.fontWeight = 'bold' : style.fontWeight = 'normal'
       chart_option.title.textStyle = style
     }
     if (customStyle.legend) {

frontend/src/views/chart/components/component-style/TitleSelector.vue

@@ -44,8 +44,9 @@
                 <el-radio-button label="bottom">{{ $t('chart.text_pos_bottom') }}</el-radio-button>
               </el-radio-group>
             </el-form-item>
-            <el-form-item :label="$t('chart.text_italic')" class="form-item">
+            <el-form-item :label="$t('chart.text_style')" class="form-item">
               <el-checkbox v-model="titleForm.isItalic" @change="changeTitleStyle">{{ $t('chart.italic') }}</el-checkbox>
+              <el-checkbox v-model="titleForm.isBolder" @change="changeTitleStyle">{{ $t('chart.bolder') }}</el-checkbox>
             </el-form-item>
           </el-form>
         </el-col>

frontend/src/views/chart/components/normal/LabelNormal.vue

@@ -50,7 +50,8 @@ export default {
         fontSize: '18px',
         color: '#303133',
         textAlign: 'left',
-        fontStyle: 'normal'
+        fontStyle: 'normal',
+        fontWeight: 'normal'
       },
       content_class: {
         display: 'flex',
@@ -136,6 +137,7 @@ export default {
           this.title_class.color = customStyle.text.color
           this.title_class.textAlign = customStyle.text.hPosition
           this.title_class.fontStyle = customStyle.text.isItalic ? 'italic' : 'normal'
+          this.title_class.fontWeight = customStyle.text.isBolder ? 'bold' : 'normal'
         }
         if (customStyle.background) {
           this.bg_class.background = hexColorToRGBA(customStyle.background.color, customStyle.background.alpha)

frontend/src/views/chart/components/table/TableNormal.vue

@@ -60,7 +60,8 @@ export default {
         fontSize: '18px',
         color: '#303133',
         textAlign: 'left',
-        fontStyle: 'normal'
+        fontStyle: 'normal',
+        fontWeight: 'normal'
       },
       bg_class: {
         background: hexColorToRGBA('#ffffff', 0)
@@ -175,6 +176,7 @@ export default {
           this.title_class.color = customStyle.text.color
           this.title_class.textAlign = customStyle.text.hPosition
           this.title_class.fontStyle = customStyle.text.isItalic ? 'italic' : 'normal'
+          this.title_class.fontWeight = customStyle.text.isBolder ? 'bold' : 'normal'
         }
         if (customStyle.background) {
           this.bg_class.background = hexColorToRGBA(customStyle.background.color, customStyle.background.alpha)