修复可用时间段中，选择“有效期内，不规则日期可用”在预览图中未展示可用时间

src/components/knockGold/index.less

@@ -32,11 +32,22 @@
 		}
 
 		.timeList {
+			display: grid;
+			grid-template-columns: repeat(3, 33.33%);
+			text-align: center;
+
 			li {
 				margin: 3px 0;
 				font-size: 12px;
 				color: #a8a8a8;
 			}
+
+		}
+
+		.flex {
+			display: grid;
+			grid-template-columns: repeat(2, 50%);
+
 		}
 	}
 

src/components/knockGold/mobileCmponent.jsx

@@ -2,7 +2,7 @@
  * @Author: Wind
  * @Date: 2022-06-06 14:53:58
  * @LastEditors: Wind
- * @LastEditTime: 2022-08-12 17:41:52
+ * @LastEditTime: 2022-08-15 10:23:22
  * @Description:
  * @FilePath: \frontend\src\components\knockGold\mobileCmponent.jsx
  */
@@ -17,6 +17,56 @@ export default ({ data }) => {
     setNewWeek(sortWeeks(data.ruleWeek))
   }, [data.ruleWeek])
 
+  function createElement(type) {
+    {
+      /*     irregularDate: [[]], //不规则日期
+        irregularTime: [[]], //不规则时间 */
+    }
+    if (data.usable_time === 'week') {
+      return (
+        <div className='available_time'>
+          <h3>可用时间</h3>
+          <ul className='timeList'>
+            {newWeek?.map((item) => (
+              <li>
+                {item}
+                {data.ruleDate.map((item1) => {
+                  if (item1[1])
+                    return (
+                      <p style={{ textAlign: 'center', marginTop: '5px' }}>
+                        {item1[0]}~{item1[1]}
+                      </p>
+                    )
+                })}
+              </li>
+            ))}
+          </ul>
+        </div>
+      )
+    } else if (data.usable_time === 'irregular') {
+      return (
+        <div className='available_time'>
+          <h3>可用时间</h3>
+          <ul className='timeList flex'>
+            {data.irregularDate?.map((item) => (
+              <li style={{ textAlign: 'center' }}>
+                {item.join(' 至 ')}
+                {data.irregularTime.map((item1) => {
+                  if (item1[1])
+                    return (
+                      <p style={{ textAlign: 'center', marginTop: '5px' }}>
+                        {item1[0]}~{item1[1]}
+                      </p>
+                    )
+                })}
+              </li>
+            ))}
+          </ul>
+        </div>
+      )
+    }
+  }
+
   return (
     <div id='reduceKnockGold' className='mobile'>
       <div className='couponShow'>
@@ -54,22 +104,7 @@ export default ({ data }) => {
         <h1>
           - {data.batch_goods_name ? data.batch_goods_name : 'xxx'}兑换说明 -
         </h1>
-
+        {createElement()}
-        {data.usable_time === 'week' ? (
-          <div className='available_time'>
-            <h3>可用时间</h3>
-            <ul className='timeList'>
-              {newWeek?.map((item) => (
-                <li>
-                  {`${item}:
-                  ${data.ruleDate.map((item1) => {
-                    if (item1[1]) return `${item1[0]}~${item1[1]}`
-                  })}`}
-                </li>
-              ))}
-            </ul>
-          </div>
-        ) : null}
         {data.instruction ? (
           <>
             <div className='content'>