fix: 海报优化

services/share_poster.go

@@ -86,7 +86,7 @@ func CreatePosterFromSource(codePage, codeScene, source, version, pars string) (
 		return
 	}
 	// 填充html内容
-	contentStr, err := fillContent2Html(source, pars, sunCodeUrl)
+	contentStr, newHeight, err := fillContent2Html(source, pars, sunCodeUrl, height)
 	if err != nil {
 		errMsg = "html内容有误"
 		return
@@ -95,7 +95,7 @@ func CreatePosterFromSource(codePage, codeScene, source, version, pars string) (
 	htm2ImgReq := make(map[string]interface{})
 	htm2ImgReq["html_content"] = contentStr
 	htm2ImgReq["width"] = width
-	htm2ImgReq["height"] = height
+	htm2ImgReq["height"] = newHeight
 	res, err := postHtml2Img(htm2ImgReq)
 	if err != nil || res == nil {
 		errMsg = "html转图片请求失败"
@@ -274,7 +274,7 @@ type PosterParsReq struct {
 }
 
 // fillContent2Html 填充HTML动态内容
-func fillContent2Html(source string, pars, sunCodeUrl string) (contentStr string, err error) {
+func fillContent2Html(source, pars, sunCodeUrl string, height int) (contentStr string, newHeight int, err error) {
 	params := new(PosterParsReq)
 	if err = json.Unmarshal([]byte(pars), &params); err != nil {
 		return
@@ -284,48 +284,59 @@ func fillContent2Html(source string, pars, sunCodeUrl string) (contentStr string
 	if err != nil {
 		return
 	}
+	newHeight = height
 	contentStr = string(contentByte)
 	// 列表的动态内容不完整的用默认内容的填充
-	emptyTime := false
+	var emptyTime1, emptyTime2 bool
 	if strings.Contains(source, "list") {
 		if params.Title1 == "" || params.Title2 == "" {
 			defaultAvatar := "https://hzstatic.hzinsights.com/static/images/202112/20211210/wn6c3oYKTfT4NbTZgRGflRuIBZaa.png"
 			switch source {
 			case "activity_list":
-				params.ListTitle = "线下沙龙"
-				params.Status1 = "未开始"
-				params.Status2 = "未开始"
-				params.Avatar1 = defaultAvatar
+				if params.Title1 != "" {
+					params.Status2 = params.Status1
+				} else {
+					params.ListTitle = "线下沙龙"
+					params.Status1 = "未开始"
+					params.Avatar1 = defaultAvatar
+					params.Title1 = "周度报告"
+					params.Speaker1 = "FICC研究员"
+					params.Time1 = "2022-5-10"
+					emptyTime1 = true
+				}
 				params.Avatar2 = defaultAvatar
-				params.Title1 = "周度报告"
 				params.Title2 = "周度报告"
-				params.Speaker1 = "FICC研究员"
 				params.Speaker2 = "FICC研究员"
-				params.Time1 = "2022-5-10"
 				params.Time2 = "2022-5-10"
-				emptyTime = true
+				emptyTime2 = true
 			case "special_column_list":
-				params.Stage1 = "第1期"
+				if params.Title1 == "" {
+					params.Stage1 = "第1期"
+					params.Avatar1 = defaultAvatar
+					params.Title1 = "弘则FICC专栏"
+					params.Author1 = "弘则研究"
+					params.Tag1 = "FICC研究员"
+				}
 				params.Stage2 = "第2期"
-				params.Avatar1 = defaultAvatar
 				params.Avatar2 = defaultAvatar
-				params.Title1 = "弘则FICC专栏"
 				params.Title2 = "弘则FICC专栏"
-				params.Author1 = "弘则研究"
 				params.Author2 = "弘则研究"
-				params.Tag1 = "FICC研究员"
 				params.Tag2 = "FICC研究员"
 			case "chart_list":
-				params.Title1 = "螺纹仓单-热卷仓单季节性"
+				if params.Title1 == "" {
+					params.Title1 = "螺纹仓单-热卷仓单季节性"
+					params.Img1 = "https://hzstatic.hzinsights.com/static/images/202112/20211227/8VBIH1l6VraYpLCoBS6qOIXA5Zoq.png"
+				}
 				params.Title2 = "卷螺期货现货价差"
-				params.Img1 = "https://hzstatic.hzinsights.com/static/images/202112/20211227/8VBIH1l6VraYpLCoBS6qOIXA5Zoq.png"
 				params.Img2 = "https://hzstatic.hzinsights.com/static/images/202204/20220427/d8GRfdR3Xfrvk397SnYudcwVs9pV.png"
 			case "report_list":
-				params.Img1 = defaultAvatar
+				if params.Title1 == "" {
+					params.Img1 = defaultAvatar
+					params.Title1 = "弘则FICC研报"
+					params.Time1 = "1期"
+				}
 				params.Img2 = defaultAvatar
-				params.Title1 = "弘则FICC研报"
 				params.Title2 = "弘则FICC研报"
-				params.Time1 = "1期"
 				params.Time2 = "2期"
 			}
 		}
@@ -395,6 +406,9 @@ func fillContent2Html(source string, pars, sunCodeUrl string) (contentStr string
 			"线上会议": "block",
 			"线下沙龙": "none",
 		}
+		if params.Status1 != "未开始" {
+			newHeight = 1715
+		}
 		contentStr = strings.Replace(contentStr, "{{LIST_TITLE}}", "弘则FICC周度电话会安排", 1)
 		contentStr = strings.Replace(contentStr, "{{BG_COLORE_1}}", bgColorMap[params.Status1], 1)
 		contentStr = strings.Replace(contentStr, "{{STATUS_1}}", params.Status1, 1)
@@ -414,13 +428,17 @@ func fillContent2Html(source string, pars, sunCodeUrl string) (contentStr string
 		contentStr = strings.Replace(contentStr, "{{SHOW_ITEM_2}}", statusItemMap[params.Status2], 1)
 		contentStr = strings.Replace(contentStr, "{{SHOW_OFFLINE_2}}", offlineMap[params.ListTitle], 1)
 		contentStr = strings.Replace(contentStr, "{{SHOW_ONLINE_2}}", onlineMap[params.ListTitle], 1)
-		if emptyTime {
-			contentStr = strings.Replace(contentStr, "{{TIME_COLOR_1}}", "#fff", 1)
-			contentStr = strings.Replace(contentStr, "{{TIME_COLOR_2}}", "#fff", 1)
-		} else {
-			contentStr = strings.Replace(contentStr, "{{TIME_COLOR_1}}", "#999", 1)
-			contentStr = strings.Replace(contentStr, "{{TIME_COLOR_2}}", "#999", 1)
+		// 用默认内容填充的活动时间字体颜色调至看不见
+		color1 := "#999"
+		color2 := "#999"
+		if emptyTime1 {
+			color1 = "#fff"
+		}
+		if emptyTime2 {
+			color2 = "#fff"
 		}
+		contentStr = strings.Replace(contentStr, "{{TIME_COLOR_1}}", color1, 1)
+		contentStr = strings.Replace(contentStr, "{{TIME_COLOR_2}}", color2, 1)
 	}
 	contentStr = strings.Replace(contentStr, "{{SUN_CODE}}", sunCodeUrl, 1)
 	return

static/htm2img/activity_detail.html

@@ -72,7 +72,7 @@
         </div>
         <div style="text-align:center;font-size:56px;color:#999">长按图片分享</div>
         <div class="flex">
-            <div style="float: left;">
+            <div style="float: left;margin-top: 65px;">
                 <div>长按识别小程序码</div>
                 <div style="color:#999">查看更多</div>
             </div>

static/htm2img/activity_list.html

@@ -153,7 +153,7 @@
         </div>
         <div style="text-align:center;font-size:56px;color:#999">长按图片分享</div>
         <div class="flex">
-            <div style="float: left;">
+            <div style="float: left;margin-top: 65px;">
                 <div>长按识别小程序码</div>
                 <div style="color:#999">查看更多</div>
             </div>

static/htm2img/chart_detail.html

@@ -60,7 +60,7 @@
         <img class="bg-img" src="{{CHART_IMAGE}}" alt="">
         <div style="text-align:center;font-size:56px;color:#999">长按图片分享</div>
         <div class="flex">
-            <div style="float: left;">
+            <div style="float: left;margin-top: 65px;">
                 <div>长按识别小程序码</div>
                 <div style="color:#999">查看更多</div>
             </div>

static/htm2img/chart_list.html

@@ -89,7 +89,7 @@
         </div>
         <div style="text-align:center;font-size:56px;color:#999">长按图片分享</div>
         <div class="flex">
-            <div style="float: left;">
+            <div style="float: left;margin-top: 65px;">
                 <div>长按识别小程序码</div>
                 <div style="color:#999">查看更多</div>
             </div>

static/htm2img/report_detail.html

@@ -6,73 +6,84 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Document</title>
     <style>
-        html,body{
-            margin: 0;
-            padding: 0;
+        html,
+        body {
+          margin: 0;
+          padding: 0;
         }
-        div{
-            box-sizing: border-box;
+        div {
+          box-sizing: border-box;
         }
-        .box{
-            /* width: 294px;
-            height: 355px; */
-            width: 1176px;
-            height: 1420px;
-            background-color: #fff;
-            padding: 100px 64px 64px 60px;
-            border-radius: 16px;
-            border: 1px solid #ECECEC;
-            background-image: url('https://hzchart.oss-cn-shanghai.aliyuncs.com/static/icon/hzyb/yb-bg-hzlogo.png');
-            background-position: top right;
-            background-size: 336px 336px;
-            background-repeat: no-repeat;
+        .box {
+          /* width: 294px;
+              height: 355px; */
+          width: 1176px;
+          height: 1520px;
+          background-color: #fff;
+          padding: 100px 64px 64px 60px;
+          border-radius: 16px;
+          border: 1px solid #ececec;
+          background-image: url("https://hzchart.oss-cn-shanghai.aliyuncs.com/static/icon/hzyb/yb-bg-hzlogo.png");
+          background-position: top right;
+          background-size: 336px 336px;
+          background-repeat: no-repeat;
         }
-        .title{
-            font-size: 64px;
-            font-weight: bold;
-            margin-bottom: 20px;
+        .title {
+          font-size: 64px;
+          font-weight: bold;
+          margin-bottom: 20px;
         }
-        .sub-title{
-            font-size: 60px;
-            font-weight: bold;
+        .sub-title {
+          font-size: 60px;
+          font-weight: bold;
+          -webkit-line-clamp: 2;
+          -webkit-box-orient: vertical;
+          display: -webkit-box;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          min-height: 140px;
         }
-        .flex{
-            height: 256px;
-            margin-top: 40px;
-            font-size: 56px;
+        .flex {
+          height: 256px;
+          margin-top: 40px;
+          font-size: 56px;
         }
-        .content-box{
-            height: 520px;
-            margin: 80px 0;
-            color: #999;
-            overflow: hidden;
-            font-size: 56px;
+        .content-box {
+          height: 520px;
+          margin: 80px 0;
+          color: #000;
+          overflow: hidden;
+          font-size: 56px;
         }
-        .xcx-img{
-            width: 256px;
-            height: 256px;
-            float: right;
+        .xcx-img {
+          width: 256px;
+          height: 256px;
+          float: right;
         }
         .content-box div {
-            font-size: 34px !important;
-            overflow: inherit !important;
-            line-height: 1.7 !important;
+          font-size: 40px !important;
+          overflow: inherit !important;
+          line-height: 1.7 !important;
+          color: #000 !important;
         }
         .content-box span {
-            font-size: 34px !important;
-            line-height: 1.7 !important;
+          font-size: 40px !important;
+          line-height: 1.7 !important;
+          color: #000 !important;
         }
         .content-box p {
-            font-size: 34px !important;
-            overflow: inherit !important;
-            line-height: 1.7 !important;
+          font-size: 40px !important;
+          overflow: inherit !important;
+          line-height: 1.7 !important;
+          color: #000 !important;
         }
-        .content-box section{
-            overflow: inherit !important;
-            line-height: 1.7 !important;
+        .content-box section {
+          overflow: inherit !important;
+          line-height: 1.7 !important;
+          color: #000 !important;
         }
         .content-box iframe {
-            display: none;
+          display: none;
         }
     </style>
 </head>
@@ -85,7 +96,7 @@
         </div>
         <div style="text-align:center;font-size:56px;color:#999">长按图片分享</div>
         <div class="flex">
-            <div style="float: left;">
+            <div style="float: left;margin-top: 65px;">
                 <div>长按识别小程序码</div>
                 <div style="color:#999">查看更多</div>
             </div>

static/htm2img/report_list.html

@@ -121,7 +121,7 @@
         </div>
         <div style="text-align:center;font-size:56px;color:#999">长按图片分享</div>
         <div class="flex">
-            <div style="float: left;">
+            <div style="float: left;margin-top: 65px;">
                 <div>长按识别小程序码</div>
                 <div style="color:#999">查看更多</div>
             </div>

static/htm2img/special_column_detail.html

@@ -70,7 +70,7 @@
         </div>
         <div style="text-align:center;font-size:56px;color:#999">长按图片分享</div>
         <div class="flex">
-            <div style="float: left;">
+            <div style="float: left;margin-top: 65px;">
                 <div>长按识别小程序码</div>
                 <div style="color:#999">查看更多</div>
             </div>

static/htm2img/special_column_list.html

@@ -155,7 +155,7 @@
         </div>
         <div style="text-align:center;font-size:56px;color:#999">长按图片分享</div>
         <div class="flex">
-            <div style="float: left;">
+            <div style="float: left;margin-top: 65px;">
                 <div>长按识别小程序码</div>
                 <div style="color:#999">查看更多</div>
             </div>